Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(browser): disable hijacking ES modules until vi.mock is implemented #4414

Merged
merged 4 commits into from
Nov 2, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions docs/config/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -1424,15 +1424,14 @@ To have a better type safety when using built-in providers, you can add one of t
#### browser.slowHijackESM

- **Type:** `boolean`
- **Default:** `true`
- **Default:** `false`
- **Version:** Since Vitest 0.31.0

When running tests in Node.js Vitest can use its own module resolution to easily mock modules with `vi.mock` syntax. However it's not so easy to replicate ES module resolution in browser, so we need to transform your source files before browser can consume it.

This option has no effect on tests running inside Node.js.

This options is enabled by default when running in the browser. If you don't rely on spying on ES modules with `vi.spyOn` and don't use `vi.mock`, you can disable this to get a slight boost to performance.

If you rely on spying on ES modules with `vi.spyOn`, you can enable this experimental feature to allow spying on module exports.

### clearMocks

Expand Down
2 changes: 1 addition & 1 deletion packages/vitest/src/node/config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -377,7 +377,7 @@ export function resolveConfig(
resolved.browser ??= {} as any
resolved.browser.enabled ??= false
resolved.browser.headless ??= isCI
resolved.browser.slowHijackESM ??= true
resolved.browser.slowHijackESM ??= false
resolved.browser.isolate ??= true

resolved.browser.api = resolveApiServerConfig(resolved.browser) || {
Expand Down
1 change: 0 additions & 1 deletion packages/vitest/src/runtime/runners/benchmark.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import { performance } from 'node:perf_hooks'
import type { Suite, Task, VitestRunner, VitestRunnerImportSource } from '@vitest/runner'
import { updateTask as updateRunnerTask } from '@vitest/runner'
import { createDefer, getSafeTimers } from '@vitest/utils'
Expand Down
1 change: 1 addition & 0 deletions test/browser/vitest.config.mts
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export default defineConfig({
headless: false,
provider: process.env.PROVIDER || 'webdriverio',
isolate: false,
slowHijackESM: true,
},
alias: {
'#src': resolve(dir, './src'),
Expand Down
5 changes: 3 additions & 2 deletions test/coverage-test/test/coverage.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,14 @@ import virtualFile1 from 'virtual:vitest-custom-virtual-file-1'
import { implicitElse } from '../src/implicitElse'
import { useImportEnv } from '../src/importEnv'
import { second } from '../src/function-count'
import { runDynamicFileCJS, runDynamicFileESM } from '../src/dynamic-files'
import MultiSuite from '../src/multi-suite'

// @ts-expect-error -- untyped virtual file provided by custom plugin
import virtualFile2 from '\0vitest-custom-virtual-file-2'

// Browser mode crashes with dynamic files. Enable this when browser mode works.
// To keep istanbul report consistent between browser and node, skip dynamic tests when istanbul is used.
const skipDynamicFiles = globalThis.process?.env.COVERAGE_PROVIDER === 'istanbul' || !globalThis.process?.env.COVERAGE_PROVIDER
const skipDynamicFiles = '__vitest_browser__' in globalThis || globalThis.process?.env.COVERAGE_PROVIDER === 'istanbul' || !globalThis.process?.env.COVERAGE_PROVIDER

const { pythagoras } = await (() => {
if ('__vitest_browser__' in globalThis)
Expand Down Expand Up @@ -59,10 +58,12 @@ describe('Multiple test suites', () => {
})

test.skipIf(skipDynamicFiles)('run dynamic ESM file', async () => {
const { runDynamicFileESM } = await import('../src/dynamic-files')
await runDynamicFileESM()
})

test.skipIf(skipDynamicFiles)('run dynamic CJS file', async () => {
const { runDynamicFileCJS } = await import('../src/dynamic-files')
await runDynamicFileCJS()
})

Expand Down
Loading