Use close watcher when supported in place of escape key handlers

[lukewarlow]

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Summary 💡

This library should use the CloseWatcher API [1][2] in place of escape key listeners where it's supported. This allows components such as dialog to be dismissed using extra close signals (e.g. Android back gesture).

[1] https://html.spec.whatwg.org/multipage/interaction.html#the-closewatcher-interface [2] https://developer.chrome.com/blog/new-in-chrome-120#close-watcher

Examples 🌈

No response

Motivation 🔦

The native html dialog (when modal) and popovers have this behaviour in supported browsers (Chromium), using the close watcher API would align with the platform.

It also provides increased accessibility as on top of the back gesture/ button the Talkback back gesture (and potentially other screen readers) also triggers a close watcher.

[samuelsycamore]

Thanks for the suggestion @lukewarlow! I hadn't heard about this API before, and it sounds really cool. That said, this appears to be a brand new API with support limited to the latest version of Chrome, as of about a week ago. We typically look at caniuse.com when deciding whether to implement new stuff like this, and we aim for global support > ~95%. In the case of the CloseWatcher API, it looks like it's currently at 0.04%—so we've got a long way to do before it'd be a good idea here. But I'm glad to know it exists, and I look forward to broader support in the future!

[lukewarlow]

This imo is a progressive enhancement where you'd fallback to the existing escape key handlers in supported browsers. So the caniuse data isn't as relevant as something that couldn't be polyfilled.

[samuelsycamore]

I've added the waiting for 👍 tag here to gauge the community's interest in implementing this.