Using the <dialog> tag about modaal HOT 2 OPEN

Thanks for sharing @craigfrancis when we have a bit more time free we'll do some reading on this spec. Ideally we'd prefer not to have to load a polyfill with the library, but it's definitely worth us doing some reading.

from modaal.

Just for reference, you are kind of doing all the work of the pollyfill anyway, so you shouldn't need to include any extra JS.

Hopefully (and this is from someone who hasn't really looked in detail at your code), you will be able to change:

<div class="modaal-wrapper...

To

<dialog class="modaal-wrapper...

Then update the appropriate methods to either call the native showModal()/close() methods, or call your own.

This would help provide some semantics to the document, and help with tab focus (as browsers that support these will be able to do a much cleaner job than looking at e.keyCode == 9).

One thing that might be odd is handling the ::backdrop for styling.

:-)

from modaal.