nextjs - ✅(Solved) Fix router.push with { scroll: false } still scrolls to top when using loading.tsx in production [1 pull requests, 12 comments, 6 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#84423Fetched 2026-04-08 02:19:25
View on GitHub
Comments
12
Participants
6
Timeline
40
Reactions
7
Timeline (top)
commented ×12subscribed ×12mentioned ×9cross-referenced ×2

Fix Action

Fixed

PR fix notes

PR #84446: fix: false behavior with loading.tsx in production

Description (problem / solution / changelog)

fixes: #84423

What?

  • Fixed an issue where router.push({ scroll: false }) still scrolls to top when using loading.tsx in production mode.

Why?

  • When a loading.tsx file is present, it creates a suspense boundary that shows a loading UI during navigation. When this boundary resolves, it triggers server patches that were resetting the scroll behavior back to true, ignoring the original { scroll: false } option.

How?

  • Modified the shouldScroll logic in handleMutable function to preserve existing scroll state when server patches occur:

// Before: const shouldScroll = mutable.shouldScroll ?? true

// After: const shouldScroll = mutable.shouldScroll ?? state.focusAndScrollRef.apply === false ? false : true

Changed files

  • packages/next/src/client/components/router-reducer/handle-mutable.ts (modified, +1/-1)

Code Example

router.push(`?${params.toString()}`, { scroll: false })

---

next build
next start

---

router.push(`?${params.toString()}`, { scroll: false })

---

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.6.0
Binaries:
  Node: 20.17.0
  npm: 10.8.2
  Yarn: 1.22.22
  pnpm: 9.10.0
Relevant Packages:
  "next": "^15.5.2",
  "react": "19.1.0",
  "react-dom": "19.1.0"
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/GlebKodrik/nextjs-bug

To Reproduce

  1. Clone the repo and install dependencies.
  2. Run the app in development mode: npm run dev.
  3. Scroll to the bottom of the page — you will see two buttons: Intensive and Check.
  4. Click either button → navigation happens via:
router.push(`?${params.toString()}`, { scroll: false })
  • In development mode, the page does not scroll to top.
  1. Build and start the app in production:
next build
next start
  1. Scroll to the bottom and click either button again → the page jumps to top unexpectedly.

⚠️ Important:

  • Removing loading.tsx prevents the scroll jump.
  • Adding loading.tsx triggers the scroll jump again.

Current vs. Expected behavior

Current behavior: When calling

router.push(`?${params.toString()}`, { scroll: false })

the page still scrolls to the top, but only in the production build and only when a loading.tsx file exists.

Expected behavior: The page should not scroll to the top when { scroll: false } is passed, regardless of environment or presence of loading.tsx.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.6.0
Binaries:
  Node: 20.17.0
  npm: 10.8.2
  Yarn: 1.22.22
  pnpm: 9.10.0
Relevant Packages:
  "next": "^15.5.2",
  "react": "19.1.0",
  "react-dom": "19.1.0"
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Loading UI and Streaming

Which stage(s) are affected? (Select all that apply)

next build (local)

Additional context

Additional context

  • The issue seems to be tightly connected with the loading.tsx file. Without it, everything works fine.
  • Might be related to how Suspense boundaries or loading.tsx trigger re-render and reset scroll state.
  • Happens both locally and in production build environment.

extent analysis

TL;DR

Removing or modifying the loading.tsx file may resolve the unexpected scroll jump issue in production builds.

Guidance

  • Investigate the loading.tsx file to understand its role in triggering the scroll jump, potentially by commenting out sections or removing it temporarily.
  • Verify if the issue persists when using a different approach to handling loading states, such as using a library or a custom solution that doesn't involve loading.tsx.
  • Check the Next.js documentation for any known issues or configuration options related to scrolling and loading states, particularly in relation to router.push and scroll: false.
  • Consider testing the application with different versions of Next.js to see if the issue is specific to the current version (`^

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

nextjs - ✅(Solved) Fix router.push with { scroll: false } still scrolls to top when using loading.tsx in production [1 pull requests, 12 comments, 6 participants]