Skip to content

[modal] Fix aria-hidden should not apply on non-portal modals - #49026

Open
ZeeshanTamboli wants to merge 12 commits into
mui:masterfrom
ZeeshanTamboli:issue-19450-aria-hidden-non-portal-modals
Open

[modal] Fix aria-hidden should not apply on non-portal modals#49026
ZeeshanTamboli wants to merge 12 commits into
mui:masterfrom
ZeeshanTamboli:issue-19450-aria-hidden-non-portal-modals

Conversation

@ZeeshanTamboli

@ZeeshanTamboli ZeeshanTamboli commented Aug 24, 2026

Copy link
Copy Markdown
Member

Fixes #19450

Closes #43318 (Old PR)

Closes #48889 (Another PR attempt but does not handle this case)

Do not apply aria-hidden on non-portal modals (i.e when disablePortal) ancestor. This hides the modals from the accessibility tree. Also, mark the siblings of modal as aria-hidden so that they are inaccessible when the modal is opened. Handles cases with nested modals as well.


Test the reproductions on Mozilla Firefox because Blink (rendering engine used by Google Chrome etc) blocks the aria-hidden on elements whose descendents have focus by default. So, it's reproducible in Firefox but a general issue on all browsers. Use a screen-reader and test it out:

Before: https://stackblitz.com/edit/github-fennfewl?file=src%2FApp.tsx
After fix: https://stackblitz.com/edit/github-fennfewl-krrbcqn3

@ZeeshanTamboli ZeeshanTamboli added type: bug It doesn't behave as expected. scope: modal Changes related to the modal. labels Aug 24, 2026
@code-infra-dashboard

code-infra-dashboard Bot commented Aug 24, 2026

Copy link
Copy Markdown

Deploy preview

https://deploy-preview-49026--material-ui.netlify.app/
QR code for https://deploy-preview-49026--material-ui.netlify.app/

Bundle size

Bundle Parsed size Gzip size
@mui/material 🔺+409B(+0.08%) 🔺+146B(+0.10%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/private-theming 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes


Check out the code infra dashboard for more information about this PR.

@ZeeshanTamboli ZeeshanTamboli changed the title [modal] Fix aria-hidden applying on non-portal modals [modal] Fix aria-hidden should not apply on non-portal modals Aug 25, 2026
@ZeeshanTamboli
ZeeshanTamboli marked this pull request as ready for review August 25, 2026 08:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

accessibility a11y scope: modal Changes related to the modal. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Modal] aria-hidden should not be applied on non-portal modals

1 participant