TypeError: Cannot read properties of null (reading 'useContext') after a fast refresh when using turbo

[JoaoBGusmao]

Link to the code that reproduces this issue

https://github.com/JoaoBGusmao/next-bug

To Reproduce

The example link is actually a very simple next project created using npx create-next-app@latest. It is easier to reproduce on a bigger project, so we'll do some extra steps to kinda force it.
1 - Clone and run the project using yarn dev.
2- Open http://localhost:3000
3 - Go to src/app/page.tsx and toggle the comment (it can be anything, you just have to trigger the refresh) and save it.
4 - Go to chrome dev tools console and dispatch send some simultaneous request to different paths (the path doesn't need to exist). Ex:

fetch('http://localhost:3000');
fetch('http://localhost:3000/test')
fetch('http://localhost:3000/test2')
fetch('http://localhost:3000/test3')
fetch('http://localhost:3000/test4')
fetch('http://localhost:3000/test5')

5 - You should now see on terminal output something similar to:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.
 ⨯ [TypeError: Cannot read properties of null (reading 'useContext')] {
  digest: '785358838'
}
Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.
[TypeError: Cannot read properties of null (reading 'use')]
Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem.
[TypeError: Cannot read properties of null (reading 'use')]

Current vs. Expected behavior

It shouldn't trigger this error, as it shows a faulty code execution.

Provide environment information

Node.js v20.19.1

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:33:47 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 20.19.1
  npm: 10.8.2
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 15.3.2 // Latest available version is detected (15.3.2).
  eslint-config-next: N/A
  react: 19.1.0
  react-dom: 19.1.0
  typescript: 5.8.3
Next.js Config:
  output: N/A

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

Turbopack

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

next dev (local)

Additional context

There are some similar issues, but I couldn't find the relation between theirs and what I'm describing.

It seems like this issue has been around for some time, as I tested some past nextjs versions and had the same issue. But what makes it noticiable now, as I discovered, is the fact that chrome recently launched a feature that keeps dispatching a GET request at every reload to /.well-known/appspecific/com.chrome.devtools.json, which runs concurrently to the normal page request, and triggers this kind of bug that apparently is related to compiling two different pages (even though it is a 404) at the same time.

I'm reporting it because in a more complex project it is very noticeable, happening at every single page reload with devtools open after a code change. Running the 6 requests shown at the reproducible steps makes it more likely to happen on a empty project

[YuliiaKavytska]

I have the same issue

[kdy1]

I cannot reproduce it.
I did npm ci because there's a package-lock.json, but your package.json seems to specify yarn as the package manager.

Which package manager are you using?

[JoaoBGusmao]

I cannot reproduce it. I did npm ci because there's a package-lock.json, but your package.json seems to specify yarn as the package manager.

Which package manager are you using?

My bad. I used yarn to run the script only. This package-lock.json came from the fresh install from create-next-app. So I guess all packages were installed on my machine by npm, but I think it won't affect as it happens in another project where I'm sure everything was installed by yarn.

If you don't mind, could you try with a few more consecutive fetch requests? As it happened easily with a more complex project, I imagine somehow the code complexity and the machine running it can make a difference.

Also, keep in mind that I saw it only when running the dev server, and the only feedback I got was on server's output, not browser

[kdy1]

Yeah I could reproduce it

[CodeMan62]

will try to solve and propose a PR for sure