search

GoogleChrome / dialog-polyfill

Polyfill for the HTML dialog element
BSD 3-Clause "New" or "Revised" License
2.45k stars 245 forks source link

Slotted elements which appear within a dialog due to slots but are declared outside of the dialog cannot get focus in Firefox and Safari #217

Open carmour24 opened 3 years ago

carmour24 commented 3 years ago

In Firefox and Safari, an element slotted into a dialog within a web component will not get focus events. The call to findNearestDialog from safeBlur_ returns null in this instance as the declaration of the slotted element is outside the dialog though the element itself appears within it.

This issue is similar to #189 in that findNearestDialog isn't able to properly traverse the DOM tree in this instance and a fix is to add an extra clause in here to navigate to the assignedSlot (where the element is inserted into the dialog).

I've created a repo at https://github.com/carmour24/slotted-element-modal-issue reproducing the issue and included a branch showcasing a fix I've made in a fork of dialog-polyfill which I'd be happy to submit a PR for.

samthor commented 3 years ago

I'm happy to accept PRs.

nasim-git commented 3 years ago

I have this bug with polyfill in safari and slotted content. @carmour24 can you submit your PR?