www.afisha.ru - Slider not working from the "Цена" tab

[webcompat-bot]

URL: https://www.afisha.ru/msk/theatre/

Browser / Version: Firefox 111.01 RUS 64bit
Operating System: Windows 10
Tested Another Browser: Yes Chrome

Problem type: Something else
Description: The "Цена" tab has a non-working slider
Steps to Reproduce:
When opening the "Цена" checkbox, we have all the frozen elements in it.

View the screenshot

Browser Configuration

• None

From webcompat.com with ❤️

[sv-calin]

Thank you for reporting this issue, I was able to reproduce it.

afisha.slider.mp4

Tested on:
• Browser / Version: Firefox Nightly 113.0a1 (2023-04-03) / Firefox Release 111.0.1 / Chrome 111.0.5563.111
• Operating System: Windows 10

Notes:

1. Reproducible on both Firefox Release and Nightly regardless of the ETP status
2. Not reproducible on Chrome

Moving to Needsdiagnosis.

[qa_14/2023]

[ksy36]

The site has pointer-events: none; for the slider, so it doesn't react on interaction:

.gNPvK {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: initial;
  height: calc(var(--pin-size)*1px);
  pointer-events: none;
  position: absolute;
  width: 100%;
}

It works in Chrome since they also have a webkit-specific style rule overriding pointer-events to auto;

      .gNPvK::-webkit-slider-thumb{
          appearance:none;
          -webkit-appearance:none;
          -moz-appearance:none;
          background-color:#0050ff;
          border-radius:50%;
          cursor:pointer;
          height:calc(var(--pin-size)*1px);
          pointer-events:auto;
          transform:translateY(-50%);
          -webkit-transition:transform .2s;
          transition:transform .2s;
          width:calc(var(--pin-size)*1px);
      }

We could add an intervention here and contact the site.

The intervention could be something like:

.gNPvK::-moz-range-thumb {
          background-color:#0050ff;
          pointer-events:auto;
      }

This is related to https://bugzilla.mozilla.org/show_bug.cgi?id=1735575

[softvision-raul-bucata]

The button works now and filters are applied.

I've created a Bugzilla task to remove the intervention: https://bugzilla.mozilla.org/show_bug.cgi?id=1843287

Tested with:

Browser / Version: Firefox Nightly 117.0a1 (2023-07-12) (64-bit)
Operating System: Windows 10 PRO x64

Tested with:

Browser / Version: Firefox Nightly 117.0a1 (2015961955-🦎117.0a1-20230712214907🦎)
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)

[inv_28/2023]