Issue with category selection using VoiceOver

[ceo]

I'm using VoiceOver in Safari on Yosemite and have discovered an issue wherein I can't select Categories.

To recreate:

1. Get to the Categories heading (generally I use the web rotor - VO+U - and select the Categories heading)
2. Arrow down (VO+Right Arrow in this case) from there to the All Categories and Most Used tabs
3. Switch between the tabs

Moving down from there brings you past the Select/Deslect All button and the entire list of categories and directly to the Add New Category link. Going back brings you to the tabs again. Both the tabs and the new category link are able to be activated, for what it's worth.

I can "fix" it by opening the web rotor and going back to the Categories heading again, though, I have no idea why that works.

[ceo]

Demo of the issue: ​https://files.slack.com/files-pri/T024MFP4J-F0313V0ML/category_selection_with_voiceover.mov

[afercia]

Replying to ceo:

Moving down from there brings you past the Select/Deslect All button

Hi @ceo, followed your report on Slack and seen your video, maybe I'm missing something but I don't have a "Select/Deselect All" in the Categories box in my installation and, as far as I know, those buttons are not part of WordPress core. Maybe you're using some categories-related plugin which adds those buttons, if so could you please de-activate all plugins, use a default theme and check again?

[ceo]

I knew I should have used my test site to do the screencast even though it's on beta just because someone would mention plugins/themes that I'd forget to deactivate, but I was lazy and see what it got me. ;-)

In any case, I have tested this on 4.0, 4.1-beta1, and on trunk all using default themes and no plugins and it does the same thing where it skips the entire list of Categories unless I re-enter through the web rotor. (Oh, and the stupid select/deselect button I think is a Genesis thing. I forgot it's not core so pardon my mention of it in the first place.) This doesn't happen in Chrome, for what it's worth, so I know it's a wacky Safari thing.

[DrewAPicture]

As this seems to be localized to Safari in Yosemite, going to mark this as low priority for the time being.

[Gab Nino]

Hello,
Rian asked me to test this issue with VoiceOver.
Here are my comments :

Tools: Safari 8.0.6 + VoiceOver, OS X Yosemite.
Wordpress version tested: ​http://pctje.xs4all.nl/nightly/wp-admin/post.php?post=1153&action=edit

I just finished testing Cyndy's issue with Safari + VoiceOver.
I got the same problem. The bug reproduced as soon as I click in one of the links: All categories and Most used.
When the user choose one of those two options, there is something messing up with the “focus” of the list (ul id=”categorychecklist”) and its elements not enabling VoiceOver to get inside of the chosen category list using VO+Right Arrow. It's like the list is not there, so the user jumps from the links All categories and Most used directly to Add new category link and vice-verse.
Cyndy said she found a way to bypass this bug. She returns to the Category header (h3 element) and after for some miraculous reason VoiceOver is able again to move inside the category list items. And yes, this bypass worked for me too. But I realized that if I move from one element on the page to another using only the up/down arrows also fixes the problem. E.g. if I move from Most used link to Add a new category link allow me to come back to the categories list using VO+Right/left Arrow.

I have no clue what could be causing the bug, but definitely it is there. I could not find either the Select/Deselect All button, but the issue is not related at all with it. The problem seems to be at the Wordpress core and not related to a plugin installation.

I've prepared a video to accompany my observations.
​http://youtu.be/xAH35wloguE

Greetings!

[afercia]

Thanks very much Gab :) Couldn't test on a Mac and the video is excellent, finally got what's happening here.

Accessibility team: rather than try to patch this bug, maybe we could take the opportunity to experiment with ARIA tab interfaces? The practical advantage of ARIA tab interfaces is that they allow users to switch focus between the currently selected tab and its related panel without having to cycle through all the other tabs. Switching tabs is generally controlled with left/right arrow keys. Mr. Zehe suggests to ​use the Space bar to trigger the switch.
Screen readers also announce the number of available tabs.

[Gab Nino]

Hello

Rian asked me to retest this issue with VoiceOver.
I'm glad to announce that the issue is fixed. I did not have any problems accessing the list of categories or selecting categories. I changed from one tab to the other, added a new category and moved from one category to the other without a problem.

Tested on: MacOs Sierra, Safari 10.0.1 and VoiceOver.
Wordpress version: ​http://wpaccess.org/nightly/wp-admin/post.php?post=1153&action=edit

[afercia]

Thanks @Gab Nino :) I couldn't reproduce either on Safari 10. Seems it's really something happening just on Safari 8 and I'm afraid there's not much we can do. Going to close this ticket. Everyone, please do feel free to re-open if you still notices issues on recent browser/screen reader combos.