theKashey / vue-focus-lock

It is a trap! A lock for a Focus. A11y util for scoping a focus.
MIT License
138 stars 14 forks source link

Does not work on iOS with voiceover #16

Open thedamon opened 4 years ago

thedamon commented 4 years ago

Because screenreaders on mobile do not use a tab key event, this plugin does not have any effect for screenreader users on iOS.. it goes right out of the lock when swiping to move to next element.

The only fix for this I've seen online is adding aria-hidden to each focusable element that is not inside the focus lock (which may be a Vue antipattern).

theKashey commented 4 years ago

You are absolutely correct. This is a missing moment, and that's also out of focus-lock responsibility. In another dimension, I am calling aria-hidden on the root node to hide everything except it, as well as locking page scroll... but there is no vue-focus-on :(

I am not a vue expert, and it would be not easy for me to create this integration. It would be great if someone will help me 🙏

Beatbug commented 3 years ago

I see something similar with VoiceOver on MacOS -- focus-lock keeps focus inside the focus-locked component like a champ when the user uses TAB, but the VO left & right (Control-Option-Left & Control-Option-Right) commands are not restricted, so focus can escape to elements outside the focus lock.

theKashey commented 3 years ago

The solution is still the same - use aria-hidden. If someone will create a corresponding functionality for vue I would happy to refer to it from this issue/package, but I am not in the position to create the required wrapped by myself. Help is needed.