v150 · HTML · Popover API

Layer Inspector

Open popover=auto, popover=hint, and popover=manual elements in any combination and watch the top-layer stack build up in real time. See which Chrome 150 rules govern when opening one popover dismisses another.

Checking popover support…
Auto Popover #1
popover="auto"

Light-dismiss: clicking outside closes this.

Opening another auto inside this stack replaces me.

Auto Popover #2
popover="auto"

Opening this alongside Auto #1 closes Auto #1 (Chrome 150: hint stays).

Hint Popover #1
popover="hint"

Chrome 150: opening this hint does NOT dismiss an already-open auto.

Hint Popover #2
popover="hint"

Second hint. Chrome 150 governs how two hints coexist.

Manual Popover
popover="manual"

No auto-dismiss. Must be closed programmatically.

Open popovers
Chrome 150 rule probes
Top-layer stack (simulated)
Top of stack → rendered last (frontmost)
No popovers open
normal document (bottom of z-axis)
Event log

// Open popovers above to see top-layer events…

Chrome 150 stacking rules
  • Opening a new auto popover closes any earlier auto that isn't an ancestor in the invoker chain.
  • Opening a hint does NOT close an already-open auto — they coexist in the top layer.
  • Opening a new hint closes any other hint (only one hint is shown at a time).
  • Opening a new unrelated auto force-hides an already-open hint.
  • manual popovers are never auto-dismissed — they stay until explicitly closed.

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗