fix(browser): set server.open to false and move error handling after init (#5845)

sheremet-va · web-flow · commit 47003679436e · 2024-06-05T12:40:18.000+02:00
diff --git a/packages/browser/src/client/mocker.ts b/packages/browser/src/client/mocker.ts
@@ -5,14 +5,18 @@ import { getBrowserState } from './utils'
 
 const now = Date.now
 
+interface SpyModule {
+  spyOn: typeof import('vitest').vi['spyOn']
+}
+
 export class VitestBrowserClientMocker {
   private queue = new Set<Promise<void>>()
   private mocks: Record<string, any> = {}
   private factories: Record<string, () => any> = {}
 
-  private spyModule!: typeof import('vitest')
+  private spyModule!: SpyModule
 
-  public setSpyModule(mod: typeof import('vitest')) {
+  public setSpyModule(mod: SpyModule) {
     this.spyModule = mod
   }
 
@@ -187,7 +191,7 @@ export class VitestBrowserClientMocker {
                 if (isFunction) {
                   // mock and delegate calls to original prototype method, which should be also mocked already
                   const original = this[key]
-                  const mock = spyModule.vi.spyOn(this, key as string).mockImplementation(original)
+                  const mock = spyModule.spyOn(this, key as string).mockImplementation(original)
                   mock.mockRestore = () => {
                     mock.mockReset()
                     mock.mockImplementation(original)
@@ -197,7 +201,7 @@ export class VitestBrowserClientMocker {
               }
             }
           }
-          const mock = spyModule.vi.spyOn(newContainer, property).mockImplementation(mockFunction)
+          const mock = spyModule.spyOn(newContainer, property).mockImplementation(mockFunction)
           mock.mockRestore = () => {
             mock.mockReset()
             mock.mockImplementation(mockFunction)
diff --git a/packages/browser/src/client/tester.ts b/packages/browser/src/client/tester.ts
@@ -63,9 +63,6 @@ async function prepareTestEnvironment(files: string[]) {
 
   const rpc: any = await loadSafeRpc(client)
 
-  stopErrorHandler()
-  registerUnexpectedErrors(rpc)
-
   const providedContext = await client.rpc.getProvidedContext()
 
   const state: WorkerGlobalState = {
@@ -119,17 +116,20 @@ async function prepareTestEnvironment(files: string[]) {
       browserHashMap.set(filename, [true, version])
   })
 
-  const [runner, { startTests, setupCommonEnv, Vitest }] = await Promise.all([
+  const [runner, { startTests, setupCommonEnv, Spy }] = await Promise.all([
     initiateRunner(config),
     importId('vitest/browser') as Promise<typeof import('vitest/browser')>,
   ])
 
-  mocker.setSpyModule(Vitest)
+  mocker.setSpyModule(Spy)
 
   onCancel.then((reason) => {
     runner.onCancel?.(reason)
   })
 
+  stopErrorHandler()
+  registerUnexpectedErrors(rpc)
+
   return {
     runner,
     config,
diff --git a/packages/vitest/src/browser.ts b/packages/vitest/src/browser.ts
@@ -10,4 +10,4 @@ export {
   getCoverageProvider,
   startCoverageInsideWorker,
 } from './integrations/coverage'
-export * as Vitest from './index'
+export * as Spy from './integrations/spy'
diff --git a/packages/vitest/src/integrations/browser/server.ts b/packages/vitest/src/integrations/browser/server.ts
@@ -35,7 +35,7 @@ export async function createBrowserServer(project: WorkspaceProject, configFile:
         enforce: 'post',
         name: 'vitest:browser:config',
         async config(config) {
-          const server = resolveApiServerConfig(config.test?.browser || {}) || {
+          const server = resolveApiServerConfig(config.test?.browser || {}, defaultBrowserPort) || {
             port: defaultBrowserPort,
           }
 
@@ -45,6 +45,7 @@ export async function createBrowserServer(project: WorkspaceProject, configFile:
           config.server = {
             ...config.server,
             ...server,
+            open: false,
           }
           config.server.fs ??= {}
           config.server.fs.allow = config.server.fs.allow || []
diff --git a/packages/vitest/src/node/config.ts b/packages/vitest/src/node/config.ts
@@ -38,6 +38,7 @@ function parseInspector(inspect: string | undefined | boolean | number) {
 
 export function resolveApiServerConfig<Options extends ApiConfig & UserConfig>(
   options: Options,
+  defaultPort: number,
 ): ApiConfig | undefined {
   let api: ApiConfig | undefined
 
@@ -407,7 +408,7 @@ export function resolveConfig(
   }
 
   // the server has been created, we don't need to override vite.server options
-  resolved.api = resolveApiServerConfig(options)
+  resolved.api = resolveApiServerConfig(options, defaultPort)
 
   if (options.related)
     resolved.related = toArray(options.related).map(file => resolve(resolved.root, file))
@@ -535,7 +536,8 @@ export function resolveConfig(
   resolved.browser.enabled ??= false
   resolved.browser.headless ??= isCI
   resolved.browser.isolate ??= true
-  resolved.browser.ui ??= !isCI
+  // disable in headless mode by default, and if CI is detected
+  resolved.browser.ui ??= resolved.browser.headless === false ? true : !isCI
 
   resolved.browser.viewport ??= {} as any
   resolved.browser.viewport.width ??= 414
@@ -544,7 +546,7 @@ export function resolveConfig(
   if (resolved.browser.enabled && stdProvider === 'stackblitz')
     resolved.browser.provider = 'preview'
 
-  resolved.browser.api = resolveApiServerConfig(resolved.browser) || {
+  resolved.browser.api = resolveApiServerConfig(resolved.browser, defaultBrowserPort) || {
     port: defaultBrowserPort,
   }
 
diff --git a/packages/vitest/src/node/plugins/index.ts b/packages/vitest/src/node/plugins/index.ts
@@ -6,6 +6,7 @@ import { deepMerge, notNullish, removeUndefinedValues, toArray } from '../../uti
 import { resolveApiServerConfig } from '../config'
 import { Vitest } from '../core'
 import { generateScopedClassName } from '../../integrations/css/css-modules'
+import { defaultPort } from '../../constants'
 import { SsrReplacerPlugin } from './ssrReplacer'
 import { CSSEnablerPlugin } from './cssEnabler'
 import { CoverageTransform } from './coverageTransform'
@@ -48,7 +49,7 @@ export async function VitestPlugin(options: UserConfig = {}, ctx = new Vitest('t
           removeUndefinedValues(viteConfig.test ?? {}),
           options,
         )
-        testConfig.api = resolveApiServerConfig(testConfig)
+        testConfig.api = resolveApiServerConfig(testConfig, defaultPort)
 
         // store defines for globalThis to make them
         // reassignable when running in worker in src/runtime/setup.ts
@@ -166,7 +167,7 @@ export async function VitestPlugin(options: UserConfig = {}, ctx = new Vitest('t
           viteConfigTest,
           options,
         )
-        options.api = resolveApiServerConfig(options)
+        options.api = resolveApiServerConfig(options, defaultPort)
 
         // we replace every "import.meta.env" with "process.env"
         // to allow reassigning, so we need to put all envs on process.env
