Link prefetch can disorder CSS resources

[jwalcher]

Link to the code that reproduces this issue

https://github.com/jwalcher/css-order

To Reproduce

1. start application in production mode
2. visit localhost:3000/one (with Safari if you can). Notice pink title background
3. use link to navigate to localhost:3000/two. title background still pink
4. refresh, navigate back to one, refresh, navigate back to two, and repeat
5. after some number of iterations, title background becomes blue after route change. refresh makes it pink again.

Current vs. Expected behavior

The blue title background comes from a global CSS class imported in layout.tsx, the pink title from a local module imported in page.tsx. Hence, the local class should always take precedence. However, as can be seen in the html, sometimes, on route change, the two stylesheets are loaded in the wrong order.

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.5.0: Thu Jun  8 22:22:20 PDT 2023; root:xnu-8796.121.3~7/RELEASE_ARM64_T6000
Binaries:
  Node: 16.16.0
  npm: 8.11.0
  Yarn: 1.22.19
  pnpm: N/A
Relevant Packages:
  next: 13.5.3
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.3
Next.js Config:
  output: N/A

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

App Router, Routing (next/router, next/navigation, next/link)

Additional context

I suspect that the root cause is the prefetching of resources via /next/link. But, as indicated, I have not managed to make the issue fully reproducible. I can say however that it seems to depend on the size of the pages that are being prefetched (hence the <div>{Page ${params.number} .repeat(100000)}</div> insertions) and on the browser (to me, the problem appears more frequently in Safari, but I can guarantee it is also there in Chrome).

The issue first appears in v13.3.1-canary.9 with PR #48244. Related issues include #46817, #47359, #48120,
#48807, #51030, but there seems to be very little recent activity in the code base related to all of this.

[jwalcher]

issue seems gone in 14.0.0

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.