Enable Vite's waitForRequestsIdle() for client requests only (#13394)

* Enable `waitForRequestsIdle` but only when not doing SSR

* Cleanup comment

* Update changelog

CHANGELOG.md

@@ -7,7 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
-- Nothing yet!
+### Fixed
+
+- Enable Vite's `waitForRequestsIdle()` for client requests only ([#13394](https://github.com/tailwindlabs/tailwindcss/pull/13394))
 
 ## [4.0.0-alpha.11] - 2024-03-27
 

packages/@tailwindcss-vite/src/index.ts

@@ -159,19 +159,18 @@ export default function tailwindcss(): Plugin[] {
       name: '@tailwindcss/vite:generate:serve',
       apply: 'serve',
 
-      async transform(src, id) {
+      async transform(src, id, options) {
         if (!isTailwindCssFile(id, src)) return
 
         // In serve mode, we treat cssModules as a set, ignoring the value.
         cssModules[id] = ''
 
-        // TODO: Re-enable waitForRequestsIdle once issues with it hanging are
-        // fixed. Until then, this transformation may run multiple times in
-        // serve mode, possibly giving a FOUC.
-        //
-        // Wait until all other files have been processed, so we can extract all
-        // candidates before generating CSS.
-        // await server?.waitForRequestsIdle?.(id)
+        if (!options?.ssr) {
+          // Wait until all other files have been processed, so we can extract
+          // all candidates before generating CSS. This must not be called
+          // during SSR or it will block the server.
+          await server?.waitForRequestsIdle?.(id)
+        }
 
         let code = await transformWithPlugins(this, id, generateCss(src))
         return { code }