build: ui copying to be part of browser's vite build (#3137)

package.json

@@ -7,7 +7,7 @@
   "description": "A blazing fast unit test framework powered by Vite",
   "scripts": {
     "ci": "ni && nr typecheck && nr lint && nr build && nr test:all",
-    "build": "pnpm -r --filter='./packages/**' run build && pnpm -C ./packages/browser run copy",
+    "build": "pnpm -r --filter='./packages/**' run build",
     "dev": "NODE_OPTIONS=\"--max-old-space-size=8192\" pnpm -r --parallel --filter='./packages/**' run dev",
     "docs": "pnpm -C docs run dev",
     "docs:build": "pnpm -C docs run build",

packages/browser/package.json

@@ -24,28 +24,24 @@
     "stubs"
   ],
   "scripts": {
-    "build": "rimraf dist && pnpm build:node && pnpm build:client && pnpm copy",
+    "build": "rimraf dist && pnpm build:node && pnpm build:client",
     "build:client": "vite build src/client",
     "build:node": "rollup -c",
     "dev:client": "vite build src/client --watch",
     "dev:node": "rollup -c --watch --watch.include src/node/index.ts",
     "dev": "rimraf dist && run-p dev:node dev:client",
-    "copy": "esno scripts/copy-ui-to-browser.ts",
     "prepublishOnly": "pnpm build"
   },
   "peerDependencies": {
     "vitest": ">=0.29.4"
   },
   "dependencies": {
-    "@vitest/runner": "workspace:*",
-    "local-pkg": "^0.4.2",
-    "mlly": "^1.1.0",
     "modern-node-polyfills": "0.1.0",
-    "rollup-plugin-node-polyfills": "^0.2.1",
     "sirv": "^2.0.2"
   },
   "devDependencies": {
     "@types/ws": "^8.5.4",
+    "@vitest/runner": "workspace:*",
     "@vitest/ui": "workspace:*",
     "@vitest/ws-client": "workspace:*",
     "rollup": "^2.79.1",

packages/browser/src/client/vite.config.ts

@@ -1,4 +1,8 @@
+import { fileURLToPath } from 'node:url'
+import fs from 'node:fs'
 import { defineConfig } from 'vite'
+import { resolve } from 'pathe'
+import fg from 'fast-glob'
 
 export default defineConfig({
   server: {
@@ -9,4 +13,46 @@ export default defineConfig({
     outDir: '../../dist/client',
     emptyOutDir: false,
   },
+  plugins: [
+    {
+      name: 'copy-ui-plugin',
+      /* eslint-disable no-console */
+      closeBundle: async () => {
+        const root = resolve(fileURLToPath(import.meta.url), '../../../../../packages')
+
+        const ui = resolve(root, 'ui/dist/client')
+        const browser = resolve(root, 'browser/dist/client/__vitest__/')
+
+        const timeout = setTimeout(() => console.log('[copy-ui-plugin] Waiting for UI to be built...'), 1000)
+        await waitFor(() => fs.existsSync(ui))
+        clearTimeout(timeout)
+
+        const files = fg.sync('**/*', { cwd: ui })
+
+        if (fs.existsSync(browser))
+          fs.rmSync(browser, { recursive: true })
+
+        fs.mkdirSync(browser)
+        fs.mkdirSync(resolve(browser, 'assets'))
+
+        files.forEach((f) => {
+          fs.copyFileSync(resolve(ui, f), resolve(browser, f))
+        })
+
+        console.log('[copy-ui-plugin] UI copied')
+      },
+    },
+  ],
 })
+
+async function waitFor(method: () => boolean, retries = 100): Promise<void> {
+  if (method())
+    return
+
+  if (retries === 0)
+    throw new Error('Timeout in waitFor')
+
+  await new Promise(resolve => setTimeout(resolve, 500))
+
+  return waitFor(method, retries - 1)
+}