Re: [WICG/webcomponents] Reference Target: How to handle events fired on the reference target by related elements? (Issue #1098)

alice left a comment (WICG/webcomponents#1098)

#### Submit button with `form` attribute pointing to `<form>` in shadow root via reference target

From https://github.com/WICG/webcomponents/issues/1098#issuecomment-2800523352

```html
<x-form id="xForm">
  <template shadowRootMode="open" shadowRootReferenceTarget="form">
    <form id="form"></form>
  </template>
</x-form>
<label>Name: <input form="x-form"></label>
<input id="submitButton" type="submit" form="x-form">
```

1. User clicks `submitButton`.
2. The [submit button activation behaviour](https://html.spec.whatwg.org/multipage/input.html#submit-button-state-(type=submit):input-activation-behavior) falls through to [Step 3](https://html.spec.whatwg.org/multipage/input.html#submit-button-state-(type=submit):concept-form-submit):
   > [Submit](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#concept-form-submit) the element's [form owner](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-owner) from the element with [userInvolvement](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#submit-user-involvement) set to event's [user navigation involvement](https://html.spec.whatwg.org/multipage/browsing-the-web.html#event-uni).
3. The [submit a form](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#concept-form-submit) algorithm gets `form` as _form_ (via the `form` attribute and reference target) and `submitButton` as _submitter_.
4. 🆕 At [step 5.6](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-submission-algorithm:event-submit) of "submit a form", the `SubmitEvent` should have `invoker` initialized to `submitButton` when firing the `submit` event at `form`.

   (Following steps are much the same as above, but writing them out anyway.)
5. 🆕 In [fire an event](https://dom.spec.whatwg.org/#concept-event-fire), the invoker is part of the initialization of `event` in step 4.9. 
6. 🆕 In [event dispatch](https://dom.spec.whatwg.org/#concept-event-dispatch), we now get an _invoker_ as part of _event_.
7. In [step 6.8](https://dom.spec.whatwg.org/#ref-for-get-the-parent%E2%91%A2) and [step 6.9.9].(https://dom.spec.whatwg.org/#ref-for-get-the-parent%E2%91%A3), the algorithm calls into [get the parent](https://dom.spec.whatwg.org/#get-the-parent) with _event_.
8. When [a node's get the parent](https://dom.spec.whatwg.org/#ref-for-get-the-parent%E2%91%A4) is invoked on `form`, it returns the shadow root as normal.
9. 🆕 When [a shadow root's get the parent](https://dom.spec.whatwg.org/#ref-for-get-the-parent%E2%91%A6) is invoked on the shadow root, we go to the new logic:
   > 1. let _target_ be event’s path’s first struct’s invocation target;
   > 2. if _event_’s composed flag is set, or shadow root is not the root of _target_, return return shadow root’s host;
   > 3. otherwise, if _event_ has an invoker, and _event_'s invoker's root is a shadow-including ancestor of shadow root, return the result of retargeting _target_ against event's triggering element;
   > 4. otherwise, return null.
   
   so _target_ is `form`; the composed flag is _not_ set, shadow root _is_ the root of _target_; event has an invoker, `submitButton`; `submitButton`'s root (Document) _is_ a shadow-including ancestor of shadow root; so, we return the result of retargeting `form` against `submitButton`, yielding `xForm` as the parent element.
10. 🆕 Back in event dispatch where the path would previously have just been [`form`, shadow root], it now goes [`form`, shadow root, `xForm`, [... `xForm`'s light DOM ancestor chain]] (I think).
11. Event dispatch continues as normal with the given event path
12. 🆕 If [`composedPath()`](https://dom.spec.whatwg.org/#dom-event-composedpath) is called on _event_, it now also uses the new path including `xForm` and its light DOM ancestors.

-- 
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/1098#issuecomment-2803681122
You are receiving this because you are subscribed to this thread.

Message ID: <WICG/webcomponents/issues/1098/2803681122@github.com>