HTML · Chrome 154 ·
Chrome 154 stops scrolls from closing native popovers
Chrome 154 triggers light dismiss on click instead of pointerdown and pointerup, so touch scrolls and right-clicks stop closing popovers and dialogs.
Chrome 154 changes when light dismiss fires for native popovers and dialogs. The browser now waits for a click outside the element instead of reacting to a pointerdown and pointerup pair. A scroll gesture on a touchscreen no longer closes an open popover, and neither does a right-click.
What light dismiss covers
Light dismiss is the behavior where clicking outside a popover or dialog closes it. MDN describes popover="auto" as a popover you can hide by clicking outside it or pressing Esc, and an empty popover attribute counts as auto. Dialogs got the same option in Chrome 134 through the closedby attribute: with closedby="any", a click outside or Esc closes the dialog. A popover="manual" element or a dialog with closedby="none" never light dismisses, so this change does not touch them.
Why it matters
A menu that vanishes when someone tries to scroll the page behind it feels broken on a phone, and that was the old behavior. ChromeStatus lists the fix for desktop, Android and WebView. If you swapped native popovers for a library because of the touch bug, Chrome 154 is worth another look.
<button popovertarget="menu">Menu</button>
<div id="menu" popover="auto">
<a href="/settings">Settings</a>
</div>
<dialog id="filters" closedby="any">
<form method="dialog">
<button>Done</button>
</form>
</dialog>Angular apps and other browsers
For an Angular app that renders native popovers or closedby dialogs in its templates, there is nothing to migrate. The fix lives in the browser, and ChromeStatus files it under "No developer-visible change". The thing I would review is any outside-click or scroll guard written around the old behavior, since it may now be redundant in Chrome.
This is a Chrome change for now. The spec update is still an open pull request against the HTML standard, and ChromeStatus records no signal yet from Firefox or Safari, though bugs are filed for Gecko and WebKit. MDN also marks closedby as limited availability. I would test touch scrolling in Safari and Firefox before deleting any workaround.
Sources
- Chrome 154 release notes: light dismiss improvements
- ChromeStatus: light dismiss improvements for popovers and dialogs
- WHATWG HTML pull request #11536
- Chrome 134 release notes: dialog light dismiss
- MDN: popover attribute
- MDN: HTMLDialogElement.closedBy
I post short notes like this on LinkedIn.
