Different Typescript treatment between vitest and vitest-browser

[just-boris]

Describe the bug

This file runs successfully in standard vitest, but fails in vitest browser mode:

import { Something } from "./types";

export { Something };

export function getSomething(): Something {
  return {
    foo: 1,
    bar: "a",
  };
}

When running in browser mode, it prints this

 RUN  v3.0.4 /Users/serdiuk/coding/vitest-browser-typescript

 ❯  chromium  test/index.test.ts (0 test)

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Suites 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

 FAIL   chromium  test/index.test.ts [ test/index.test.ts ]
SyntaxError: The requested module '/src/types.ts' does not provide an export named 'Something'
⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯


 Test Files  1 failed (1)
      Tests  no tests
   Start at  23:28:11
   Duration  786ms (transform 0ms, setup 0ms, collect 0ms, tests 0ms, environment 0ms, prepare 200ms)

Reproduction

Published a mini project here: https://github.com/just-boris/vitest-browser-typescript (not sure if browser mode can be used on StackBlitz)

System Info

System:
    OS: macOS 15.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 164.55 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.18.2 - ~/n/bin/node
    npm: 10.8.2 - ~/n/bin/npm
    pnpm: 8.15.4 - ~/n/bin/pnpm
  Browsers:
    Chrome: 132.0.6834.160
    Safari: 18.2
  npmPackages:
    @vitest/browser: ^3.0.4 => 3.0.4
    playwright: ^1.50.1 => 1.50.1
    vitest: ^3.0.4 => 3.0.4

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.

[hi-ogawa]

The issue is technically on non-browser side and ideally both should fail. For modern bundler tooling, it's recommended to mark type import/export, so they can be elided by bundler. https://stackblitz.com/edit/github-2cf9mdip?file=src%2Findex.ts

import type { Something } from "./types";
export type { Something };

This can be ensured by ts option such as isolatedModules and verbatimModuleSyntax (see also vite doc https://vite.dev/guide/features.html#typescript-compiler-options).

[just-boris]

Yes, I was aware of verbatimModuleSyntax, but the point of the issue is to show inconsistency between browser and non-browser mode.

Why does it work fine in non-browser mode, or it works in vite server by default, but only fails in vite browser mode?

[sheremet-va]

Yes, I was aware of verbatimModuleSyntax, but the point of the issue is to show inconsistency between browser and non-browser mode.

Why does it work fine in non-browser mode, or it works in vite server by default, but only fails in vite browser mode?

It works in non-browser mode because Vitests runs tests in a relaxed sandbox environment where ESM rules are less strict then they should be. There will be a switch to run code in an actual environment in the future where your code will fail the same way: #7234

[just-boris]

Thanks for the extra info, it helps. Adopting verbatimModuleSyntax that is.