fix(vitest): don't start the server when optimizer is enabled (#4095)

Author: sheremet-va

packages/vitest/src/integrations/browser/server.ts

@@ -36,6 +36,9 @@ export async function createBrowserServer(project: WorkspaceProject, configFile:
             port: defaultBrowserPort,
           }
 
+          // browser never runs in middleware mode
+          server.middlewareMode = false
+
           config.server = server
           config.server.fs ??= {}
           config.server.fs.allow = config.server.fs.allow || []

packages/vitest/src/node/config.ts

@@ -49,9 +49,12 @@ export function resolveApiServerConfig<Options extends ApiConfig & UserConfig>(
   }
 
   if (api) {
-    if (!api.port)
+    if (!api.port && !api.middlewareMode)
       api.port = defaultPort
   }
+  else {
+    api = { middlewareMode: true }
+  }
 
   return api
 }

packages/vitest/src/node/create.ts

@@ -1,11 +1,12 @@
 import { resolve } from 'pathe'
-import { createServer, mergeConfig } from 'vite'
+import { mergeConfig } from 'vite'
 import type { InlineConfig as ViteInlineConfig, UserConfig as ViteUserConfig } from 'vite'
 import { findUp } from 'find-up'
 import type { UserConfig, VitestRunMode } from '../types'
 import { configFiles } from '../constants'
 import { Vitest } from './core'
 import { VitestPlugin } from './plugins'
+import { createViteServer } from './vite'
 
 export async function createVitest(mode: VitestRunMode, options: UserConfig, viteOverrides: ViteUserConfig = {}) {
   const ctx = new Vitest(mode)
@@ -27,13 +28,10 @@ export async function createVitest(mode: VitestRunMode, options: UserConfig, vit
     plugins: await VitestPlugin(options, ctx),
   }
 
-  const server = await createServer(mergeConfig(config, mergeConfig(viteOverrides, { root: options.root })))
+  const server = await createViteServer(mergeConfig(config, mergeConfig(viteOverrides, { root: options.root })))
 
-  // optimizer needs .listen() to be called
-  if (ctx.config.api?.port || ctx.config.deps?.optimizer?.web?.enabled || ctx.config.deps?.optimizer?.ssr?.enabled)
+  if (ctx.config.api?.port)
     await server.listen()
-  else
-    await server.pluginContainer.buildStart({})
 
   return ctx
 }

packages/vitest/src/node/logger.ts

@@ -139,7 +139,7 @@ export class Logger {
 
     if (this.ctx.config.ui)
       this.log(c.dim(c.green(`      UI started at http://${this.ctx.config.api?.host || 'localhost'}:${c.bold(`${this.ctx.server.config.server.port}`)}${this.ctx.config.uiBase}`)))
-    else if (this.ctx.config.api)
+    else if (this.ctx.config.api?.port)
       this.log(c.dim(c.green(`      API started at http://${this.ctx.config.api?.host || 'localhost'}:${c.bold(`${this.ctx.config.api.port}`)}`)))
 
     if (this.ctx.coverageProvider)

packages/vitest/src/node/plugins/index.ts

@@ -57,7 +57,7 @@ export async function VitestPlugin(options: UserConfig = {}, ctx = new Vitest('t
 
         ;(options as ResolvedConfig).defines = defines
 
-        let open: string | boolean | undefined
+        let open: string | boolean | undefined = false
 
         if (testConfig.ui && testConfig.open)
           open = testConfig.uiBase ?? '/__vitest__/'

packages/vitest/src/node/plugins/workspace.ts

@@ -70,6 +70,7 @@ export function WorkspaceVitestPlugin(project: WorkspaceProject, options: Worksp
             open: false,
             hmr: false,
             preTransformRequests: false,
+            middlewareMode: true,
             fs: {
               allow: resolveFsAllow(
                 project.ctx.config.root,

packages/vitest/src/node/vite.ts

@@ -0,0 +1,21 @@
+import type { InlineConfig } from 'vite'
+import { createServer } from 'vite'
+
+export async function createViteServer(inlineConfig: InlineConfig) {
+  // Vite prints an error (https://github.com/vitejs/vite/issues/14328)
+  // But Vitest works correctly either way
+  const error = console.error
+  console.error = (...args: any[]) => {
+    if (typeof args[0] === 'string' && args[0].includes('WebSocket server error:'))
+      return
+    error(...args)
+  }
+
+  const server = await createServer({
+    logLevel: 'error',
+    ...inlineConfig,
+  })
+
+  console.error = error
+  return server
+}

packages/vitest/src/node/workspace.ts

@@ -2,7 +2,6 @@ import { promises as fs } from 'node:fs'
 import fg from 'fast-glob'
 import mm from 'micromatch'
 import { dirname, relative, resolve, toNamespacedPath } from 'pathe'
-import { createServer } from 'vite'
 import type { ViteDevServer, InlineConfig as ViteInlineConfig } from 'vite'
 import { ViteNodeRunner } from 'vite-node/client'
 import { ViteNodeServer } from 'vite-node/server'
@@ -14,6 +13,7 @@ import type { BrowserProvider } from '../types/browser'
 import { getBrowserProvider } from '../integrations/browser'
 import { isBrowserEnabled, resolveConfig } from './config'
 import { WorkspaceVitestPlugin } from './plugins/workspace'
+import { createViteServer } from './vite'
 
 interface InitializeProjectOptions extends UserWorkspaceConfig {
   workspaceConfigPath: string
@@ -44,13 +44,7 @@ export async function initializeProject(workspacePath: string | number, ctx: Vit
     ],
   }
 
-  const server = await createServer(config)
-
-  // optimizer needs .listen() to be called
-  if (ctx.config.api?.port || project.config.deps?.optimizer?.web?.enabled || project.config.deps?.optimizer?.ssr?.enabled)
-    await server.listen()
-  else
-    await server.pluginContainer.buildStart({})
+  await createViteServer(config)
 
   return project
 }

packages/vitest/src/types/config.ts

@@ -1,4 +1,4 @@
-import type { AliasOptions, CommonServerOptions, DepOptimizationConfig } from 'vite'
+import type { AliasOptions, DepOptimizationConfig, ServerOptions } from 'vite'
 import type { PrettyFormatOptions } from 'pretty-format'
 import type { FakeTimerInstallOpts } from '@sinonjs/fake-timers'
 import type { SequenceHooks, SequenceSetupFiles } from '@vitest/runner'
@@ -23,7 +23,7 @@ export type VitestEnvironment = BuiltinEnvironment | (string & Record<never, nev
 export type VitestPool = 'browser' | 'threads' | 'child_process' | 'experimentalVmThreads'
 export type CSSModuleScopeStrategy = 'stable' | 'scoped' | 'non-scoped'
 
-export type ApiConfig = Pick<CommonServerOptions, 'port' | 'strictPort' | 'host'>
+export type ApiConfig = Pick<ServerOptions, 'port' | 'strictPort' | 'host' | 'middlewareMode'>
 
 export type { JSDOMOptions, HappyDOMOptions }
 

test/core/package.json

@@ -3,6 +3,7 @@
   "private": true,
   "scripts": {
     "test": "vitest",
+    "dev": "vite",
     "coverage": "vitest run --coverage"
   },
   "devDependencies": {