Bug - Modal - aria-hidden=true is forced on all siblings

[tkoscieln]

Describe the problem
The toggleSiblingsFromScreenReaders function in Modal sets aria-hidden label on all siblings to true on both mount and update. This has unfortunate side-effect on Select component we use for our dropdown menus (I assume this is the case for all components that use Popper) . The dropdown (displayed and opened within then modal) gets attached to document body on the same level as the modal wrapper, making it it's sibling, and when modal re-renders, this function sets the aria-hidden="true" label to the opened dropdown. This causes issues in accessibility and also in our Playwright tests (Playwright uses accessibility tree for navigation).

patternfly-react/packages/react-core/src/components/Modal/Modal.tsx

Line 109 in 57fe8ee

toggleSiblingsFromScreenReaders = (hide: boolean) => {

How do you reproduce the problem?
This is a non-deterministic behaviour, so I was not really able to find a reliable way of reproducing this. I assume it is caused by the usage of the function in componentDidUpdate within the Modal.

Expected behavior
toggleSiblingsFromScreenReaders function does not affect Popper based components.

Is this issue blocking you?
No, but causes frequent flakes in testing.

Screenshots
This screenshot from Playwright trace shows the menu attached on the same level as Modal with aria-hidde set to true.

What is your environment?

• OS: Fedora 43
• Browser: Chrome
• Version: 146.0.7680.177-1

What is your product and what release date are you targeting?

• Product: RHEL Image Builder service on console.redhat.com

Any other information?
No.

---

Jira Issue: PF-4154