1971504 - wallapop.com - "Precio" filter slider does not work

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect, P2)

Description

[Tom Schuster]

Environment:
Operating system: Linux
Firefox version: Firefox 141.0

Steps to reproduce:

• Go to https://es.wallapop.com/search?category_id=100
• Scroll down
• Try to change the euro range with the "Precio" (price) slider

Actual Behavior:
The slider is not movable using the mouse.

Notes:

• Reproduces regardless of the status of ETP
• Reproduces in firefox-nightly, and firefox-release
• Does not reproduce in chrome

Comment 1

[Tom Schuster]

I mostly filed this because it seems very similar to bug 1968198.

Comment 2

[Dennis Schubert [:denschub]]

Similar to bug 1968198, there are two sliders on top of each other. I don't see any -webkit-slider-* attributes during a quick search, though.

Comment 3

[Daniel Holbert [:dholbert]]

(In reply to Dennis Schubert [:denschub] from comment #2)

Similar to bug 1968198, there are two sliders on top of each other. I don't see any -webkit-slider-* attributes during a quick search, though.

They do have some -webkit-slider-* styles, e.g.: these ones which I found in CSS generated by testcase-reducer:

    input[type=range]::-webkit-slider-thumb {
      -webkit-appearance: none;
      pointer-events: all;
      height: 32px;
      width: 32px;
      background-color: #fff;
      border: 10px solid #015354;
      border-radius: 50%;
      box-shadow: 0 0 0 1px #fff;
      background-clip: content-box;
      cursor: pointer;
    }

    input[type=range]::-webkit-slider-thumb:hover {
      background-color: #fff;
      border: 10px solid #015354;
      box-shadow: 0 0 0 4px #3dd2ba;
    }

    input[type=range]::-webkit-slider-thumb:active {
      box-shadow: 0 0 0 4px #3dd2ba;
    }

    input[type=range]:focus::-webkit-slider-thumb {
      background-color: #fff;
      border: 10px solid #015354;
      box-shadow: 0 0 0 4px #3dd2ba;
    }

Comment 4

[Daniel Holbert [:dholbert]]

(In reply to Tom Schuster (MoCo) from comment #0)

Actual Behavior:
The slider is not movable using the mouse.

Clicks aren't being registered here because they site explicitly has pointer-events:none in a rule for input[type="range"]:

    input[type=range] {
[...]
      pointer-events: none;

Then they use the aforementioned webkit-prefixed pseudos to make the slider-thumbs accept pointer-events -- but only for browsers that recognize those pseudos, which is not us.

Comment 5

[Daniel Holbert [:dholbert]]

Attachment: reduced testcase 1

Comment 6

[Thomas Wisniewski [:twisniewski]]

Attachment: Bug 1971504 - add a webcompat CSS intervention to fix the broken dual sliders on wallapop.com; r?denschub

Comment 7

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/19857315b199
https://hg.mozilla.org/integration/autoland/rev/54e8e3ad9ddf
add a webcompat CSS intervention to fix the broken dual sliders on wallapop.com; r=denschub,webcompat-reviewers

Comment 8

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/54e8e3ad9ddf

Comment 9

[Thomas Wisniewski [:twisniewski]]

This intervention no longer seems necessary; I can adjust the slider with or without it.

Comment 10

[Thomas Wisniewski [:twisniewski]]

Attachment: Bug 1971504 - remove our no-longer-needed webcompat intervention for wallapop.com; r?denschub

Comment 11

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/a35f68872201
https://hg.mozilla.org/integration/autoland/rev/92638d11b68f
remove our no-longer-needed webcompat intervention for wallapop.com; r=denschub,webcompat-reviewers

Comment 12

[amarc]

https://hg.mozilla.org/mozilla-central/rev/92638d11b68f