Skip to main content
GoodFirstPicks
DashboardIssuesReposLeaderboard

GoodFirstPicks by Leaveitblank © 2026

CreatorRequest a RepoPrivacy PolicyTerms of Service
Scrolling happens when user returns to a page with hash using browser back button | GoodFirstPicks

Scrolling happens when user returns to a page with hash using browser back button

vercel/next.js 12 comments 27d ago
View on GitHub
mediumopenScope: somewhat clearSkill match: maybeTest focusedNext.jsTypeScriptReact

Why this is a good first issue

The issue involves browser-specific behavior and requires understanding of Next.js internals.

AI Summary

The issue describes unexpected scrolling behavior when returning to a page with a hash using the browser back button. The problem seems to be related to the `componentDidUpdate` lifecycle method triggering `scrollToHash` incorrectly. While the issue is reproducible and test-focused, it requires understanding of Next.js internals and browser behavior.

Issue Description

Bug report

Describe the bug

When user returns to a page which have url with hash (e.g. http://localhost:3000/test#anchor) from another page, unexpected scrolling to the anchor element happen. It seems componentDidUpdate of Container triggers scrollToHash even when one returns by clicking browser back button. (https://github.com/vercel/next.js/blob/v9.4.4/packages/next/client/index.js#L135-L137)

To Reproduce

Example repo: https://github.com/monae/nextjs-scrolltohash-bug

  1. git clone [email protected]:monae/nextjs-scrolltohash-bug.git and npm run dev.
  2. Click on 'Open the test page without hash'. You are on top of the page.
  3. Scroll down and click on 'Open another page'.
  4. Click on browser back button, then you return to the preserved scroll position (Chrome, Safari) or top of the page (Firefox).
  5. Back to the first page and click on 'Open the test page with hash'. You are on the anchor element.
  6. Scroll down and click on 'Open another page'.
  7. Click on browser back button, then you return to the anchor element.

Expected behavior

The results of 4. & 7. should be same (although the behavior of Firefox is not desirable).

Screenshots

System information

  • OS: macOS
  • Browser (if applies) Chrome, Safari, Firefox
  • Version of Next.js: 9.4.4
  • Version of Node.js: 14.3.0

Additional context

GitHub Labels

good first issue

Want to work on this?

Claim this issue to let others know you're working on it. You'll earn 20 points when you complete it!

Risk Flags

  • browser-specific behavior
  • potential cross-cutting changes
Loading labels...

Details

Points20 pts
Difficultymedium
Scopesomewhat clear
Skill Matchmaybe
Test Focusedyes