v150 · HTML · Hint vs Auto Reference
Hint vs Auto Reference
Side-by-side comparison of popover=auto and popover=hint across every relevant behaviour dimension, with rows highlighted in blue for properties that changed in Chrome 150.
Rows highlighted in blue are behaviours that changed or were clarified in Chrome 150's stacking model revision.
behaviour comparison
| Behaviour | popover=auto | popover=hint |
|---|---|---|
| Intended use case | Menus, drawers, dialogs — persistent until dismissed | Tooltips, transient contextual tips — appear on hover/focus |
| Light dismiss (click outside) | Yes — closes on outside click | Yes — closes on outside click |
Programmatic .showPopover() |
Always allowed | Allowed but must use invoker pattern in strict contexts |
Opening an unrelated auto |
Yes — same-stack dismissalupdated | Yes — an already-open hint is hiddenupdated |
Opening a hint while this popover is open |
Not dismissed — auto remains openupdated | New hint replaces the previous hintupdated |
Closing an auto dismisses this popover |
Cascades only if nested in the auto stackupdated | Yes, when the hint belongs to that auto stackupdated |
| Position in top layer relative to each other | Below hint in the top layer | Above auto stackupdated |
| Multiple open simultaneously | Only innermost (nested) autos allowed | One hint at a time; opening a new hint closes previous |
Closes on Escape key |
Yes | Yes |
CSS :popover-open pseudo-class |
Yes | Yes |
toggle event fired |
Yes | Yes |
Invoker button (popovertarget) |
Supported | Supported — recommended trigger for hints |
sandbox
Open both types to observe the new stacking rules live:
Auto popover
I'm in the auto stack. Open me first, then toggle the hint; I stay open.
I'm in the auto stack. Open me first, then toggle the hint; I stay open.
Hint — I sit above the auto stack and dismiss independently.
migration notes
If your code assumes a tooltip cannot appear while a menu is open, that pattern changes in Chrome 150. Show related hints deliberately, and hide them explicitly when changing to an unrelated menu.
// Chrome 150: open the menu first, then the contextual hint.
menuPopover.showPopover();
hintPopover.showPopover(); // menu remains open
// When changing menus, close the hint explicitly for clear intent.
hintPopover.hidePopover(); // explicit, clear intent
see also
- Top-layer Stacking Demo — interactive demo of the new stacking rules
- ChromeStatus entry
- MDN — Popover API
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗