HelloWorld example for vitest-browser-react uses an incorrect import extension when using TypeScript. #8787
Description
Describe the bug
The component file path is in vitest-example/HelloWorld.tsx and the test file is in vitest-example/HelloWorld.test.tsx. However, in the test file, the component is imported using the incorrect extension: ./HelloWorld.jsx, which should've been ./HelloWorld.tsx. And this causes the test to fail because of invalid import.
I know this can easily be corrected in userland, but it's not obvious at first glance because TypeScript doesn't error at the incorrect .jsx extension import.
Reproduction
You only need to freshly initialize vitest browser mode:
pnpx vitest init browser
✔ Choose a language for your tests › TypeScript
✔ Choose a browser provider. Vitest will use its API to control the testing environment › playwright
✔ Choose a browser › chromium
✔ Choose your framework › react
✔ Install Playwright browsers (can be done manually via 'pnpm exec playwright install')? … yesSystem Info
System:
OS: Linux 6.11 Ubuntu 24.04.2 LTS 24.04.2 LTS (Noble Numbat)
CPU: (4) x64 Intel(R) Core(TM) i5-6200U CPU @ 2.30GHz
Memory: 1.80 GB / 7.64 GB
Container: Yes
Shell: 5.2.21 - /bin/bash
Binaries:
Node: 23.9.0 - /home/onyedikachi23/.nvm/versions/node/v23.9.0/bin/node
npm: 11.2.0 - /home/onyedikachi23/.nvm/versions/node/v23.9.0/bin/npm
pnpm: 9.0.0 - /home/onyedikachi23/.nvm/versions/node/v23.9.0/bin/pnpm
Watchman: 4.9.0 - /usr/bin/watchman
Browsers:
Brave Browser: 135.1.77.95
Chrome: 140.0.7339.80
Firefox: 143.0.4
Firefox Developer Edition: 143.0.4
npmPackages:
@vitejs/plugin-react: ^4.3.4 => 4.7.0
@vitest/browser-playwright: ^4.0.2 => 4.0.2
@vitest/coverage-v8: ^4.0.2 => 4.0.2
@vitest/eslint-plugin: ^1.3.9 => 1.3.12
@vitest/ui: ^4.0.2 => 4.0.2
vite: ^6.2.4 => 6.3.6
vitest: ^4.0.2 => 4.0.2Used 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.