test(react-start): add Vitest plugin integration coverage by onlywei · Pull Request #6074 · TanStack/router

onlywei · 2025-12-12T02:35:31Z

Summary

Add a React Start e2e fixture that runs Vitest with the Start and React Vite plugins enabled.
Verify React hooks render correctly and createIsomorphicFn() selects its client implementation.
Include the fixture dependency lockfile entries. No production plugin changes.

Context

This PR previously disabled forced optimizeDeps configuration in Vitest to address the behavior reported in #6246 and #6262. After rebasing onto current main, both e2e tests pass without that change. The plugin modification has been removed; this PR now only adds test coverage.

Verification

Both e2e tests passed against the unchanged upstream plugin, with local and remote Nx caching disabled:
CI=1 NX_DAEMON=false pnpm nx run tanstack-react-start-e2e-vitest-hooks:test:e2e --outputStyle=stream --skipNxCache --skipRemoteCache
Fixture typecheck passed: pnpm --filter tanstack-react-start-e2e-vitest-hooks exec tsc --noEmit.
Direct plugin smoke confirmed React remains included in optimizeDeps with VITEST=true.
Verified with Node 24.8.0, Vite 8.3.4, and Vitest 4.1.4.

Summary by CodeRabbit

Tests
- Added an end-to-end test fixture for React Start apps, including a sample page with an interactive counter.
- Added coverage for rendering React components that use hooks and for selecting client-specific behavior.
- Configured the fixture to run tests with Vitest in a browser-like environment, including DOM matchers and React Start support.

coderabbitai · 2025-12-12T02:35:43Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: TanStack/router/.coderabbit.yaml
Review profile: CHILL
Plan: Advanced
Run ID: 8bd54a2f-08ba-41dc-9a90-641a917ce73a

📥 Commits

Reviewing files that changed from the base of the PR and between 47106e2 and 890e73f.

⛔ Files ignored due to path filters (1)

pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (1)

e2e/react-start/vitest-hooks/package.json

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 8 remain after this review.

📝 Walkthrough

Walkthrough

Adds a React Start E2E fixture configured with Vitest. The fixture includes a counter component, an isomorphic environment function, root and index routes, and tests for component rendering and client-side isomorphic execution.

Changes

React Start Vitest support

Layer / File(s)	Summary
Fixture runtime `e2e/react-start/vitest-hooks/package.json`, `e2e/react-start/vitest-hooks/src/components/Counter.tsx`, `e2e/react-start/vitest-hooks/src/isomorphic.ts`, `e2e/react-start/vitest-hooks/src/routes/*`, `e2e/react-start/vitest-hooks/src/routeTree.gen.ts`, `e2e/react-start/vitest-hooks/src/router.tsx`	Defines the fixture package and its React app. The app includes a counter, an isomorphic environment function, root and index routes, generated route metadata, and a router.
Vitest configuration and tests `e2e/react-start/vitest-hooks/tsconfig.json`, `e2e/react-start/vitest-hooks/vite.config.ts`, `e2e/react-start/vitest-hooks/tests/*`	Configures TypeScript and Vitest with the React Start and React plugins, jsdom, and DOM matchers. Tests check the initial counter display and the client result from `getIsomorphicEnv()`.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~12 minutes

Change: Other

Merge Risk: ⚪ Minimal · up to 890e7

The fixture enables both plugins and checks client-side isomorphic behavior; no actionable merge-blocking regression is established.

Pre-merge checks | 4 | 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage		Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 3 functions across 4 files. (1 skipped: 1 …	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check		The title clearly and concisely describes the main change: adding React Start Vitest plugin integration coverage.
Description check		The description provides a clear summary, context, verification commands, test results, and release-impact information. It does not reproduce the template checklist or explicitly disclose AI authorshi…
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.

Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 3 functions across 4 files. (1 skipped: 1 unsupported.)

Fix all pre-merge checks with AI

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create a new PR

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands.}

nx-cloud · 2025-12-12T02:36:02Z

View your CI Pipeline Execution ↗ for commit 9fae447

Command	Status	Duration	Result
`nx affected --targets=test:eslint,test:unit,tes...`	✅ Succeeded	9m 28s	View ↗
`nx run-many --target=build --exclude=examples/*...`	✅ Succeeded	1m 56s	View ↗

☁️ Nx Cloud last updated this comment at 2026-02-03 05:13:05 UTC

pkg-pr-new · 2025-12-12T02:37:33Z

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@6074

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@6074

@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@6074

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@6074

@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@6074

@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@6074

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@6074

@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@6074

@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@6074

@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@6074

@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@6074

@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@6074

@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@6074

@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@6074

@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@6074

@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@6074

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@6074

@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@6074

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@6074

@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@6074

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@6074

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@6074

@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@6074

@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@6074

@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@6074

@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@6074

@tanstack/start-fn-stubs

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-fn-stubs@6074

@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@6074

@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@6074

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@6074

@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@6074

@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@6074

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@6074

@tanstack/vue-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router@6074

@tanstack/vue-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-devtools@6074

@tanstack/vue-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-ssr-query@6074

@tanstack/vue-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start@6074

@tanstack/vue-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-client@6074

@tanstack/vue-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-server@6074

@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@6074

commit: 9fae447

coderabbitai

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between bcce02c and b025a578e6b18424367eee1db7b0ad9cdc8b40a8.

📒 Files selected for processing (1)

packages/react-start/src/plugin/vite.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use TypeScript strict mode with extensive type safety for all code

Files:

packages/react-start/src/plugin/vite.ts

**/*.{js,ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Implement ESLint rules for router best practices using the ESLint plugin router

Files:

packages/react-start/src/plugin/vite.ts

🧠 Learnings (1)

📚 Learning: 2025-11-02T16:16:24.898Z

Learnt from: nlynzaad
Repo: TanStack/router PR: 5732
File: packages/start-client-core/src/client/hydrateStart.ts:6-9
Timestamp: 2025-11-02T16:16:24.898Z
Learning: In packages/start-client-core/src/client/hydrateStart.ts, the `import/no-duplicates` ESLint disable is necessary for imports from `#tanstack-router-entry` and `#tanstack-start-entry` because both aliases resolve to the same placeholder file (`fake-start-entry.js`) in package.json during static analysis, even though they resolve to different files at runtime.

Applied to files:

packages/react-start/src/plugin/vite.ts

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

GitHub Check: Test
GitHub Check: Preview

onlywei · 2025-12-29T19:57:39Z

Made a repro and an issue: #6246. The problem can be clearly seen there. This PR fixes it.

westhouseit · 2026-01-16T13:52:05Z

Thanks @onlywei I hope @schiller-manuel is around today approve and merge. :-)

onlywei · 2026-01-16T18:39:46Z

Thanks @onlywei I hope @schiller-manuel is around today approve and merge. :-)

He's most likely busy making awesome features like React Server Components work. I'll be patient and keep rebasing to resolve lockfile conflicts.

westhouseit · 2026-01-16T20:13:42Z

He's most likely busy making awesome features like React Server Components work. I'll be patient and keep rebasing to resolve lockfile conflicts.

Absolutely, and I'm using the workaround for now anyway. :-)

onlywei · 2026-01-16T21:47:10Z

He's most likely busy making awesome features like React Server Components work. I'll be patient and keep rebasing to resolve lockfile conflicts.

Absolutely, and I'm using the workaround for now anyway. :-)

Does createIsomorphicFn().server() still work fine for you in vitest without turning on the tanstackStart vite plugin?

westhouseit · 2026-01-17T13:34:02Z

Does createIsomorphicFn().server() still work fine for you in vitest without turning on the tanstackStart vite plugin?

We're not using any environment functions yet, so it's just the one basic server function using createServerFn().handler() that is working fine. I'm disabling the plugin dynamically in the vite config:

  plugins: [
    !process.env.VITEST && tanstackStart(),
  ].filter(Boolean),

onlywei · 2026-01-17T18:22:47Z

Does createIsomorphicFn().server() still work fine for you in vitest without turning on the tanstackStart vite plugin?

We're not using any environment functions yet, so it's just the one basic server function using createServerFn().handler() that is working fine. I'm disabling the plugin dynamically in the vite config:
  plugins: [

    !process.env.VITEST && tanstackStart(),

  ].filter(Boolean),

I see. Without the Tanstack start vite plugin enabled, it's hard for me to test any isomorphic function.

LadyBluenotes · 2026-07-17T04:41:37Z

The repro and coverage here are useful, and #6246 is still open. The Vite plugin has changed since this was last updated, so could you rebase and apply the Vitest guard to the current needsOptimizeDeps logic? After that we can review it against the current plugin.

coderabbitai · 2026-07-17T14:27:21Z

Note

The previously reviewed commits are no longer reachable (likely due to a force-push or rebase), so CodeRabbit is performing a full review instead of an incremental one. This review may take a little longer.

socket-security · 2026-07-17T14:29:22Z

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@vitejs/plugin-react@5.2.0
	jsdom@27.4.0

View full report

coderabbitai

🧹 Nitpick comments (1)

e2e/react-start/vitest-hooks/package.json (1)
10-11: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Use workspace:^ instead of workspace:* for internal dependencies in e2e apps.

While the general coding guidelines recommend workspace:*, learnings specific to this repository indicate that workspace:^ is the established convention for e2e test apps, whereas workspace:* is reserved for published/library packages. Consider updating the workspace protocol to match the e2e convention.
♻️ Proposed fix
   "dependencies": {
-    "`@tanstack/react-router`": "workspace:*",
-    "`@tanstack/react-start`": "workspace:*",
+    "`@tanstack/react-router`": "workspace:^",
+    "`@tanstack/react-start`": "workspace:^",
     "react": "^19.2.3",
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@e2e/react-start/vitest-hooks/package.json` around lines 10 - 11, Update the
internal dependency declarations for `@tanstack/react-router` and
`@tanstack/react-start` in the package manifest to use the workspace:^ protocol,
matching the established convention for e2e applications instead of workspace:*.
Source: Learnings

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@e2e/react-start/vitest-hooks/package.json`:
- Around line 10-11: Update the internal dependency declarations for
`@tanstack/react-router` and `@tanstack/react-start` in the package manifest to use
the workspace:^ protocol, matching the established convention for e2e
applications instead of workspace:*.

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: dd05de0d-5569-4790-8af1-01d06a1d8d2e

📥 Commits

Reviewing files that changed from the base of the PR and between d3e1cf4 and bd6b523.

⛔ Files ignored due to path filters (1)

pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (12)

e2e/react-start/vitest-hooks/package.json
e2e/react-start/vitest-hooks/src/components/Counter.tsx
e2e/react-start/vitest-hooks/src/isomorphic.ts
e2e/react-start/vitest-hooks/src/routeTree.gen.ts
e2e/react-start/vitest-hooks/src/router.tsx
e2e/react-start/vitest-hooks/src/routes/__root.tsx
e2e/react-start/vitest-hooks/src/routes/index.tsx
e2e/react-start/vitest-hooks/tests/setup.ts
e2e/react-start/vitest-hooks/tests/vitest.spec.tsx
e2e/react-start/vitest-hooks/tsconfig.json
e2e/react-start/vitest-hooks/vite.config.ts
packages/react-start/src/plugin/vite.ts

🚧 Files skipped from review as they are similar to previous changes (1)

packages/react-start/src/plugin/vite.ts

changeset-bot · 2026-10-11T15:03:23Z

⚠️ No Changeset found

Latest commit: 890e73f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

socket-security · 2026-10-11T15:04:14Z

All alerts resolved. Learn more about Socket for GitHub.

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report

…ks fixture

onlywei · 2026-10-11T15:52:50Z

@LadyBluenotes I finally see what you are saying. I tried re-enabling the plugin in my production application a while ago and the unit tests were still failing, but now I see that it was because we already wrote so many workarounds that it was hard to tell what exactly started failing when re-enabling the tanstack start plugin.

This PR is now updated so that it only adds the e2e tests

github-actions Bot added the package: react-start label Dec 12, 2025

coderabbitai Bot reviewed Dec 12, 2025

View reviewed changes

Comment thread packages/react-start/src/plugin/vite.ts Outdated

schiller-manuel reviewed Jan 6, 2026

View reviewed changes

Comment thread packages/react-start/src/plugin/vite.ts Outdated

amodhakal mentioned this pull request Jan 9, 2026

Start + Vitest: Cannot read properties of null (reading 'useState') #6262

Closed

onlywei force-pushed the vitest-optimizeDeps branch 2 times, most recently from 3dc34cf to 79c06e4 Compare January 15, 2026 15:42

onlywei requested a review from schiller-manuel January 15, 2026 16:56

onlywei force-pushed the vitest-optimizeDeps branch 2 times, most recently from b545524 to 9fae447 Compare February 3, 2026 05:02

onlywei force-pushed the vitest-optimizeDeps branch from 9fae447 to bd6b523 Compare July 17, 2026 14:27

coderabbitai Bot reviewed Jul 17, 2026

View reviewed changes

dlukt mentioned this pull request Oct 1, 2026

Vitest working with Nitro v2, but not with Nitro v3.0.1-alpha.0 nitrojs/nitro#3659

Closed

onlywei force-pushed the vitest-optimizeDeps branch from bd6b523 to 4a88baf Compare October 11, 2026 15:03

onlywei added 2 commits October 11, 2026 11:20

Add vitest-hooks e2e test

21d8560

Add isomorphic test case for vitest-hooks e2e test

47106e2

onlywei changed the title ~~fix(react-start): Do not optimizeDeps in VITEST environment~~ test(react-start): add Vitest plugin integration coverage Oct 11, 2026

onlywei force-pushed the vitest-optimizeDeps branch from 4a88baf to 47106e2 Compare October 11, 2026 15:22

test(react-start): use catalog Testing Library versions in vitest-hoo…

890e73f

…ks fixture

Conversation

onlywei commented Dec 12, 2025 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Context

Verification

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

❌ Failed checks (1 warning)

Uh oh!

nx-cloud Bot commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-new Bot commented Dec 12, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

onlywei commented Dec 29, 2025

Uh oh!

Uh oh!

westhouseit commented Jan 16, 2026

Uh oh!

onlywei commented Jan 16, 2026

Uh oh!

westhouseit commented Jan 16, 2026

Uh oh!

onlywei commented Jan 16, 2026

Uh oh!

westhouseit commented Jan 17, 2026

Uh oh!

onlywei commented Jan 17, 2026

Uh oh!

LadyBluenotes commented Jul 17, 2026

Uh oh!

coderabbitai Bot commented Jul 17, 2026

Uh oh!

socket-security Bot commented Jul 17, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

changeset-bot Bot commented Oct 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

socket-security Bot commented Oct 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

onlywei commented Oct 11, 2026

Uh oh!

This branch has not been deployed

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

onlywei commented Dec 12, 2025 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Dec 12, 2025 •

edited

Loading

nx-cloud Bot commented Dec 12, 2025 •

edited

Loading

pkg-pr-new Bot commented Dec 12, 2025 •

edited

Loading

socket-security Bot commented Jul 17, 2026 •

edited

Loading

changeset-bot Bot commented Oct 11, 2026 •

edited

Loading

socket-security Bot commented Oct 11, 2026 •

edited

Loading