fix: wait for watch hmr baseline outputs

Author: sonofmagic

packages/weapp-tailwindcss/test/watch-hmr-class-baseline.unit.test.ts

@@ -0,0 +1,79 @@
+import { mkdtemp, rm, writeFile } from 'node:fs/promises'
+import os from 'node:os'
+import path from 'node:path'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { waitForClassMutationBaselineOutputs } from '../../../tools/weapp-tailwindcss-scripts/src/watch-hmr-regression/mutations/class'
+import type {
+  CliOptions,
+  WatchCase,
+  WatchSession,
+} from '../../../tools/weapp-tailwindcss-scripts/src/watch-hmr-regression/types'
+
+function createOptions(): CliOptions {
+  return {
+    caseName: 'all',
+    timeoutMs: 1000,
+    pollMs: 10,
+    skipBuild: true,
+    quietSass: true,
+  }
+}
+
+describe('watch-hmr class baseline', () => {
+  let tempDir = ''
+
+  afterEach(async () => {
+    if (tempDir) {
+      await rm(tempDir, { recursive: true, force: true })
+    }
+  })
+
+  it('waits for temporarily empty baseline outputs before mutating content', async () => {
+    tempDir = await mkdtemp(path.join(os.tmpdir(), 'weapp-tw-class-baseline-'))
+    const outputWxml = path.join(tempDir, 'index.wxml')
+    const outputJs = path.join(tempDir, 'index.js')
+    const outputStyle = path.join(tempDir, 'app.wxss')
+
+    await Promise.all([
+      writeFile(outputWxml, '', 'utf8'),
+      writeFile(outputJs, '', 'utf8'),
+      writeFile(outputStyle, '.ready{}', 'utf8'),
+    ])
+
+    const session: WatchSession = {
+      child: {} as WatchSession['child'],
+      ensureRunning: vi.fn(),
+      lastCompileSuccessAt: vi.fn(() => 0),
+      logs: vi.fn(() => ''),
+      stop: vi.fn(async () => {}),
+    }
+    const watchCase = {
+      label: 'demo/uni-app-vite-tailwindcss-v3',
+      outputWxml,
+      outputJs,
+    } as WatchCase
+
+    const refillOutputs = async () => {
+      await Promise.all([
+        writeFile(outputWxml, '<view class="ready"></view>', 'utf8'),
+        writeFile(outputJs, 'export default {}', 'utf8'),
+      ])
+    }
+    setTimeout(() => {
+      void refillOutputs()
+    }, 30)
+
+    const outputs = await waitForClassMutationBaselineOutputs(
+      watchCase,
+      createOptions(),
+      session,
+      'content',
+      [outputStyle],
+    )
+
+    expect(outputs.wxml).toContain('ready')
+    expect(outputs.js).toContain('export default')
+    expect(outputs.globalStyle).toContain('.ready')
+    expect(session.ensureRunning).toHaveBeenCalled()
+  })
+})

tools/weapp-tailwindcss-scripts/src/watch-hmr-regression/mutations/class.ts

@@ -59,6 +59,58 @@ interface RoundOutputs {
   globalStyle: string
 }
 
+export async function waitForClassMutationBaselineOutputs(
+  watchCase: WatchCase,
+  options: CliOptions,
+  session: WatchSession,
+  mutationKind: 'template' | 'script' | 'content',
+  globalStyleOutputs: string[],
+): Promise<RoundOutputs> {
+  let resolvedOutputs: RoundOutputs | undefined
+  let lastReason = 'outputs are not ready'
+  const waitStartedAt = Date.now()
+
+  await waitFor(
+    async () => {
+      const [wxml, js, globalStyle, hasGlobalStyleOutputs] = await Promise.all([
+        readFileIfExists(watchCase.outputWxml),
+        readFileIfExists(watchCase.outputJs),
+        readJoinedOutputFiles(globalStyleOutputs),
+        hasResolvedOutputFiles(globalStyleOutputs),
+      ])
+
+      if (wxml && js && hasGlobalStyleOutputs) {
+        resolvedOutputs = {
+          wxml,
+          js,
+          globalStyle,
+        }
+        return true
+      }
+
+      lastReason = [
+        wxml ? undefined : 'wxml',
+        js ? undefined : 'js',
+        hasGlobalStyleOutputs ? undefined : 'global style',
+      ].filter(Boolean).join(', ')
+      return false
+    },
+    {
+      timeoutMs: options.timeoutMs,
+      pollMs: options.pollMs,
+      message: `[${watchCase.label}] baseline outputs are missing for ${mutationKind}: ${lastReason}`,
+      onTick: session.ensureRunning,
+    },
+    waitStartedAt,
+  )
+
+  if (!resolvedOutputs) {
+    throw new Error(`[${watchCase.label}] baseline outputs failed to resolve for ${mutationKind}`)
+  }
+
+  return resolvedOutputs
+}
+
 function collectBgHexTruncationNeedles(classTokens: string[]) {
   const needles: string[] = []
   for (const token of classTokens) {
@@ -401,15 +453,17 @@ export async function runClassMutation(
     ? [watchCase.outputWxml, watchCase.outputJs, ...globalStyleOutputs]
     : [watchCase.outputWxml, watchCase.outputJs]
 
-  const [baselineWxml, baselineJs, baselineGlobalStyle] = await Promise.all([
-    readFileIfExists(watchCase.outputWxml),
-    readFileIfExists(watchCase.outputJs),
-    readJoinedOutputFiles(globalStyleOutputs),
-  ])
-
-  if (!baselineWxml || !baselineJs || !await hasResolvedOutputFiles(globalStyleOutputs)) {
-    throw new Error(`[${watchCase.label}] baseline outputs are missing for ${mutationKind}`)
-  }
+  const {
+    wxml: baselineWxml,
+    js: baselineJs,
+    globalStyle: baselineGlobalStyle,
+  } = await waitForClassMutationBaselineOutputs(
+    watchCase,
+    options,
+    session,
+    mutationKind,
+    globalStyleOutputs,
+  )
 
   const verifyClassLiteralIn = mutation.verifyClassLiteralIn ?? []
   const forbidBgHexTruncationIn = mutation.forbidBgHexTruncationIn ?? []