fix(browser): disable hijacking ES modules until vi.mock is implement…

…ed (#4414)

docs/config/index.md

@@ -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
 

packages/vitest/src/node/config.ts

@@ -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) || {

packages/vitest/src/runtime/runners/benchmark.ts

@@ -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'

test/browser/vitest.config.mts

@@ -15,6 +15,7 @@ export default defineConfig({
       headless: false,
       provider: process.env.PROVIDER || 'webdriverio',
       isolate: false,
+      slowHijackESM: true,
     },
     alias: {
       '#src': resolve(dir, './src'),

test/coverage-test/test/coverage.test.ts

@@ -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)
@@ -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()
 })