Vitest fails after SvelteKit Update: Cannot find package '__sveltekit'

[vekunz]

Describe the bug

If I try to update our project from SvelteKit 1.3.10 to the latest version 1.8.3, our Vitest unit tests are failing with a kind of strange error.

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Suites 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
 FAIL  src/routes/page.test.ts [ src/routes/page.test.ts ]
Error: Cannot find package '__sveltekit' imported from C:\path-to-repo\node_modules\@sveltejs\kit\src\runtime\client\utils.js
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
Serialized Error: {
  "code": "ERR_MODULE_NOT_FOUND",
}
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯

Reproduction

I created a minimal reproduction repo based on a create-svelte project. https://github.com/vekunz/sveltekit-vitest-error

Logs

No response

System Info

System:                                                 
    OS: Windows 10 10.0.19045                             
    CPU: (12) x64 Intel(R) Core(TM) i7-9850H CPU @ 2.60GHz
    Memory: 9.34 GB / 31.79 GB                            
  Binaries:
    Node: 16.19.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.13.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 109.0.5414.122
    Edge: Spartan (44.19041.1266.0), Chromium (110.0.1587.50)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @sveltejs/adapter-auto: 2.0.0 => 2.0.0
    @sveltejs/kit: 1.8.3 => 1.8.3
    svelte: 3.55.1 => 3.55.1
    vite: 4.1.4 => 4.1.4

Severity

blocking an upgrade

Additional Information

No response

[nilsroehrig]

Hi there, I've got the same problem and also created a repository to prepare an issue: https://github.com/nilsroehrig/sveltekit-import-problem.

In my case it happens when the code under test imports goto from $app/navigation. Doesn't really matter wether it's used or not. Simply importing already breaks the according tests. The issue appears when switching from @sveltejs/kit<=1.3.10 to >=1.4.0 in the following form:

Error: Cannot find package '$internal' imported from /path/to/repository/node_modules/@sveltejs/kit/src/runtime/client/utils.js

Serialized Error: {
  "code": "ERR_MODULE_NOT_FOUND",
}

Upgrading to >=1.6.0 the issue presents itself like in vekunz' description.

Steps to reproduce

1. Clone the repo mentioned above
2. npm install
3. npm run test:unit
4. Watch tests being green
5. Set @sveltejs/kit to version 1.4.0
6. Repeat steps 2 and 3
7. Watch tests being red with error message mentioned above
8. Set @sveltejs/kit to version >=1.6.0 or higher
9. Repeat steps 2 and 3
10. Watch tests being red with error message described by vekunz

[dummdidumm]

@benmccann I believe this is related to one of the recent changes (#9022), which I thought would increase interop with things like Vitest?

[vekunz]

Error: Cannot find package '$internal' imported from /path/to/repository/node_modules/@sveltejs/kit/src/runtime/client/utils.js

Serialized Error: {
  "code": "ERR_MODULE_NOT_FOUND",
}

Upgrading to >=1.6.0 the issue presents itself like in vekunz' description.

This $internal error was the reason we waited this long with an update. This was fixed in SvelteKit with version 1.5.7. But now this other error (__sveltekit) is present.

[benmccann]

It turns out that Vitest doesn't use Vite itself, but vite-node which doesn't call resolveId on externalized packages. Vitest doesn't process imports inside node_modules packages by default. As a workaround, you can inline the package with deps.inline or ssr.noExternal (though I expect that may cause other problems) or enable deps.registerNodeLoader to process all imports (which is apparently much slower)

[janosh]

Ideally Vitest would fix vite-node, but we probably can't count on that happening anytime soon.

Are you sure? Would it be lots of work? Cause from my experience, vitest devs are very responsive.

[janosh]

deps.inline or ssr.noExternal don't seem to help (if I'm putting them in the right place). Adding

  test: {
    environment: `jsdom`,
    css: true,
    coverage: {
      reporter: [`text`, `json-summary`],
    },
+    deps: {
+      inline: [`@sveltejs/kit`],
+    },
  },

raises

ReferenceError: __sveltekit_1fr7sov is not defined
 ❯ __sveltekit/paths:3:16
 ❯ node_modules/.pnpm/@sveltejs+kit@1.8.5_svelte@3.55.1+vite@4.1.4/node_modules/@sveltejs/kit/src/runtime/client/utils.js:5:31
      3| import { assets } from '__sveltekit/paths';
      4| import { version } from '__sveltekit/environment';
      5| import { PRELOAD_PRIORITIES } from './constants.js';
       |                               ^
      6| 
      7| /* global __SVELTEKIT_APP_VERSION_FILE__, __SVELTEKIT_APP_VERSION_POLL_INTE…
 ❯ node_modules/.pnpm/@sveltejs+kit@1.8.5_svelte@3.55.1+vite@4.1.4/node_modules/@sveltejs/kit/src/runtime/client/singletons.js:3:31

[benmccann]

deps.inline or ssr.noExternal don't seem to help (if I'm putting them in the right place). Adding deps.inline raises ReferenceError: __sveltekit_1fr7sov is not defined

It does help, but it only fixes one of two bugs that are present. The original bug report here had:

Cannot find package '__sveltekit' imported from

The issue there is that vitest doesn't resolve the __sveltekit virtual modules unless @sveltejs/kit is in ssr.noExternal.

When you set it you get the slightly different error message:

ReferenceError: __sveltekit_1fr7sov is not defined

That's because you're now encountering the second issue. #8957 introduced a global variable which is undefined when you use a component alone outside of an application

I don't know if there's a workaround on the user side right now, but we'll get it fixed this week

[astev89]

I have a svelte-kit project that uses a mono repo structure with lerna and yarn workspaces. Using svelte-kit version 1.5 works wonderfully, but 1.8.5 and 1.8.6 both spit out the:
ReferenceError: __sveltekit_1fr7sov is not defined after running a prod build and preview. Is this relevant to this issue even though I'm not not using vitest in anyway?

[laxadev]

I am still facing this issue after moving to version 1.9.1 from 1.7.2

Uncaught (in promise) ReferenceError: __sveltekit_1wwp0ph is not defined at singletons.b9817564.js:1:95

[benmccann]

The virtual module uses optional chaining now:

export const base = __sveltekit_pdvjxu?.base ?? "";
export const assets = __sveltekit_pdvjxu?.assets ?? base;

[janosh]

Thanks y'all! Problem solved. 😄