WIP

philipp-spiess · philipp-spiess · commit 1cc01ac47990 · 2025-01-30T12:42:13.000+01:00
diff --git a/integrations/vite/solidstart.test.ts b/integrations/vite/solidstart.test.ts
@@ -0,0 +1,108 @@
+import { candidate, css, fetchStyles, js, json, retryAssertion, test, ts } from '../utils'
+
+const WORKSPACE = {
+  'package.json': json`
+    {
+      "type": "module",
+      "dependencies": {
+        "@solidjs/start": "^1",
+        "solid-js": "^1",
+        "vinxi": "^0",
+        "@tailwindcss/vite": "workspace:^",
+        "tailwindcss": "workspace:^"
+      }
+    }
+  `,
+  'jsconfig.json': json`
+    {
+      "compilerOptions": {
+        "jsx": "preserve",
+        "jsxImportSource": "solid-js"
+      }
+    }
+  `,
+  'app.config.js': ts`
+    import { defineConfig } from '@solidjs/start/config'
+    import tailwindcss from '@tailwindcss/vite'
+
+    export default defineConfig({
+      vite: {
+        plugins: [tailwindcss()],
+      },
+    })
+  `,
+  'src/entry-server.jsx': js`
+    // @refresh reload
+    import { createHandler, StartServer } from '@solidjs/start/server'
+
+    export default createHandler(() => (
+      <StartServer
+        document={({ assets, children, scripts }) => (
+          <html lang="en">
+            <head>{assets}</head>
+            <body>
+              <div id="app">{children}</div>
+              {scripts}
+            </body>
+          </html>
+        )}
+      />
+    ))
+  `,
+  'src/entry-client.jsx': js`
+    // @refresh reload
+    import { mount, StartClient } from '@solidjs/start/client'
+
+    mount(() => <StartClient />, document.getElementById('app'))
+  `,
+  'src/app.jsx': js`
+    import './app.css'
+    export default function App() {
+      return <h1 class="underline">Hello world!</h1>
+    }
+  `,
+  'src/app.css': css`@import 'tailwindcss';`,
+}
+
+test(
+  'dev mode',
+  {
+    fs: WORKSPACE,
+  },
+  async ({ fs, spawn, expect }) => {
+    let process = await spawn('pnpm vinxi dev', {
+      env: {
+        TEST: 'false', // VERY IMPORTANT OTHERWISE YOU WON'T GET OUTPUT
+        NODE_ENV: 'development',
+      },
+    })
+
+    let url = ''
+    await process.onStdout((m) => {
+      let match = /Local:\s*(http.*)\//.exec(m)
+      if (match) url = match[1]
+      return Boolean(url)
+    })
+
+    await retryAssertion(async () => {
+      let css = await fetchStyles(url)
+      expect(css).toContain(candidate`underline`)
+    })
+
+    await retryAssertion(async () => {
+      await fs.write(
+        'src/app.jsx',
+        js`
+          import './app.css'
+          export default function App() {
+            return <h1 class="underline font-bold">Hello world!</h1>
+          }
+        `,
+      )
+
+      let css = await fetchStyles(url)
+      expect(css).toContain(candidate`underline`)
+      expect(css).toContain(candidate`font-bold`)
+    })
+  },
+)
diff --git a/packages/@tailwindcss-vite/src/index.ts b/packages/@tailwindcss-vite/src/index.ts
@@ -88,21 +88,15 @@ export default function tailwindcss(): Plugin[] {
   }
 
   function invalidateAllRoots(isSSR: boolean) {
-    for (let server of servers) {
-      let updates: Update[] = []
-      for (let [id, root] of roots.entries()) {
+    for (let [id] of roots.entries()) {
+      let foundRoot = false
+
+      for (let server of servers) {
+        let updates: Update[] = []
         let module = server.moduleGraph.getModuleById(id)
-        if (!module) {
-          // Note: Removing this during SSR is not safe and will produce
-          // inconsistent results based on the timing of the removal and
-          // the order / timing of transforms.
-          if (!isSSR) {
-            // It is safe to remove the item here since we're iterating on a copy
-            // of the keys.
-            roots.delete(id)
-          }
-          continue
-        }
+        if (!module) continue
+
+        foundRoot = true
 
         roots.get(id).requiresRebuild = false
         server.moduleGraph.invalidateModule(module)
@@ -112,10 +106,21 @@ export default function tailwindcss(): Plugin[] {
           acceptedPath: module.url,
           timestamp: Date.now(),
         })
+
+        if (updates.length > 0) {
+          server.hot.send({ type: 'update', updates })
+        }
       }
 
-      if (updates.length > 0) {
-        server.hot.send({ type: 'update', updates })
+      if (!foundRoot && !isSSR) {
+        // Note: Removing this during SSR is not safe and will produce
+        // inconsistent results based on the timing of the removal and
+        // the order / timing of transforms.
+        if (!isSSR) {
+          // It is safe to remove the item here since we're iterating on a copy
+          // of the keys.
+          roots.delete(id)
+        }
       }
     }
   }
@@ -210,6 +215,7 @@ export default function tailwindcss(): Plugin[] {
 
       // Scan all non-CSS files for candidates
       transformIndexHtml(html, { path }) {
+        if (!path) return
         scanFile(path, html, 'html', isSSR)
       },
       transform(src, id, options) {
