@keithjgrant Been playing with it too, thanks for the post.
A shame the polyfill can’t fully match the native when using the modal option, moving it to be a direct child of <body> isn’t (shouldn’t?) always an option or not having a stacking context on parents can be a no go.
A current workaround I found is to use position: static on it so the modal works as expected when it is supported natively and fallbacks to being in the document flow otherwise.

@keithjgrant Also noticed: once the dialog is cancelled the close method will throw an error…

modal.addEventListener('cancel', () => {
modal.close('cancelled');
});

Error: Failed to execute 'close' on dialog: The element does not have an 'open' attribute, and therefore cannot be closed.

@keithjgrant

- Safari Tech Previex Release 47 (Safari 11.1, WebKit 13605.1.19.1)
- Firefox Dev Edition 58.0b15 (64-bit)
- Safari Version 11.0.2 (13604.4.7.1.6)

When visiting codepen.io/keithjgrant/pen/eyM clicking the show me modal and then pressing escape

There is an issue in the polyfill, line 119 of dialog-polyfill.min.js

@simps interesting. I don't get the error in Firefox nightly

@keithjgrant It is indeed! Didn’t get it on my first visit with nightly but it poped up on the second…

@keithjgrant … and error also via Browser stack for a win10 FF 57.

Sign in to participate in the conversation
Mastodon

Server run by the main developers of the project 🐘 It is not focused on any particular niche interest - everyone is welcome as long as you follow our code of conduct!