From 8a00138114547fde1a794a62495c1bdea9afc9aa Mon Sep 17 00:00:00 2001 From: yujiteshima Date: Sat, 3 Jan 2026 00:36:16 +0900 Subject: [PATCH] Use behavior: "instant" for scroll restoration to ignore CSS scroll-behavior When `scroll-behavior: smooth` is set in CSS, restoration visits would animate to the previous scroll position. Using `behavior: "instant"` ensures scroll position is restored instantly regardless of CSS settings. Fixes #1448 --- src/core/view.js | 2 +- ...scroll_restoration_with_smooth_scroll.html | 26 +++++++++++++++++++ .../functional/scroll_restoration_tests.js | 16 ++++++++++++ 3 files changed, 43 insertions(+), 1 deletion(-) create mode 100644 src/tests/fixtures/scroll_restoration_with_smooth_scroll.html diff --git a/src/core/view.js b/src/core/view.js index dad1eb2e9..70f265222 100644 --- a/src/core/view.js +++ b/src/core/view.js @@ -42,7 +42,7 @@ export class View { } scrollToPosition({ x, y }) { - this.scrollRoot.scrollTo(x, y) + this.scrollRoot.scrollTo({ left: x, top: y, behavior: "instant" }) } scrollToTop() { diff --git a/src/tests/fixtures/scroll_restoration_with_smooth_scroll.html b/src/tests/fixtures/scroll_restoration_with_smooth_scroll.html new file mode 100644 index 000000000..cb5d8ed08 --- /dev/null +++ b/src/tests/fixtures/scroll_restoration_with_smooth_scroll.html @@ -0,0 +1,26 @@ + + + + + Scroll Restoration with Smooth Scroll + + + + + + + + diff --git a/src/tests/functional/scroll_restoration_tests.js b/src/tests/functional/scroll_restoration_tests.js index 1010da12a..b3cffb2f9 100644 --- a/src/tests/functional/scroll_restoration_tests.js +++ b/src/tests/functional/scroll_restoration_tests.js @@ -33,3 +33,19 @@ test("returning from history", async ({ page }) => { const { y: yAfterReturning } = await scrollPosition(page) expect(yAfterReturning).not.toEqual(0) }) + +test("returning from history with scroll-behavior: smooth restores scroll position instantly", async ({ page }) => { + await page.goto("/src/tests/fixtures/scroll_restoration_with_smooth_scroll.html") + await scrollToSelector(page, "#three") + const { y: yAfterScrolling } = await scrollPosition(page) + expect(yAfterScrolling).not.toEqual(0) + + await page.goto("/src/tests/fixtures/bare.html") + await page.goBack() + + // Scroll position should be restored instantly, not animated + // If scroll-behavior: smooth was applied, the position would still be 0 or near 0 + // immediately after goBack() because the animation would be in progress + const { y: yAfterReturning } = await scrollPosition(page) + expect(yAfterReturning).not.toEqual(0) +})