showModal throws exception when dialog is inside a custom-element

I have a large web-components (using lit-element) application. It will be used in a very closed environment, so I am able to control the browser support. So far its been used exclusively with chrome.

I do use the <dialog> element inside a few components, and built in the use of the polyfill from the beginning. These elements exclusively use showModal() to open dialogs when needed.

I have been asked to check for IOS support on ipads - but with them it has been impossible to debug why things didn’t work, so I just starting using Safari on the mac.

However using the debugger on my mac with Safari I have discovered that showModal() tries to check whether the dialog exists by doing a document.body.contains(this.dialog_) call. Node.contains() doesn’t include elements inside the shadowRoot of a contained element, so the call throws an exception.

[samthor]

I’ve published 0.5.1 which includes this.

On Fri, 10 Apr 2020 at 20:48, Adrian Nita [e-mail] wrote:

@samthor https://github.com/samthor please check pull request #194 https://github.com/GoogleChrome/dialog-polyfill/pull/194 that fixes this issue. Thanks!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/GoogleChrome/dialog-polyfill/issues/186#issuecomment-611981317, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAA5DEDIO6TTTYZXNIT7DJLRL32RVANCNFSM4IWWUSZA .

[samthor]

I bumped up package.json to 0.5.1.