new URL(..., import.meta.url) is not resolved in test files since 0.34

[kherock]

Describe the bug

Prior to Vitest 0.34, when using the 'jsdom' environment, I was able to write components that imported assets using the new URL('@my-styleguide/brand/logo.png', import.meta.url) syntax, and the resulting paths would run through a resolver, and ultimately render as URLs resembling https://localhost:3000/@fs/.../node_modules/@my-styleguide/brand/logo.png. Since we use snapshot testing, I used a resolver hook to normalize these URLs into consistent URLs relative to the monorepo project root.

However, since 0.34, this transformation is no longer happening and URLs all resolve with file:///. This usually only happens in 0.33 when the ssr transform mode is used.

There's another potentially related issue in Vite where dependencies optimized through esbuild don't have their new URL(..., import.meta.url) expressions transformed:

vitejs/vite#8427

Reproduction

https://github.com/kherock/vitest-new-url-bug

To reproduce the issue in the repo above, clone it, and upgrade it to vitest 0.34 by running npm i -D vitest@0.34.

System Info

System:
    OS: macOS 13.4.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 48.28 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 16.20.1 - /opt/homebrew/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.19.4 - /opt/homebrew/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Firefox: 102.12.0
    Safari: 16.5.1
  npmPackages:
    vite: ^4.4.9 => 4.4.9 
    vitest: ^0.34.1 => 0.34.1

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[kherock]

I was able to trace down the cause of this regression to the PR implementing testTransformMode

https://github.com/vitest-dev/vitest/pull/3491/files#diff-1fd54d15c1c99fad6c5e00531245ba4fabae341fa7a597475b7242487575f5f9

would it be possible to have the vitest:env-replacer plugin no-op for the web transform mode?

[sheremet-va]

I don't see the problem here. When running in Node.js the URL has the correct schema: file://, it's not a browser to have a base with http:// or https://

[sheremet-va]

would it be possible to have the vitest:env-replacer plugin no-op for the web transform mode?

This is an intentional change that was made to support web mode. Otherwise web workers and other API just doesn't work.

[kherock]

I didn't realize that Vitest was doing its own thing for web workers on top of Vite - I tried setting up a web worker using the new URL() syntax like this:

export const monaco = new Worker(new URL('monaco-editor/esm/vs/editor/editor.worker.js', import.meta.url));

but that gives the following error in Vitest 0.33:

Error: Failed to load url /Users/herockk/Workspaces/vitest-new-url-bug/http:/localhost:3000/node_modules/monaco
-editor/esm/vs/editor/editor.worker.js?type=classic&worker_file (resolved id: /Users/herockk/Workspaces/vitest-
new-url-bug/http:/localhost:3000/node_modules/monaco-editor/esm/vs/editor/editor.worker.js?type=classic&worker_
file). Does the file exist?

In 0.34, the path is different, but the worker still fails:

Error: Failed to load url /Users/herockk/Workspaces/vitest-new-url-bug/test/monaco-editor/esm/vs/editor/editor.
worker.js (resolved id: /Users/herockk/Workspaces/vitest-new-url-bug/test/monaco-editor/esm/vs/editor/editor.wo
rker.js). Does the file exist?

[kherock]

The file:/// paths are fine if they're needed for web workers to function in Node - I just need them to resolve correctly!