Dependencies that have export conditions for node and the browser are resolving to node even when running tests in JSDOM

[tylerbmyers]

Describe the bug

Dependencies that have export conditions for node and the browser are resolving to node even when running tests in JSDOM. This can cause the packages to not behave as intended running the browser code in the JSDOM environment instead of the node code targeting SSR use cases.

Reproduction

This is related to this issue. Here is a repo that demonstrates the issue.

System Info

System:
    OS: macOS 13.6.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 1.45 GB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v18.16.0/bin/yarn
    npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
    pnpm: 8.12.1 - ~/.nvm/versions/node/v18.16.0/bin/pnpm
  Browsers:
    Chrome: 120.0.6099.109
    Safari: 17.2
  npmPackages:
    @vitejs/plugin-react: ^4.2.0 => 4.2.1 
    vite: ^5.0.0 => 5.0.7 
    vitest: ^1.0.4 => 1.0.4

Used Package Manager

yarn

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.

[sheremet-va]

This is intentional. The ecosystem doesn't have a consensus on how exports conditions are used. Vitest follows the idea that it should only apply if output code is executed in the browser. Even though JSDOM emulates browser globals, it doesn't change how imports are working.

But you can always manually add any condition to resolve.conditions field:

export default defineConfig({
  resolve: {
    conditions: ['browser']
  },
})