Bug 255507 - AX: showModal() does not include slotted content as "focusable"
Summary: AX: showModal() does not include slotted content as "focusable"
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Accessibility (show other bugs)
Version: Safari 16
Hardware: All All
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-04-17 02:25 PDT by Westbrook
Modified: 2023-04-17 07:17 PDT (History)
3 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Westbrook 2023-04-17 02:25:52 PDT
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.
Comment 1 Radar WebKit Bug Importer 2023-04-17 02:26:08 PDT
<rdar://problem/108127467>
Comment 2 Westbrook 2023-04-17 02:33:30 PDT
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.