jsxImportSource not work in jsdom enviroment with local files

[utftu]

Describe the bug

jsxImportSource option in @vitejs/plugin-react not work with local files with jsdom, happy-dom etc starting from version 0.34. There is error Error: Failed to resolve import "./src/jsx/jsx-dev-runtime". To fix this error you can

1. install vitest 0.33
2. remove // @vitest-environment jsdom

Reproduction

https://github.com/utftu/vitest-jsx

System Info

System:
    OS: macOS 13.4.1
    CPU: (8) arm64 Apple M1
Binaries:
    Node: 20.3.0 - ~/.nvm/versions/node/v20.3.0/bin/node
    pnpm: 8.7.1 - /opt/homebrew/bin/pnpm
Browsers:
    Chrome Canary: 114
npmPackages:
    @vitejs/plugin-react: ^4.0.4 => 4.0.4 
    vite: ^4.4.9 => 4.4.9 
    vitest: ^0.34.4 => 0.34.4

Used Package Manager

pnpm

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.

[Codex-]

Also encountering this issue, removing jsxImportSource works but interestingly it also works with the latest vitest if you roll back @vitejs/plugin-react to 4.0.4

EDIT: Hmmm seems like my discoveries were of import meta resolve returning a URL instead of a string were reported and fixed by node already nodejs/node#49695

[hi-ogawa]

It looks like there was some change around transformMode in https://github.com/vitest-dev/vitest/releases/tag/v0.34.0

Probably the reason why "remove // @vitest-environment jsdom" works is that, the bad import "./src/jsx/jsx-dev-runtime" is injected by hmr related babel transform only for "web" transform (which is the default of jsdom env) but not for "ssr".

Forcing test.testTransformMode.ssr to avoid apply such transform might be a way to go back to the previous behavior:
https://stackblitz.com/edit/github-c58amn-3cbmnq?file=vite.config.ts

---

From a different point of view, I think more robust way to mitigate this issue is to avoid relative path for custom jsx runtime since you don't know how it will be injected by babel transform. Probably this is somewhat analogical to how alias works https://vitest.dev/guide/common-errors.html, so I think it's better to use absolute path for this case new URL('./src/jsx', import.meta.url).pathname

https://stackblitz.com/edit/github-c58amn-wfeq4e?file=vite.config.ts

[sheremet-va]

@hi-ogawa is correct. The plugin (which is outside of Vitest control) just injects the string without resolving it. Don't use relative paths.