Browser Back Navigation Bug with Dynamic Routing
juul-vandevelde opened this issue · comments
Link to the code that reproduces this issue
https://github.com/Yummygum/back-navigation-bug
To Reproduce
- Clone the repository and navigate to the project directory.
- Install dependencies:
yarn
- Build the project:
yarn build
- Serve the static files:
Alternatively, run the project in development mode:
npx serve@latest out
yarn dev
- Manually enter a dog slug URL in the address bar (e.g.,
/dog/1
,/dog/2
, or/dog/3
). - Let the page cycle through the dogs automatically.
- Press the back button and observe that it leads to a blank new tab page instead of returning to the previous page.
- Go to the home page and click the button to navigate to Dog 1.
- Wait for the page to automatically cycle through the dogs every 3 seconds.
- Use the provided button (Link) to navigate to
/dog/1
. - The browser's back button now sometimes works and sometimes doesn't.
Current vs. Expected behavior
- Expected: Pressing the back button should return to the previous dog page, whether the navigation is manual or automatic.
- Actual: When manually navigating to a dog slug (e.g.,
/dog/1
,/dog/2
) and allowing the page to automatically cycle through dogs, pressing the back button always leads to a blank new tab page instead of returning to the previous page.
Provide environment information
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 24.3.0: Thu Jan 2 20:24:24 PST 2025; root:xnu-11215.81.4~3/RELEASE_ARM64_T6030
Available memory (MB): 18432
Available CPU cores: 11
Binaries:
Node: 22.14.0
npm: 10.9.2
Yarn: 1.22.22
pnpm: N/A
Relevant Packages:
next: 15.3.0-canary.33 // Latest available version is detected (15.3.0-canary.33).
eslint-config-next: N/A
react: 19.1.0
react-dom: 19.1.0
typescript: 5.8.2
Next.js Config:
output: export
Which area(s) are affected? (Select all that apply)
Dynamic Routes
Which stage(s) are affected? (Select all that apply)
next dev (local), next build (local), next start (local), Vercel (Deployed), Other (Deployed)
Additional context
No response
On initial testing, the issue with the back button returning to home page persists on Firefox, while it does not seem to consistently occur on Chrome.
I have the same issue as in the closed ticket (#71953). I'm working with a [...slug]
file and my reproduction steps are as follows:
I open the website, then navigate to the product list view. Next, I open a product page, and after clicking the back button, the routing takes me to the home page (the starting view). I checked the browser history and it correctly includes all the steps (including the product list), but the next page (after returning to the home screen) is still the product detail page.
I tested it on all major browsers just to be sure, here are my findings:
- Chrome: The issue mainly occurs when navigating directly to a slug, and only occasionally when using a Link.
- Firefox: Same behavior as Chrome — consistent issue on direct navigation, occasional when using a Link.
- Safari: Matches Chrome and Firefox — issue appears on direct slug access, sometimes when using a Link.
☝️ Bump this issue
Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!