feat: add css config option, don't process CSS by default

docs/config/index.md

@@ -533,3 +533,25 @@ Vitest will not fail, if no tests will be found.
 - **Default**: `false`
 
 Show heap usage after each test. Useful for debugging memory leaks.
+
+### css
+
+- **Type**: `boolen | { include?, exclude? }`
+
+Configure if CSS should be processed. If not, `css` files will be empty.
+
+By default, processes only CSS Modules, because it affects runtime. JSDOM and Happy DOM don't fully support injecting CSS, so disabling this setting might help with performance.
+
+#### css.include
+
+- **Type**: `RegExp | RegExp[]`
+- **Default**: `[/\.module\./]`
+
+RegExp pattern for files that should return actual CSS and will be processed by Vite pipeline.
+
+#### css.exclude
+
+- **Type**: `RegExp | RegExp[]`
+- **Default**: `[]`
+
+RegExp pattern for files that will return en empty CSS file.

packages/vitest/src/defaults.ts

@@ -70,6 +70,9 @@ const config = {
   ui: false,
   uiBase: '/__vitest__/',
   open: true,
+  css: {
+    include: [/\.module\./],
+  },
   coverage: coverageConfigDefaults,
   fakeTimers: fakeTimersDefaults,
 }

packages/vitest/src/node/config.ts

@@ -158,5 +158,9 @@ export function resolveConfig(
   if (resolved.changed)
     resolved.passWithNoTests ??= true
 
+  resolved.css ??= {}
+  if (typeof resolved.css === 'object')
+    resolved.css.include ??= [/\.module\./]
+
   return resolved
 }

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

@@ -0,0 +1,31 @@
+import type { Plugin as VitePlugin } from 'vite'
+import { toArray } from '../../utils'
+import type { Vitest } from '../core'
+
+const isCss = (id: string) => {
+  return /\.(css|styl|less|sass|scss)$/.test(id)
+}
+
+export function CSSEnablerPlugin(ctx: Vitest): VitePlugin {
+  const shouldProcess = (id: string) => {
+    if (!isCss(id))
+      return true
+    const { css } = ctx.config
+    if (typeof css === 'boolean')
+      return css
+    if (toArray(css.exclude).some(re => re.test(id)))
+      return false
+    if (toArray(css.include).some(re => re.test(id)))
+      return true
+    return true
+  }
+
+  return {
+    name: 'vitest:css-enabler',
+    enforce: 'pre',
+    transform(code, id) {
+      if (!shouldProcess(id))
+        return ''
+    },
+  }
+}

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

@@ -7,6 +7,7 @@ import { Vitest } from '../core'
 import { EnvReplacerPlugin } from './envRelacer'
 import { GlobalSetupPlugin } from './globalSetup'
 import { MocksPlugin } from './mock'
+import { CSSEnablerPlugin } from './cssEnabler'
 
 export async function VitestPlugin(options: UserConfig = {}, ctx = new Vitest()): Promise<VitePlugin[]> {
   let haveStarted = false
@@ -138,6 +139,7 @@ export async function VitestPlugin(options: UserConfig = {}, ctx = new Vitest())
     EnvReplacerPlugin(),
     MocksPlugin(),
     GlobalSetupPlugin(ctx),
+    CSSEnablerPlugin(ctx),
     options.ui
       ? await UIPlugin()
       : null,

packages/vitest/src/types/config.ts

@@ -344,6 +344,18 @@ export interface InlineConfig {
    * Return `false` to ignore the log.
    */
   onConsoleLog?: (log: string, type: 'stdout' | 'stderr') => false | void
+
+  /**
+   * Should css be processed. If not, `css` files will be empty.
+   *
+   * If regexp is provided, it will transform matched files.
+   *
+   * @default { include: [/\.module\./] }
+   */
+  css?: boolean | {
+    include?: RegExp | RegExp[]
+    exclude?: RegExp | RegExp[]
+  }
 }
 
 export interface UserConfig extends InlineConfig {