Skip to content
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

[Version 8] Handle Shadow DOM subtrees when checking for active element #459

Merged

Conversation

mxmason
Copy link
Contributor

@mxmason mxmason commented Jan 22, 2023

(text copied from #458, which was closed by accident)

Summary

This PR adds further support for Shadow DOM and custom elements, following work in #397. Note: it depends on changes in #455, so that should merge first.

Without these changes, our trapTabKey function doesn't understand when the user's focus is in a shadow subtree, so the user could escape the modal when we don't want them to.

Why?

document.activeElement is not aware of any shadow roots in the document. We have to check for shadow roots on the active element, then get the active element within that root. See getDeepActiveElement().

src/a11y-dialog.ts Outdated Show resolved Hide resolved
Co-authored-by: Kitty Giraudel <1889710+KittyGiraudel@users.noreply.github.com>
@KittyGiraudel KittyGiraudel merged commit 5ec8f23 into KittyGiraudel:main Jan 22, 2023
@KittyGiraudel KittyGiraudel added this to the Version 8 milestone Feb 5, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants