Safari Experimental Feature "Dialog Element" doesn't fire "close" event

[steffenweber]

There is an experimental feature "Dialog Element" in Safari 14.

Mac: Develop -> Experimental Features -> Dialog Element iOS: Settings -> Safari -> Advanced -> Experimental Features -> Dialog Element

When enabled, the dialog-polyfill doesn't load. But Safari's experimental dialog element lacks support for the "close" event which caused our dialog to misbehave.

I have come up with the following workaround for this issue:

if (!('onclose' in dialog) && !window.dialogPolyfill) {
    var observer = new MutationObserver(function(mutationsList) {
        for (var i = 0; i < mutationsList.length; i++) {
            if (mutationsList[i].attributeName === 'open' && !dialog.open) {
                dialog.dispatchEvent(new CustomEvent('close', {
                    bubbles: false,
                    cancelable: false
                }));
            }
        }
    });
    observer.observe(dialog, {attributes: true});
}

(The !window.dialogPolyfill is only necessary because the dialog-polyfill doesn't create the "onclose" property. Maybe that should be fixed independently of this issue?)

I'm not sure whether this is something you consider to be "in-scope" for the dialog-polyfill. There are probably not many Safari users out there who have enabled the experimental feature "Dialog Element" (though we got one such report from a user). But no matter what you decide, I think it's useful to fill this report because until about an hour ago I didn't even know that the experimental dialog element feature exists at all and furthermore found zero mentions of it on the web.

[inopinatus]

Safari also fails to submit <form method="dialog">, nor does it provide a backdrop. For now, it's so incomplete as to be unusable. My suggestion is, don't go out of your way to support users who enable experimental code.

[samthor]

I'm incredibly glad Safari is adding this feature, but I agree that while it's experimental it may not be worth supporting.

When enabled, the dialog-polyfill doesn't load.

That's for the best.

I'm eager to see what they come up with, and I would be open to making this polyfill monkeypatch missing functionality, but since it doesn't have ::backdrop (which is, you know, a hard thing to polyfill since it implies all the weird focus management) I think I'm going to wait to see what they finally release.

[steffenweber]

Ok, thank you for your input! :slightly_smiling_face: