-
Notifications
You must be signed in to change notification settings - Fork 843
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
[EuiModal] Accessibility #502
Comments
Adding onto here for when we get around to fixing modals: we should also probably upgrade our focus trapping (at least on modals but probably on other things too) to use react-focus-on instead of react-focus-lock which we currently use. (Explanation as to why is in the react-focus-on readme. |
🤣🎢 For people who don't click through to react-focus-on, it is react-focus-lock plus
|
At least some of the changes mentioned here have been applied, and the rest are now being tracked in #3889 |
From elastic/kibana#11823.
We need to make sure our modals are keyboard- and screen-reader-accessible. For the full breakdown, see https://www.marcozehe.de/2015/02/05/advanced-aria-tip-2-accessible-modal-dialogs/.
Here's an example of some of the markup we need:
Here are the crib notes:
role="dialog"
to the Modal root element.aria-labelledby
andaria-describedby
to point screen readers to the title and body text of the modal.The text was updated successfully, but these errors were encountered: