Upgrading from vitest v3.2.4 to v4.0.1 with svelte 5 runes while using svelte-testing-library render breaks tests

[loganripplinger]

Description

Upgrading from vitest v3.2.4 to v4.0.1 with svelte 5 runes breaks tests.

Here is a new sveltekit repo that reproduces https://github.com/loganripplinger/vitest-testing-library-repro

In the test I am importing a component that uses runes. I receive an error message eminating from render node_modules/.pnpm/@testing-library+svelte@5.2.8_svelte@5.41.2_vite@7.1.11_vitest@4.0.1_jsdom@27.0.1_postcss@8.5.6__/node_modules/@testing-library/svelte/src/pure.js:75:21 of:

Svelte error: rune_outside_svelte
The `$state` rune is only available inside `.svelte` and `.svelte.js/ts` files
https://svelte.dev/e/rune_outside_svelte
 ❯ Module.rune_outside_svelte node_modules/.pnpm/svelte@5.41.2/node_modules/svelte/src/internal/client/errors.js:354:17
 ❯ get node_modules/.pnpm/svelte@5.41.2/node_modules/svelte/src/index-client.js:29:8
 ❯ mount node_modules/.pnpm/@testing-library+svelte@5.2.8_svelte@5.41.2_vite@7.1.11_vitest@4.0.1_jsdom@27.0.1_postcss@8.5.6__/node_modules/@testing-library/svelte/src/core/modern.svelte.js:26:17
 ❯ render node_modules/.pnpm/@testing-library+svelte@5.2.8_svelte@5.41.2_vite@7.1.11_vitest@4.0.1_jsdom@27.0.1_postcss@8.5.6__/node_modules/@testing-library/svelte/src/pure.js:75:21

Example

This shows using vitest 3.2.4 works fine:

user input >>> vitest pnpm install vitest@3

+ vitest 3.2.4 (4.0.1 is available)

Done in 1.4s using pnpm v10.14.0

user input >>> vitest pnpm run test:unit

> vitest@0.0.1 test:unit /Users/user/work/vitest
> vitest


 DEV  v3.2.4 /Users/user/work/vitest

 ✓  0  src/demo.svelte.spec.ts (1 test) 36ms
   ✓ sum test > foo 36ms

 Test Files  1 passed (1)
      Tests  1 passed (1)
   Start at  16:29:45
   Duration  582ms (transform 147ms, setup 224ms, collect 22ms, tests 36ms, environment 152ms, prepare 31ms)

 PASS  Waiting for file changes...

user input >>> vitest pnpm install vitest@4.0.1
Packages: +11 -21
+++++++++++---------------------
Progress: resolved 191, reused 145, downloaded 0, added 0, done

devDependencies:
- vitest 3.2.4
+ vitest 4.0.1 already in devDependencies, was not moved to dependencies.

Done in 838ms using pnpm v10.14.0

Then switching to vitest v4.0.1 it breaks:

user input >>> vitest pnpm run test:unit

> vitest@0.0.1 test:unit /Users/user/work/vitest
> vitest

The following Vite config options will be overridden by SvelteKit:
  - base

 DEV  v4.0.1 /Users/logan/work/vitest

 ❯  0  src/demo.svelte.spec.ts (1 test | 1 failed) 2ms
   ❯ sum test (1)
     × foo 2ms

⎯ Failed Tests 1 ⎯

 FAIL   0  src/demo.svelte.spec.ts > sum test > foo
Svelte error: rune_outside_svelte
The `$state` rune is only available inside `.svelte` and `.svelte.js/ts` files
https://svelte.dev/e/rune_outside_svelte
 ❯ Module.rune_outside_svelte node_modules/.pnpm/svelte@5.41.2/node_modules/svelte/src/internal/client/errors.js:354:17
 ❯ get node_modules/.pnpm/svelte@5.41.2/node_modules/svelte/src/index-client.js:29:8
 ❯ mount node_modules/.pnpm/@testing-library+svelte@5.2.8_svelte@5.41.2_vite@7.1.11_vitest@4.0.1_jsdom@27.0.1_postcss@8.5.6__/node_modules/@testing-library/svelte/src/core/modern.svelte.js:26:17
 ❯ render node_modules/.pnpm/@testing-library+svelte@5.2.8_svelte@5.41.2_vite@7.1.11_vitest@4.0.1_jsdom@27.0.1_postcss@8.5.6__/node_modules/@testing-library/svelte/src/pure.js:75:21

⎯[1/1]⎯


 Test Files  1 failed (1)
      Tests  1 failed (1)
   Start at  16:29:58
   Duration  309ms (transform 35ms, setup 60ms, collect 30ms, tests 2ms, environment 157ms, prepare 2ms)

[mcous]

@loganripplinger this is an interesting issue! I'm able to reproduce, but I don't have a clear idea why this is happening, since nothing has changed on our end. This issue might be worth raising in the Svelte discord or with vite-plugin-svelte.

Weirdly, in the test suite of svelte-testing-library itself, we are able to use Vite 4 without issue. So my best guess is that Vitest v4 has changed... something that somehow messes up vite-plugin-svelte's heuristics for determining if a file should be compiled. As far as I know, the method we use here is supposed to work

For what it's worth vitest-browser-svelte appears to be working. I have no idea why, because their render implementation is copied from this repository, but if you are able to switch, Vitest browser testing is an exceedingly pleasant experience

[rallets]

it happens to me too 🤕