www.pedrogranado.com.br - Filter options are not working

[wellington1993]

URL: https://www.pedrogranado.com.br/alugar

Browser / Version: Firefox Mobile 116.0
Operating System: Android 11
Tested Another Browser: Yes Chrome

Problem type: Site is not usable
Description: Buttons or links not working
Steps to Reproduce:
Filters based on combo box or combo select not working on Firefox mobile. On Chrome the combo works perfect. The cobos appears when click on "Busca avançada"(Advanced search). On Firefox I can't select combo option and the modal appears and dessapear fast.

View the screenshot

Browser Configuration

• gfx.webrender.all: false
• gfx.webrender.blob-images: true
• gfx.webrender.enabled: false
• image.mem.shared: true
• buildID: 20230621040008
• channel: nightly
• hasTouchScreen: true
• mixed active content blocked: false
• mixed passive content blocked: false
• tracking content blocked: false

View console log messages

From webcompat.com with ❤️

[softvision-raul-bucata]

We appreciate your report. I was able to reproduce the issue:

20230626_145122.mp4

Tested with:

Browser / Version: Firefox Release 114.2.0 (2015957435-🦎114.0.2-20230619081400🦎)/ Firefox Nightly 116.0a1 (2015958691-🦎116.0a1-20230625195949🦎)/ Chrome Mobile Version 114.0.5735.130
Operating System: Samsung A51 (Android 11) -1080 × 2400 pixels 20:9 aspect ratio (~405 ppi density)
Operating System: Google Pixel 3 (Android 12) -1080 x 2160 pixels, 18:9 ratio (~443 ppi density)

Notes:

1. Reproducible regardless of the status of ETP.
2. Reproducible on the latest build of Firefox Nightly and Release.
3. Works as expected using Chrome.

Moving this to NeedsDiagnosis for further investigations.

[qa_26/2023]

[wisniewskit]

This reproduces in responsive design mode as well. They're using something called bootstrap-selectpicker, which a quick search reveals has problems with Firefox. That's not fun. If I disable the focus handler on the selects, they seem to work fine. It looks like is the relevant code:

          this.$element.on({
            change: function () {
              E.render(),
              E.$element.trigger('changed.bs.select', y),
              y = null
            },
            focus: function () {
              E.$button.focus()
            }
          })

So when one focuses on the selects, they shift the focus to some kind of button? That's.. bizarre. It's hard a surprise that Firefox would close the select box again in that case.

But the good news is that I see they're using version 1.13.2 of bootstrap-selector, and if I have their scripts load 1.14.0-beta3 or 1.13.18 instead, then I think it's working (at least on the responsive design mode), so there may be hope here.

[wisniewskit]

Ah, yes, this was apparently fixed in bootstrap-selector (it also broke Safari), in snapappointments/bootstrap-select#1828 (apparently in version 1.13.3, but it might have regressed again sometimes, so 1.13.17 or the latest version would be a better upgrade).

So the site really should upgrade to that version.

Unfortunately it's unclear if there's some sort of magic intervention we could ship to fix this.