-
Notifications
You must be signed in to change notification settings - Fork 49
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Tooltip triggers are inaccessible to keyboard users #369
Comments
To me it makes sense that a button should reveal its tooltip when focused. But if I made every tooltip on the page focusable, wouldn't that include a lot of non-interactive elements and slow down keyboard navigation a lot? I guess that's better than the info not being accessible at all? On a technical level, I'm using Radix's tooltip component, so I'm not entirely sure if those issues come from them, or if I implemented something poorly (or maybe have an out-of-date version). I'll look more into it. |
Yes, if a button has a tool-tip, then it should be revealed on focus as well as hover. Bear in mind that you still need to programmatically associate them since a blind screen reader user won't see these tool-tips at all. Radix does this by dynamically adding I am not suggesting making the tool-tips focusable, however. If the tool-tips have focusable content, then they need to become disclosure widgets (pop-up isn't quite there yet for support). All that being said, note that my selector above is looking at
Same number of keyboard inaccessible tool-tips. In short, if it has a tool-tip then it has to be keyboard focusable. 99 (at least) nodes are not.
Radix built it off an unfinished APG proposal. Bear in mind that the ARIA Authoring Practices Guide is not a spec. Its patterns are not fully tested. Its patterns all have warnings on them because I fought to get them added. That pattern even notes it is a work in progress. As such, I am not surprised it is using a pattern it did not fully vet because 12 seconds of testing showed they probably did not. |
Using the Accessibility page from the latest (2023) survey, the tooltip triggers are inaccessible to keyboard users.
Because they contain click handlers, NVDA users in particular will hear "clickable" for every node using this construct. This happens even though they cannot trigger the tool-tips and the node itself may have no text to convey. On this page, an NVDA user has to hear "clickable" at least 105 times. Use this XPath to confirm the count:
I encourage you to move away from JS event handlers and lean on
:focus
style triggers by default, adding in:hover
when the:focus
has been built.The text was updated successfully, but these errors were encountered: