Page MenuHomePhabricator

Make RevisionSlider usable for screenreader users
Open, LowPublic

Description

Issue
The RevisionSlider is not currently usable for screenreader or keyboard only users.

TODO:

  • The (un)collapsed status of the widget is not reflected in the dom (screenreader)
  • The pinning button has no label (screenreader)
  • The pinning button does not reflect it's state (it has an aria-checked attribute (on the wrong element ?) and it's always false (screenreader)
  • The prev/next pagers do not have labels. (Screenreader)
  • The help button does not listen to keyboard selection (enter/spacebar) (keyboard navigation)
  • There is no way to interact with the timeline (keyboard navigation)
  • the popups of the timeline are likely problematic (screenreader and keyboard navigation)

@Tobi_WMDE_SW and @WMDE-Fisch will work on this during the Vienna Hackathon. More people are welcome!

Helpful links:
mediawiki's accessibility guide for developers

Links to the aria standard for reader annotations:
https://www.w3.org/TR/wai-aria-practices/
https://www.w3.org/TR/wai-aria/states_and_properties
https://www.w3.org/TR/wai-aria/roles#childrenArePresentational

Background:
The RevisionSlider is an extension that adds a slider view to the diff page so that you can easily move between revisions.

Event Timeline

TheDJ created this task.May 16 2017, 12:48 PM
Restricted Application added a project: TCB-Team. · View Herald TranscriptMay 16 2017, 12:48 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript
TheDJ updated the task description. (Show Details)May 16 2017, 3:35 PM
Lea_WMDE triaged this task as High priority.May 16 2017, 3:35 PM
Lea_WMDE added a subscriber: Lea_WMDE.

Thanks for creating the ticket! We will definitely look into how to make this compatible this week.

Lea_WMDE renamed this task from RevisionSlider is not usable for screenreader users to Make RevisionSlider usable for screenreader users.May 17 2017, 11:40 AM
Lea_WMDE updated the task description. (Show Details)
Lea_WMDE moved this task from Backlog to Featured Projects on the Wikimedia-Hackathon-2017 board.
Lea_WMDE added subscribers: WMDE-Fisch, Tobi_WMDE_SW.

pinging @Volker_E as someone who also might be interested in this.

Yup, I'm watching the Accessibility Phab board and just wanted to add, that I'm interested to help where possible at the Hackathon. :)

cmadeo added a subscriber: cmadeo.May 19 2017, 10:03 AM

Hi! I'd be happy to help with usability, testing and design.

@TheDJ do you think that adding aria-label attributes to the relevant tags should be sufficient from your experience?

TheDJ added a comment.May 19 2017, 5:00 PM

@WMDE-Fisch actually, i'm not entirely sure how OOjs UI currently deals with this. In my personal view, a ButtonWidget should always have a label, and having an Icon only button is a styling problem that should be solved with a trait or something.

I doubt that's how it works atm however. @Volker_E ?

@TheDJ yeah addressing that in OOjs UI is definitely needed here. But for the implementation it sill would be good to know what attribute is the best to choose here. That's the direction where my question was pointing at :-)

But looking at https://www.w3.org/TR/wai-aria-practices/#button I guess the answer is clearly "Yes to aria-label".

Change 354649 had a related patch set uploaded (by WMDE-Fisch; owner: WMDE-Fisch):
[mediawiki/extensions/RevisionSlider@master] Improve support for screenreaders

https://gerrit.wikimedia.org/r/354649

Change 354722 had a related patch set uploaded (by WMDE-Fisch; owner: WMDE-Fisch):
[mediawiki/extensions/RevisionSlider@master] Disable the RevisionSlider for screenreaders

https://gerrit.wikimedia.org/r/354722

Change 354722 merged by VolkerE:
[mediawiki/extensions/RevisionSlider@master] Disable the RevisionSlider for screenreaders

https://gerrit.wikimedia.org/r/354722

Tobi_WMDE_SW moved this task from Backlog to Doing on the Revision-Slider board.Jun 19 2017, 3:31 PM

Change 354649 merged by jenkins-bot:
[mediawiki/extensions/RevisionSlider@master] Improve support for screenreaders

https://gerrit.wikimedia.org/r/354649

WMDE-Fisch updated the task description. (Show Details)Jun 28 2017, 12:46 PM
WMDE-Fisch moved this task from Doing to Maintenance on the Revision-Slider board.Jun 28 2017, 1:02 PM

Small update here:

The above patch addresses most of the mentioned minor problems. Some more work is needed to make the timeline and popups usable, see T167768.

For now we will keep the feature deactivated for screenreader users and use this ticket as overall tracking ticket for the topic.

WMDE-Fisch removed WMDE-Fisch as the assignee of this task.Aug 30 2017, 12:37 PM
TheDJ lowered the priority of this task from High to Low.Feb 5 2018, 4:19 PM

adjusting prio per work done and future work expected.

Tobi_WMDE_SW moved this task from Incoming to Next on the User-Tobi_WMDE_SW board.Jul 9 2019, 11:45 AM
Tobi_WMDE_SW moved this task from Next to Incoming on the User-Tobi_WMDE_SW board.