react-start + vitest: Cannot read properties of null (reading 'useState')
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 15.1k
- Forks
- 1.9k
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 143
Description
Which project does this relate to?
Start
Describe the bug
When using TanStack Start with Vitest, tests fail with:
TypeError: Cannot read properties of null (reading 'useState')
This now reproduces in a single-package project (no pnpm workspace / monorepo required). The failure occurs when a component using React hooks is rendered during Vitest runs.
Root Cause: The TanStack Start Vite plugin applies optimizeDeps configuration unconditionally, including in the Vitest test environment. This interferes with module resolution, causing React to be resolved as null during tests.
Impact: This bug affects TanStack Start + Vitest even without any workspace setup, so it's not limited to monorepos. Any app running Vitest with the plugin enabled hits the same failure.
// This errors:
plugins: [tanstackStart(), viteReact()]
// This does not error:
plugins: [
process.env.VITEST !== 'true' && tanstackStart(),
viteReact(),
]
Your Example Website or App
https://github.com/onlywei/repro-tanstack-start-vitest
Steps to Reproduce the Bug or Issue
- Clone the repro: https://github.com/onlywei/repro-tanstack-start-vitest
- Run
pnpm install - Run
pnpm test
Expected behavior
Tests should pass without errors. Components that use React hooks should render normally during Vitest test execution.
The TanStack Start plugin should not interfere with Vitest's module resolution. Ideally, the plugin should automatically detect when running in a test environment and skip optimization steps that are not needed for testing.
Screenshots or Videos
No response
Platform
- Router / Start Version: 1.157.18
- OS: macOS
- Vite Version: 7.3.1
- Vitest version: 4.0.18
Additional context
The repro repo has been simplified to a single-package layout to demonstrate this is not a workspace-specific issue.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
The relevant entry point is the TanStack Start Vite plugin's optimizeDeps handling; start by examining how it is applied during Vitest runs. Reproduce with the linked single-package app using pnpm install and pnpm test, and consider the issue complete when React hook components render and the tests pass without the plugin breaking module resolution.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- build-system, testing
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 57/100