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
autopopover closes any earlierautothat isn't an ancestor in the invoker chain. - Opening a
hintdoes NOT close an already-openauto— they coexist in the top layer. - Opening a new
hintcloses any otherhint(only one hint is shown at a time). - Opening a new unrelated
autoforce-hides an already-openhint. manualpopovers are never auto-dismissed — they stay until explicitly closed.
see also
- Top-layer Stacking Demo — open combinations, watch stack
- Hint vs Auto Reference — behavioural differences
- Menu + Tooltip Coexist — practical UI pattern
- ChromeStatus entry
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗