Vitest failes to start in vscode >=1.90 when using Yarn PnP

[fmal]

Describe the bug

With latest VSCode (version 1.90.2) the extension fails to start Vitest in a project setup with Yarn PnP:

Downgrading VSCode to version 1.89.1 results in Vitest process being successfully created:

I suspect it has to do with Electron upgrade in latest VSCode release that comes bundled with Node.js 20.

Reproduction

https://github.com/Nithanim-Work/vitest-reproducer (reusing minimal example from https://github.com/vitest-dev/vscode/issues/416)

Output

[INFO 21:10:03] [v0.12.4] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace.
[INFO 21:10:04] [API] Running Vitest vpnp (web/vitest.config.ts) with Node.js: /Users/fima/.asdf/shims/node
[Error 21:10:05] [Error Error] Vitest failed to start: 

y
Error: Vitest failed to start: 

y
    at ChildProcess.f (/Users/fima/.vscode/extensions/vitest.explorer-0.12.4/dist/extension.js:18:5392)
    at ChildProcess.emit (node:events:514:28)
    at emit (node:internal/child_process:951:14)
    at process.processTicksAndRejections (node:internal/process/task_queues:83:21)

Version

0.12.4

Validations

• [X] Check that you are using the latest version of the extension
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[niuyuping]

i got same issue

[niuyuping]

Upate: VS Code version is 1.92.0, Vitest version is 2.0.5, Node version is 20.16.0, Vitest extension version is 1.0.6

The error message is:

[sheremet-va]

There is a small patch in 1.0.7. Please let me know if it works for you.

[niuyuping]

A new error message after update to 1.0.7

[niuyuping]

I checked the .yarn folder in my project, the snapshot is below

I use yarn in pnp mode.

[pavitra-infocusp]

Same thing with PNPM

[INFO 13:29:34] [v1.0.7] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace.
[INFO 13:29:34] [API] Running Vitest v2.0.5 (Test-Extension/vitest.config.ts) with Node.js: /snap/bin/node
[Error 13:29:34] [Error Error] Vitest process exited with code null
Error: Vitest process exited with code null
    at ChildProcess.p (/home/pavitra/.vscode/extensions/vitest.explorer-1.0.7/dist/extension.js:19:177)
    at ChildProcess.emit (node:events:519:28)
    at ChildProcess.emit (node:domain:488:12)
    at ChildProcess._handle.onexit (node:internal/child_process:294:12)

[L2HYUNN]

same issue with yarn v4.4 PnP

[fmal]

@sheremet-va thanks for taking time to address this, after updating to latest version i get a different error on startup that is a bit similar to what others are reporting (thou it fails at loading different dependency):

It should be reproducible using the repo at https://github.com/Nithanim-Work/vitest-reproducer

[fmal]

@sheremet-va thanks, unfortunately with the minimal reproduction repo (https://github.com/Nithanim-Work/vitest-reproducer) extension still fails to start. I tried on 2 different machines and get the same error:

(also tried bumping vitest to 2.0.5 but that didn't help)

[sheremet-va]

I see now why it happens. Does the extension work for you if you have Vitest installed globally?

[fmal]

Not sure how to test that, yarn > 1 doesn't provide a way to install packages globally, see https://yarnpkg.com/migration/guide#use-yarn-dlx-instead-of-yarn-global. I tried installing vitest globally with legacy yarn using yarn global command as well as npm install vitest -g, but that didn't change anything.

[ParkerRobinson]

I'm also able to repro (Yarn PNP with workspaces) and have tried installing the extension globally, no luck.

You can get past this error and have extension make it past startup by installing whatever package it says is missing in the directory its looking for it... but you'll then run into issues when you try to run any test via the UI as each test's packages are going to be missing.

[viell-dev]

I've encountered the same problem.

My first instinct was to try yarn unplug vitest and setting vitest.vitestPackagePath but that didn't work, it just shifts the problem to the dependencies of vitest.

Maybe that might be a path towards a workaround for this if we could get yarn to add an unplug with dependencies option, unless I'm just missing something and that already exists.

Trying to also unplug the dependencies (e.g. yarn unplug -R debug) didn't seem to do anything since they get unplugged into .yarn/unplugged/ instead of .yarn/unplugged/vitest-virtual-785a8f091b/node_modules/. Also tried unpluggin vitest with the -R flag but it didn't make a difference.

Click here to see versions and logs

# Versions VSCode: 1.92.2 Node: 20.17.0 Yarn: 4.4.1 Vitest: 2.0.5 Vitest-extension: 1.2.1 # Not unplugged ``` [INFO 09:42:15] [v1.2.1] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace. [INFO 09:42:16] [API] Running Vitest vpnp (taqs/vitest.config.ts) with Node.js: /home/viell/.nvm/versions/node/v20.17.0/bin/node [Error 09:42:16] [Error Error] Vitest failed to start: Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'vitest' imported from /home/viell/.vscode/extensions/vitest.explorer-1.2.1/dist/worker.js at packageResolve (node:internal/modules/esm/resolve:854:9) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1169:11) at nextResolve (node:internal/modules/esm/hooks:866:28) at resolve$1 (file:///home/viell/Projects/oadata/taqs/.pnp.loader.mjs:2023:12) at nextResolve (node:internal/modules/esm/hooks:866:28) at Hooks.resolve (node:internal/modules/esm/hooks:304:30) at MessagePort.handleMessage (node:internal/modules/esm/worker:196:24) at [nodejs.internal.kHybridDispatch] (node:internal/event_target:820:20) at MessagePort. (node:internal/per_context/messageport:23:28) Error: Vitest failed to start: Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'vitest' imported from /home/viell/.vscode/extensions/vitest.explorer-1.2.1/dist/worker.js at packageResolve (node:internal/modules/esm/resolve:854:9) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1169:11) at nextResolve (node:internal/modules/esm/hooks:866:28) at resolve$1 (file:///home/viell/Projects/oadata/taqs/.pnp.loader.mjs:2023:12) at nextResolve (node:internal/modules/esm/hooks:866:28) at Hooks.resolve (node:internal/modules/esm/hooks:304:30) at MessagePort.handleMessage (node:internal/modules/esm/worker:196:24) at [nodejs.internal.kHybridDispatch] (node:internal/event_target:820:20) at MessagePort. (node:internal/per_context/messageport:23:28) at ChildProcess.f (/home/viell/.vscode/extensions/vitest.explorer-1.2.1/dist/extension.js:18:5617) at ChildProcess.emit (node:events:519:28) at emit (node:internal/child_process:951:14) at process.processTicksAndRejections (node:internal/process/task_queues:83:21) ``` # Unplugged ``` $ yarn unplug vitest ➤ YN0000: Will unpack vitest@npm:2.0.5 [bb2fd] to /home/viell/Projects/oadata/taqs/.yarn/unplugged/vitest-virtual-785a8f091b ➤ YN0000: Done in 0s 3ms ➤ YN0000: · Yarn 4.4.1 ➤ YN0000: ┌ Resolution step ➤ YN0000: └ Completed ➤ YN0000: ┌ Post-resolution validation ➤ YN0086: │ Some peer dependencies are incorrectly met by dependencies; run yarn explain peer-requirements for details. ➤ YN0000: └ Completed ➤ YN0000: ┌ Fetch step ➤ YN0000: └ Completed in 0s 265ms ➤ YN0000: ┌ Link step ➤ YN0000: │ ESM support for PnP uses the experimental loader API and is therefore experimental ➤ YN0000: └ Completed ➤ YN0000: · Done with warnings in 0s 458ms ``` Added this to `.vscode/settings.json` ``` "vitest.vitestPackagePath": ".yarn/unplugged/vitest-virtual-785a8f091b/node_modules/vitest/package.json", ``` Result: ``` [INFO 09:59:06] [v1.2.1] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace. [INFO 09:59:06] [API] Running Vitest v2.0.5 (taqs/vitest.config.ts) with Node.js: /home/viell/.nvm/versions/node/v20.17.0/bin/node [Error 09:59:06] [Error Error] Vitest failed to start: Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'debug' imported from /home/viell/Projects/oadata/taqs/.yarn/unplugged/vitest-virtual-785a8f091b/node_modules/vitest/dist/node.js at packageResolve (node:internal/modules/esm/resolve:854:9) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1169:11) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:540:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:509:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:239:38) at ModuleWrap. (node:internal/modules/esm/module_job:96:40) at link (node:internal/modules/esm/module_job:95:36) Error: Vitest failed to start: Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'debug' imported from /home/viell/Projects/oadata/taqs/.yarn/unplugged/vitest-virtual-785a8f091b/node_modules/vitest/dist/node.js at packageResolve (node:internal/modules/esm/resolve:854:9) at moduleResolve (node:internal/modules/esm/resolve:927:18) at defaultResolve (node:internal/modules/esm/resolve:1169:11) at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:540:12) at ModuleLoader.resolve (node:internal/modules/esm/loader:509:25) at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:239:38) at ModuleWrap. (node:internal/modules/esm/module_job:96:40) at link (node:internal/modules/esm/module_job:95:36) at ChildProcess.f (/home/viell/.vscode/extensions/vitest.explorer-1.2.1/dist/extension.js:18:5617) at ChildProcess.emit (node:events:519:28) at emit (node:internal/child_process:951:14) at process.processTicksAndRejections (node:internal/process/task_queues:83:21) ```

[jordanpg]

After messing around for a while, I managed to figure out a workaround. The pnp loader doesn't seem to want to resolve modules the way the worker hopes to be able to (i.e. it doesn't seem to check the workspace at all unless the importer or the imported script are in the workspace). Not really sure if this is an issue with yarn or if the extension is meant to be doing something different (like using the plugin API or something)

Unpacking vitest and pointing directly to it fixes the vitest/node import as @viell-dev says above, but the extension seems to skip adding the pnp hooks when you specify vitestPackagePath, so vitest's dependencies would also fail to resolve. This can be worked around through the NODE_OPTIONS environment variable; though the extension could be updated to skip this requirement

1. Run yarn unplug vitest (don't think -R is needed)
2. Configure vitest.vitestPackagePath to point to the unpacked package.json (this may be different for you)

   "vitest.vitestPackagePath": ".yarn/unplugged/vitest-virtual-b853d33a81/node_modules/vitest/package.json"

3. Configure vitest.nodeEnv to set the NODE_OPTIONS env. var similar to the following:

   "vitest.nodeEnv": {
   "NODE_OPTIONS": "--require C:\\your\\path\\to\\.pnp.cjs --experimental-loader file:///C:/your/path/to/.pnp.loader.mjs",
   },

i imagine there's a way to configure this so that you don't have to hard-set the paths but this works for me

[niuyuping]

After messing around for a while, I managed to figure out a workaround. The pnp loader doesn't seem to want to resolve modules the way the worker hopes to be able to (i.e. it doesn't seem to check the workspace at all unless the importer or the imported script are in the workspace). Not really sure if this is an issue with yarn or if the extension is meant to be doing something different (like using the plugin API or something)

Unpacking vitest and pointing directly to it fixes the vitest/node import as @viell-dev says above, but the extension seems to skip adding the pnp hooks when you specify vitestPackagePath, so vitest's dependencies would also fail to resolve. This can be worked around through the NODE_OPTIONS environment variable; though the extension could be updated to skip this requirement

1. Run yarn unplug vitest (don't think -R is needed)
2. Configure vitest.vitestPackagePath to point to the unpacked package.json (this may be different for you)

"vitest.vitestPackagePath": ".yarn/unplugged/vitest-virtual-b853d33a81/node_modules/vitest/package.json"

3. Configure vitest.nodeEnv to set the NODE_OPTIONS env. var similar to the following:

"vitest.nodeEnv": {
    "NODE_OPTIONS": "--require C:\\your\\path\\to\\.pnp.cjs --experimental-loader file:///C:/your/path/to/.pnp.loader.mjs",
},

i imagine there's a way to configure this so that you don't have to hard-set the paths but this works for me

Thanks~~that works for me. The command yarn unplug -R vitest works, but without the -R parameter, it does not. Additionally, in Yarn versions 4 and above, you need to add pnpEnableEsmLoader: true to your yarnrc.yml file; otherwise, the .pnp.cjs and .pnp.loader.mjs files will not be found.

[dawsonbooth]

I may be missing something, but I'm unfortunately still getting a startup crash with Yarn PnP on v1.2.10:

[INFO 1:02:13 PM] [v1.2.10] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace.
[INFO 1:02:14 PM] [API] Running Vitest vpnp (ui/vite.config.ts) with Node.js: ~/Library/Caches/fnm_multishells/3213_1727368426358/bin/node 
[Error 1:02:14 PM] [Error Error] Vitest failed to start: 
TypeError [ERR_INVALID_RETURN_PROPERTY_VALUE]: Expected array buffer, or typed array to be returned for the "source" from the "transformSource" function but got undefined.
    at assertBufferSource (node:internal/modules/esm/translators:104:9)
    at stringify (node:internal/modules/esm/translators:119:3)
    at createCJSModuleWrap (node:internal/modules/esm/translators:279:12)
    at ModuleLoader.commonjsStrategy (node:internal/modules/esm/translators:358:10)
Error: Vitest failed to start: 
TypeError [ERR_INVALID_RETURN_PROPERTY_VALUE]: Expected array buffer, or typed array to be returned for the "source" from the "transformSource" function but got undefined.
    at assertBufferSource (node:internal/modules/esm/translators:104:9)
    at stringify (node:internal/modules/esm/translators:119:3)
    at createCJSModuleWrap (node:internal/modules/esm/translators:279:12)
    at ModuleLoader.commonjsStrategy (node:internal/modules/esm/translators:358:10)
    at ChildProcess.f (~/.vscode/extensions/vitest.explorer-1.2.10/dist/extension.js:19:5641)
    at ChildProcess.emit (node:events:519:28)
    at emit (node:internal/child_process:951:14)
    at process.processTicksAndRejections (node:internal/process/task_queues:83:21)

[sheremet-va]

This is a different error that was never reported. I cannot help you unless you provide any kind of reproduction. Adding +1 will not help fix the issue.

[TehPers]

Node.js: v20.17.0 (with corepack enable) VSCode: v1.93.1

1. yarn create vite to make a project. (yarn@3.5.0 is installed, as is vite@5.4.1) - all default settings
2. yarn dlx @yarnpkg/sdks vscode to setup editor SDKs
3. yarn add -D vitest (installs vitest@2.1.1)
4. Add a src/example.test.ts with a very simple unit test. Verify it runs with yarn run vitest.
5. Install v1.2.10 of the Vitest extension.

[INFO 12:38:43 PM] [v1.2.10] Vitest extension is activated because Vitest is installed or there is a Vite/Vitest config file in the workspace.
[Error 12:38:43 PM] [Error Error] Cannot find module 'vitest/node'
Require stack:
- E:\Dev\Random\blah
Error: Cannot find module 'vitest/node'
Require stack:
- E:\Dev\Random\blah
    at Module._resolveFilename (node:internal/modules/cjs/loader:1152:15)
    at Function.i._resolveFilename (node:electron/js2c/utility_init:2:13739)
    at callNativeResolution (e:\Dev\Random\blah\.pnp.cjs:11948:30)
    at resolveToUnqualified (e:\Dev\Random\blah\.pnp.cjs:12106:24)
    at resolveRequest (e:\Dev\Random\blah\.pnp.cjs:12355:31)
    at Object.resolveRequest (e:\Dev\Random\blah\.pnp.cjs:12418:26)
    at zr (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:24:651)
    at c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:24:3210
    at Array.forEach (<anonymous>)
    at Lg (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:24:3174)
    at Qc (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:24:3075)
    at Bn._defineTestProfiles (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:25:2126)
    at Bn.defineTestProfiles (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:25:2028)
    at Bn.activate (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:25:6333)
    at lv (c:\Users\tehpe\.vscode\extensions\vitest.explorer-1.2.10\dist\extension.js:25:1053)
    at m.n (c:\Users\tehpe\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\api\node\extensionHostProcess.js:151:6409)
    at m (c:\Users\tehpe\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\api\node\extensionHostProcess.js:151:6372)
    at m.l (c:\Users\tehpe\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\api\node\extensionHostProcess.js:151:5829)

Edit: adding a vite.config.ts doesn't fix the error either.

[sheremet-va]

@TehPers please, check if v1.2.11 fixes it for you.

[dawsonbooth]

@sheremet-va v1.2.11 fixed the issue I was seeing. Thank you!

[TehPers]

@TehPers please, check if v1.2.11 fixes it for you.

The latest version is working for me now. Thank you!