Bug 266524 – The focusin event from open shadow DOM does not bubble to parent document

• Status: NEW
• Component: UI Events

[Sean Monahan]

Steps to reproduce:

Clone repo https://github.com/ling1726/shadow-dom-focusin-repro

Setup

run npm install
run npm run dev
navigate to http://localhost:5173/
Steps

1. click on a button
2. output should be:

> focusin listener - shadow root
> focusin listener - document
> click listener - shadow root
> click listener - document

3. click on another button
4. output should be:

> focusin listener - shadow root
> click listener - shadow root
> click listener - document


Actual results:

Each click event is received by the parent document of the open shadow root.
No focusin events are fired

Expeced results:
Each click event is received by the parent document of the open shadow root.

Each focusin event is received by the parent document of the open shadow root

MDN states (https://developer.mozilla.org/en-US/docs/Web/API/Event/composed)

> All UA-dispatched UI events are composed (click/touch/mouseover/copy/paste, etc.). Most other types of events are not composed, and so will return false. For example, this includes synthetic events that are created without their composed option set too true.


As I understand it this means that focusin events should bubble up from the Shadow DOM.

[Radar WebKit Bug Importer]

<rdar://problem/120059183>