demo · v150
Interrupted scroll promise
When a programmatic smooth scroll is interrupted — by another scrollTo() call, by a user gesture, or by a snap position — Chrome 150 resolves the promise at the new settled position rather than rejecting it. This is the edge case that matters for sequences: a mid-flight interruption doesn't break your await chain.
await element.scrollTo() in a try block will not throw — it continues execution after the interrupted scroll settles, wherever that may be.
Panel A — programmatic interrupt
Start a smooth scroll to the bottom, then fire a second scrollTo() mid-flight. The first promise resolves where it stopped.
Panel B — user gesture interrupt
Start a smooth scroll, then manually scroll the box during the animation. The promise resolves when scrolling settles at the new position.
Manually scroll the box above while the animation is running to interrupt it.
// Chrome 150: interrupted scroll → promise RESOLVES at settled position
async function runScrollSequence(el) {
const start = performance.now();
// Start scroll to bottom
const p = el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' });
// Interrupt after 300ms with another scroll
setTimeout(() => {
el.scrollTo({ top: 100, behavior: 'smooth' });
}, 300);
await p; // resolves when first scroll settles (not at bottom — interrupted)
// Does NOT throw. Execution continues here with el.scrollTop at settled pos.
console.log('First scroll settled at', el.scrollTop, 'after', performance.now() - start, 'ms');
}
// Key point: use try/catch for genuine errors (not supported, element gone, etc.)
// but NOT for interruption — interruption resolves, not rejects.
see also
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗