← Back to release summary

Dialog light dismiss

Category
DOM
Type
New or changed feature
Status
Enabled by default (Chrome 134)
Intent stage
None

WPT details: https://wpt.fyi/results/html/semantics/interactive-elements/the-dialog-element?label=master&label=experimental&aligned&q=closedby

Summary

One of the nice features of the Popover API is its light dismiss behavior. This chromestatus is about bringing that same capability to `<dialog>`. A new `closedby` attribute controls behavior: `<dialog closedby=none>` - no user-triggered closing of dialogs at all. `<dialog closedby=closerequest>` - user pressing ESC (or other close trigger) closes the dialog `<dialog closedby=any>` - user clicking outside the dialog, or pressing ESC, closes the dialog. Akin to `popover=auto` behavior.

Motivation

Developers sometimes would like dialog elements to exhibit "light dismiss" behavior, similar to the behavior popovers get by default. Previously, this required JS-based click handlers on the dialog and awkward logic. This feature provides easy light dismiss functionality via a declarative attribute.

Standards & signals

Ecosystem

View on chromestatus.com