Closed Bug 1735667 Opened 3 years ago Closed 3 years ago

delegatesFocus should also look for elements that are descendent of the slotted element

Categories

(Core :: DOM: Core & HTML, defect, P3)

defect

Tracking

()

RESOLVED FIXED
95 Branch
Tracking Status
firefox-esr78 --- unaffected
firefox-esr91 --- unaffected
firefox93 --- unaffected
firefox94 --- fixed
firefox95 --- fixed

People

(Reporter: sefeng, Assigned: sefeng)

References

(Regression)

Details

(Keywords: regression)

Attachments

(1 file)

No description provided.
Assignee: nobody → sefeng
Status: NEW → ASSIGNED
Severity: -- → S3

Set release status flags based on info from the regressing bug 1413836

Pushed by sefeng@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/e35a8f30c4f2 Make delegatesFocus to loop through descendents of slotted elements r=emilio
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/31285 for changes under testing/web-platform/tests
Status: ASSIGNED → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Target Milestone: --- → 95 Branch

Comment on attachment 9245824 [details]
Bug 1735667 - Make delegatesFocus to loop through descendents of slotted elements r=smaug

Beta/Release Uplift Approval Request

  • User impact if declined: The <delegatesFocus> feature may work incorrectly under certain circumstances
  • Is this code covered by automated tests?: Yes
  • Has the fix been verified in Nightly?: No
  • Needs manual test from QE?: No
  • If yes, steps to reproduce:
  • List of other uplifts needed: None
  • Risk to taking this patch: Low
  • Why is the change risky/not risky? (and alternatives if risky): It's not risky because this is just a bug fix for a dom feature.
  • String changes made/needed:
Attachment #9245824 - Flags: approval-mozilla-beta?
Upstream PR merged by moz-wptsync-bot

Comment on attachment 9245824 [details]
Bug 1735667 - Make delegatesFocus to loop through descendents of slotted elements r=smaug

Approved for 94.0b8.

Attachment #9245824 - Flags: approval-mozilla-beta? → approval-mozilla-beta+
Has Regression Range: --- → yes

Hello. It seems like this could still be an issue, or perhaps has regressed.

In the following reproduction, a focusable slotted child of a shadow root should receive focus when the shadow root's host element is focused.

This reproduction works correctly on Chrome 100 and Safari 15.4, but does not work on Firefox 99.

https://lit.dev/playground/#gist=ca70329e410733a296a328b35900bffc

<!DOCTYPE html>
<body>
  <x-test>
    <input placeholder="Slotted child of x-test">
  </x-test>
  
  <button id="focus">Focus x-test</button>
  
  <script type="module">
    class XTest extends HTMLElement {
      connectedCallback() {
        const shadow = this.attachShadow({
          mode: 'open',
          delegatesFocus: true
        });
        shadow.innerHTML = `<slot></slot>`
      }
    }
    customElements.define('x-test', XTest);

    document.querySelector('#focus').addEventListener('click', () => {
      // In Chrome 100 and Safari 15.4, focusing the <x-test> host element causes
      // its slotted <input> child to be focused.
      //
      // In Firefox 99, it does not.
      document.querySelector('x-test').focus();
    });
  </script>
</body>

We're following the spec, afaict, see all the discussion and so from https://github.com/whatwg/html/issues/7207 and related.

Understood. Thank you for that reference, I didn't realize the spec had changed here.

You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: