Summary

Closing a modal now always restores screen reader access to the page. If the element that opened the modal was gone by the time it closed, page content kept aria-hidden="true" and stayed invisible to assistive tech until reload.

Breaking change

This is not a breaking change.

Related issue

Closes #6785

Problem statement

Opening a modal hides everything outside it from screen readers. Closing should undo that, but the undo sat inside if (menuButton && returnFocus).

returnFocus comes from the modal's data-opener attribute. If that element isn't in the document anymore, the lookup returns null and the attributes never come off. You get no modal on screen and a page that's still entirely aria-hidden, with no way out except a reload.

Opening always hid. Closing only sometimes unhid.

Solution

Moved the unhide out of the guard so it always runs, and left returnFocus.focus() inside it.

Focus return can't work if the opener is gone, but that shouldn't keep the page hidden.

I left the menuButton condition on the focus call alone. Dropping it might be fine too, but it would change focus behavior in a case unrelated to this bug. Happy to change it if you'd prefer.

Testing and review

The test removes the clicked opener while the modal is open, closes it, then checks nothing is left with data-modal-hidden. A second opener stays on the page, so menuButton is still truthy and only returnFocus is missing.

npx gulp unitTests: 802 passing. Reverting the fix but keeping the test gives 800 passing, 2 failing, and the only failures are the new test. It runs twice because the spec covers a modal initialized at document.body and at the modal element.

I also checked this outside the unit tests, on a static page with Playwright, against published 3.13.0 and develop. Opener left alone restores fine, opener removed leaks, Escape leaks the same way. Can share that if useful.