GoogleChrome / dialog-polyfill

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

Dialog forms don't work properly and trigger a page reload in shadow DOM #195

Closed hadriann closed 3 years ago

hadriann commented 4 years ago

In Firefox and Safari, inside a shadow DOM, submitting (via a submit button) a form with method set to "dialog" (inside a dialog element) triggers a page reload instead of closing the dialog with the proper returnValue.

hadriann commented 4 years ago

This seems to happen because the submit event is handled globally at document level. It works well in regular DOM, as the event bubbles up. In shadow DOM, the event still bubbles up, but it doesn't propagate across the shadow DOM boundary because the composed property of the submit event is false.

samthor commented 4 years ago

Thanks for the report. I'll solve this by setting composed and handling it globally.

On Tue, 21 Apr 2020 at 21:17, Adrian Nita notifications@github.com wrote:

This seems to happen because the submit event is handled globally at document level. It works well in regular DOM, as the event bubbles up. In shadow DOM, the event still bubbles up, but it doesn't propagate across the shadow DOM boundary because the composed property of the submit event is false.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/GoogleChrome/dialog-polyfill/issues/195#issuecomment-617115077, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAA5DEDYOYE5FNZHGDCDP7LRNV6C3ANCNFSM4MNGX3AA .

hadriann commented 4 years ago

But can you override the composed flag of the native submit event?

samthor commented 3 years ago

I've fixed this in 0.5.4.