Browser Navigation does not load correct page

[cptlchad]

Link to the code that reproduces this issue

Codesandbox

To Reproduce

1. Open the application from code sandbox: https://lzg3v9-3000.csb.app/collections
2. Go to collection 1
3. If you now go forward/backwards from that page (/collections/1) using the browser navigation at some point it breaks and it does not load the page content, despite changing the url

Current vs. Expected behavior

I expect the page to load the correct content based on the history and URL

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
  Available memory (MB): 4102
  Available CPU cores: 2
Binaries:
  Node: 20.9.0
  npm: 9.8.1
  Yarn: 1.22.19
  pnpm: 8.10.2
Relevant Packages:
  next: 14.2.1 // There is a newer version (14.2.3) available, upgrade recommended! 
  eslint-config-next: 14.2.1
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.4.5

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

Not sure

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

next dev (local)

Additional context

No response

[samcx]

@cptlchad Are you seeing any errors when this happens? I am not able to replicate this issue.

[Wes-onetwo]

I can reproduce this issue intermittently, and this only happens on dev server. This issue confuses me a lot as well because it fails my e2e test but I don't see any errors.

[samcx]

@Wes-onetwo Can you share a video of what this looks like?

[cptlchad]

@samcx So I can't reproduce this issue anymore lol. I did two things:

1: Disable React Dev Tools
2: Changed my Browser Profile and bunch of restarts

Since I have done this the error did not occur once. I have no idea how any of these relate to the issue (if there is even a correlation) @Wes-onetwo maybe at that point worth giving it a shot :D

[Wes-onetwo]

@samcx @cptlchad
I'm still able to replicate this issue in incognito mode. Please refer to the recording. Here's how to reproduce it:

1. Go to the Collection 1 page.
2. Refresh the page.
3. Click the back button while the page is still refreshing.
4. Click the forward/back button again.

Screen.Recording.2024-04-29.at.9.57.19.AM.mov