fix: don't mock css-module if inline is specified

As per the vite docs here: https://vitejs.dev/guide/features.html#disabling-css-injection-into-the-page

Using the 'inline' query parameter for CSS has different semantics than regular css imports and the expected return value should be a string as the default export.

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

@@ -16,6 +16,17 @@ function isCSSModule(id: string) {
   return cssModuleRE.test(id)
 }
 
+// inline css requests are expected to just return the
+// string content directly and not the proxy module
+function isInline(id: string) {
+  const queryStart = id.indexOf('?');
+  if (queryStart === -1) {
+    return false;
+  }
+  const queryParts = id.substring(queryStart + 1).split('&');
+  return queryParts.some(part => part === 'inline');
+}
+
 function getCSSModuleProxyReturn(strategy: CSSModuleScopeStrategy, filename: string) {
   if (strategy === 'non-scoped')
     return 'style'
@@ -55,7 +66,7 @@ export function CSSEnablerPlugin(ctx: { config: ResolvedConfig }): VitePlugin[]
         if (!isCSS(id) || shouldProcessCSS(id))
           return
 
-        if (isCSSModule(id)) {
+        if (isCSSModule(id) && !isInline(id)) {
           // return proxy for css modules, so that imported module has names:
           // styles.foo returns a "foo" instead of "undefined"
           // we don't use code content to generate hash for "scoped", because it's empty

test/css/test/process-inline.spec.ts

@@ -0,0 +1,21 @@
+import { describe, expect, test } from 'vitest'
+import { useRemoveStyles } from './utils'
+
+describe('processing inline css', () => {
+  useRemoveStyles()
+
+  test('doesn\'t apply css', async () => {
+    await import('../src/App.module.css?inline')
+
+    const element = document.createElement('div')
+    element.className = 'main'
+    const computed = window.getComputedStyle(element)
+    expect(computed.display, 'css is not processed').toBe('block')
+  })
+
+  test('returns a string', async () => {
+    const { default: style } = await import('../src/App.module.css?inline')
+    expect(typeof style).toBe('string');
+    console.log(style);
+  })
+})

test/css/testing.mjs

@@ -4,6 +4,7 @@ const configs = [
   ['test/default-css', {}],
   ['test/process-css', { include: [/App\.css/] }],
   ['test/process-module', { include: [/App\.module\.css/] }],
+  ['test/process-inline', { include: [/App\.module\.css/] }],
   ['test/scope-module', { include: [/App\.module\.css/], modules: { classNameStrategy: 'scoped' } }],
   ['test/non-scope-module', { include: [/App\.module\.css/], modules: { classNameStrategy: 'non-scoped' } }],
 ]