demo · v133

Popover vs Dialog — converged dismiss

dialog closedby=any brings <dialog> in line with the light-dismiss behaviour [popover] has had since v114. Compare the two side by side and pick the right primitive: popover for menus and disclosures, dialog when modality and the top-layer focus trap matter.

[popover]

I dismiss on outside-click or Escape by default. No modal scrim. Focus is not trapped.

blocks page no focus trap no backdrop none esc closes outside click closes fires cancel no

<dialog closedby="any">

I'm modal. Focus is trapped. Backdrop dims the page. I close on outside-click or Escape thanks to closedby="any".
blocks page yes (top layer) focus trap yes backdrop ::backdrop esc closes outside click closes fires cancel yes

when to use which

Popovers are inert until interaction. They don't trap focus and don't have a modal scrim — perfect for menu surfaces, hovercards, secondary disclosures. Use <dialog> when the response is a decision the user needs to make: cookie consent, destructive confirm, payment confirmation. The dialog's top-layer behaviour and focus trap come along for the ride; closedby is the new lever for how light its dismissal is.

see also