Skip to content

autoCodeSplitting breaks vitest: Cannot set properties of undefined (setting 'tsr-split-component:component') #7073

@FredrikErikJohansson

Description

@FredrikErikJohansson

Which project does this relate to?

Router

Describe the bug

After upgrading @tanstack/router-plugin from 1.166.12 to 1.167.9, all vitest tests that import the generated routeTree.gen.ts fail with:

TypeError: Cannot set properties of undefined (setting 'tsr-split-component:component')
 ❯ src/routes/login.tsx:1:57
 ❯ src/routeTree.gen.ts:12:1

The HMR state storage mechanism introduced in PR #7000 / #7005 (react-stable-hmr-split-route-components.ts) writes to import.meta.hot.data['tsr-split-component:component'], but in vitest import.meta.hot.data is undefined.

This affects any project using autoCodeSplitting: true with vitest.

Your Example Website or App

https://github.com/FredrikErikJohansson/tanstack-router-vitest-repro

Steps to Reproduce the Bug or Issue

  1. Clone the repro: git clone https://github.com/FredrikErikJohansson/tanstack-router-vitest-repro
  2. npm install
  3. npm test → fails with TypeError: Cannot set properties of undefined (setting 'tsr-split-component:component')
  4. Downgrade: npm install @tanstack/router-plugin@1.166.12 @tanstack/react-router@1.167.3
  5. npm test → passes

Expected behavior

Tests should pass. The HMR code injected by react-stable-hmr-split-route-components.ts should guard against import.meta.hot.data being undefined in test environments.

Screenshots or Videos

No response

Platform

  • Router Version: @tanstack/router-plugin 1.167.9, @tanstack/react-router 1.168.8
  • OS: macOS
  • Bundler: Vite 6.4.1 (also reproduced with 8.0.3)
  • Vitest: 3.2.x / 4.1.x

Additional context

Root cause: PR #7000 and #7005 introduced tsr-split-component HMR state caching for React Fast Refresh stability. The injected code accesses import.meta.hot.data without a null guard. In vitest, import.meta.hot exists but .data is undefined.

Suggested fix: Add optional chaining in react-stable-hmr-split-route-components.ts:

import.meta.hot?.data?.['tsr-split-component:component']

Workaround: Pin to @tanstack/router-plugin@1.166.12 / @tanstack/react-router@1.167.3.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions