Horizontal Multi-Thumb Slider Example is failing SC 2.5.7

[giacomo-petri]

The Horizontal Multi-Thumb Slider Example currently does not meet the requirements of Success Criterion 2.5.7 Dragging Movements.

To improve accessibility, it would be beneficial to provide a pointer devices support section, or offer an alternative method (e.g., input fields with value controls) that allows users to adjust the values according to their needs.

[css-meeting-bot]

The ARIA Authoring Practices (APG) Task Force just discussed Potential WCAG failure in multi-thumb slider.

The full IRC log of that discussion

<jugglinmike> Topic: Potential WCAG failure in multi-thumb slider
<jugglinmike> github: https://github.com//issues/3118
<jugglinmike> Matt_King: The multi-thumb slider example, according to the reporter, doesn't meet the requirements of 2.5.7, "Dragging movements"
<jugglinmike> Matt_King: I haven't done any work to understand whether or not this is an accurate assessment, but I'd like to do that here in this meeting
<jugglinmike> jongund: I built this slider
<jugglinmike> Adam_Page: I see what the reporter is describing
<jugglinmike> Adam_Page: The new dragging behavior requires that any control which supports a "dragging" operation also supports a "single click" interaction to perform the same function
<jugglinmike> Adam_Page: Here, I can drag, but I cannot click on the empty track where I want it to move
<jugglinmike> Oliver_Habersetzer: but there are two sliders--isn't the intention ambiguous in that case?
<jugglinmike> Adam_Page: I believe it's the nearest slider that's suppose to move
<jugglinmike> Adam_Page: I'm playing around with Adobe's "double thumb" slider in their React library. For what it's worth, they seem to always choose the nearest thumb (whether you're on the interior of the two or outside of them)
<jugglinmike> Adam_Page: I'm not arguing that's the solution, but it is a solution
<jugglinmike> Matt_King: You have to do something, and I suppose that's the most obvious
<jugglinmike> jongund: The Adobe React example doesn't surprise me
<jugglinmike> Adam_Page: Yeah, it's definitely anecdotal, but it instinctively felt right
<jugglinmike> jongund: I think I could fix this pretty quick
<jugglinmike> jongund: I'd also like to update it to use some of our high-contrast support
<jugglinmike> Matt_King: jongund has a lot of his plate right now; is there anyone else that can help out?
<jugglinmike> Matt_King: Hearing no other volunteers, we'll take you up on your offer, jongund
<jugglinmike> jongund: I'd also like to change the graphic from using triangles to using circles. Would there be any objection to my doing that as well?
<jugglinmike> Adam_Page: Circles feel more conventional to me...
<jugglinmike> Oliver_Habersetzer: I have seen triangles in the wild, for what its worth
<jugglinmike> Adam_Page: For the double-thumb example in particular, I think the triangles reinforce the concept of "min" and "max
<jugglinmike> s/"max/"max"/
<jugglinmike> Matt_King: Okay, then triangles it is!