mui / mui/base-ui

Portal container receives aria-hidden="true" and data-base-ui-inert

Open
#5,577 3 comments 0 reactions 0 assignees View on GitHub
component: dialog has workaround type: bug
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

# Bug report

Please look at the [Stackblitz repro](https://stackblitz.com/edit/1epaii32?file=src%2FApp.tsx)

## Reproduction steps
1. Have 2 nested dialogs
2. They go to different containers (``)
3. Observe in the DOM: The second container is marked with `data-base-ui-inert` and `aria-hidden="true"`

## Expected behavior
The second portal should not be marked as `data-base-ui-inert` or `aria-hidden="true"`, just like nested portals don't

Contributor guide

Open the contributing guide

Research direction

Start with the linked Stackblitz repro and inspect the DOM produced by two nested Dialog.Portal instances using different containers. Trace the portal inerting behavior and verify that the second container is no longer marked with data-base-ui-inert or aria-hidden="true", while nested portals retain their existing behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
accessibility, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.