WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: VoiceOver skips revealed content when using virtual cursor

for

From: Robert Fentress
Date: May 21, 2018 4:22PM

Further experimentation reveals that if I move the following from the
`<div>` to the `<ul>` inside the `<div>`, it appears to work:

`id="drawer" class="hidden" role="group" aria-label="Menu"`


Interesting.

It also appears to work if I just wrap an extra `<div>` around the drawer.

On Mon, May 21, 2018 at 5:46 PM, Robert Fentress < <EMAIL REMOVED> > wrote:

> Hoping you folks can give me some idea of what is going on with the
> following page
> http://www.test.assist.vt.edu/sandbox/drawer/index.html
>
> It is a simple demonstration of a drawer pattern (just a *disclosure
> widget*, really). The issue I'm encountering is that in *VoiceOver on
> MacOS High Sierra*, after clicking the button that causes the drawer to
> appear, *when I attempt to use the virtual cursor* (VO+right arrow) to
> read the menu that appears, *it skips the revealed content entirely*.
> This pattern works acceptably well on other screen readers, even VoiceOver
> on iOS, but VoiceOver on MacOS High Sierra has this weird behavior, in my
> opinion.
>
> I made a screen capture video demonstrating what VoiceOver is doing and
> explaining what is going on with the code, if that'll help:
> https://youtu.be/kGQ7-u9RBok
>
> I've only got automatic captions so far-sorry. They're quite *amazingly*
> accurate, though, aside from the punctuation.
>
> *Any ideas on how to fix this*, short of setting focus to the revealed
> content explicitly, which I'd rather avoid?
>
> Best,
> Rob
>
> --
> *Rob Fentress*
> *Web Accessibility Solutions Designer*
> Assistive Technologies at Virginia Tech
> Electronic Business Card (vCard)
> <http://search.vt.edu/search/person.vcf?person54847>
> LinkedIn Profile
> <https://www.linkedin.com/in/rob-fentress-aa0b609?trk=profile-badge>
> VT Zoom Personal Conferencing
> <https://virginiatech.zoom.us/my/rob.fentress>
>



--
*Rob Fentress*
*Web Accessibility Solutions Designer*
Assistive Technologies at Virginia Tech
Electronic Business Card (vCard)
<http://search.vt.edu/search/person.vcf?person54847>
LinkedIn Profile
<https://www.linkedin.com/in/rob-fentress-aa0b609?trk=profile-badge>
VT Zoom Personal Conferencing <https://virginiatech.zoom.us/my/rob.fentress>