Bug 255507
| Summary: | AX: showModal() does not include slotted content as "focusable" | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Westbrook <westbrook.johnson> |
| Component: | Accessibility | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | andresg_22, nurthen, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari 16 | ||
| Hardware: | All | ||
| OS: | All | ||
Westbrook
When open a "modal" `<dialog>` via the `.showModal()` method, the flat tree is not used to calculate the "first focusable" element and rather than passing focus into content that should otherwise receive it, the focus is passed the `<dialog>` element.
https://codepen.io/Westbrook/pen/VwEjLEo
In the above demo, see the `<input type="text" />` that is slotted into the `<dialog>` element present in the shadow root created on the `<section>` element. When clicking the "Open slotted dialog" button, a visitor would expect to see focus passed into the `<input>` element directly due to the use of `.showModal()`. This is based on the way that clicking "Open flattened dialog" focus is accurately passed in the `<input type="text" />` within the `<dialog>` sharing the same DOM tree.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/108127467>
Westbrook
This same issue exists in Firefox 111 (issue tracked via https://bugzilla.mozilla.org/show_bug.cgi?id=1828398), but behaves as expected in Chrome 111.