chore: install deps after startup script changes

Author: ScriptedAlchemy

federated-css-react-ssr/scripts/start-exposes.cjs

@@ -16,10 +16,11 @@ async function main() {
   const pServe = run('pnpm', ['--filter', '"federated-css-react-ssr_expose-*"', '-r', 'run', 'serve']);
   process.on('SIGINT', () => pServe.kill('SIGINT'));
   process.on('SIGTERM', () => pServe.kill('SIGTERM'));
+  // keep process alive
+  await new Promise(() => {});
 }
 
 main().catch(err => {
   console.error(err);
   process.exit(1);
 });
-

federated-css-react-ssr/scripts/start-shells.cjs

@@ -31,10 +31,11 @@ async function main() {
 
   process.on('SIGINT', () => pServe.kill('SIGINT'));
   process.on('SIGTERM', () => pServe.kill('SIGTERM'));
+  // keep process alive
+  await new Promise(() => {});
 }
 
 main().catch(err => {
   console.error(err);
   process.exit(1);
 });
-

federated-css/package.json

@@ -26,6 +26,7 @@
     "e2e:headed": "playwright test --headed"
   },
   "devDependencies": {
-    "@playwright/test": "^1.54.2"
+    "@playwright/test": "^1.54.2",
+    "wait-on": "7.2.0"
   }
 }

federated-css/playwright.config.ts

@@ -8,6 +8,7 @@ export default defineConfig({
   expect: {
     timeout: 15_000,
   },
+  workers: process.env.CI ? 1 : undefined,
   fullyParallel: true,
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 1 : 0,
@@ -31,20 +32,12 @@ export default defineConfig({
   ],
   webServer: [
     {
-      // Exposes must serve static bundles on fixed 400x ports to match remotes in consumers
-      command: 'pnpm --filter "federated-css-mono_expose-*" --parallel serve',
-      cwd: __dirname,
-      port: 4000,
-      reuseExistingServer: reuseExisting,
-      timeout: 240_000,
-    },
-    {
-      // Next.js consumers listen on 8081-8084; wait for the first to be ready
-      command: 'pnpm --filter "@federated-css/*" --parallel start',
+      // Build/serve exposes and consumers-react; start next consumers; wait for all ports
+      command: 'node scripts/start-all.cjs',
       cwd: __dirname,
       port: 8081,
       reuseExistingServer: reuseExisting,
-      timeout: 240_000,
+      timeout: 300_000,
     },
   ],
 });

federated-css/scripts/start-all.cjs

@@ -0,0 +1,49 @@
+const { spawn } = require('node:child_process');
+const waitOn = require('wait-on');
+const path = require('node:path');
+
+const root = path.resolve(__dirname, '..');
+
+function run(cmd, args) {
+  return spawn(cmd, args, { stdio: 'inherit', cwd: root, shell: true });
+}
+
+async function main() {
+  // Build consumers-react and exposes, then serve both groups; start Next consumers (dev)
+  await new Promise((res, rej) => {
+    const p = run('pnpm', ['--filter', '"@federated-css/*"', '-r', 'run', 'build']);
+    p.on('exit', c => (c === 0 ? res() : rej(new Error('build consumers failed'))));
+  });
+  await new Promise((res, rej) => {
+    const p = run('pnpm', ['--filter', '"federated-css-mono_expose-*"', '-r', 'run', 'build']);
+    p.on('exit', c => (c === 0 ? res() : rej(new Error('build exposes failed'))));
+  });
+
+  const pReact = run('pnpm', ['--filter', '"@federated-css/*"', '-r', 'run', 'serve']);
+  const pExposes = run('pnpm', ['--filter', '"federated-css-mono_expose-*"', '-r', 'run', 'serve']);
+  const pNext = run('pnpm', ['--filter', '"@federated-css/next-*"', '-r', 'run', 'start']);
+
+  await waitOn({
+    resources: [
+      // consumers-react ports
+      'http://localhost:3001', 'http://localhost:3002', 'http://localhost:3003',
+      'http://localhost:3004', 'http://localhost:3005', 'http://localhost:3006', 'http://localhost:3007',
+      // exposes ports
+      'http://localhost:4000', 'http://localhost:4001', 'http://localhost:4002', 'http://localhost:4003',
+      'http://localhost:4004', 'http://localhost:4005', 'http://localhost:4006', 'http://localhost:4007',
+      // next consumers
+      'http://localhost:8081', 'http://localhost:8082', 'http://localhost:8083', 'http://localhost:8084'
+    ],
+    timeout: 300000,
+    validateStatus: s => s >= 200 && s < 500,
+  });
+
+  const killAll = sig => { pReact.kill(sig); pExposes.kill(sig); pNext.kill(sig); };
+  process.on('SIGINT', () => killAll('SIGINT'));
+  process.on('SIGTERM', () => killAll('SIGTERM'));
+
+  await new Promise(() => {});
+}
+
+main().catch(err => { console.error(err); process.exit(1); });
+

pnpm-lock.yaml

@@ -12,11 +12,11 @@ export default defineConfig({
     video: 'retain-on-failure',
   },
   webServer: {
-    command: 'pnpm start',
+    command: 'node scripts/start-all.cjs',
     cwd: __dirname,
     port: 3001,
     reuseExistingServer: !process.env.CI,
-    timeout: 240_000,
+    timeout: 300_000,
   },
   projects: [
     {

vue2-in-vue3/playwright.config.ts

@@ -0,0 +1,24 @@
+const { spawn } = require('node:child_process');
+const waitOn = require('wait-on');
+const path = require('node:path');
+
+const root = path.resolve(__dirname, '..');
+
+function run(cmd, args) {
+  return spawn(cmd, args, { stdio: 'inherit', cwd: root, shell: true });
+}
+
+async function main() {
+  await new Promise((res, rej) => {
+    const p = run('pnpm', ['--filter', '"vue2-in-vue3_vue*"', '-r', 'run', 'build']);
+    p.on('exit', c => (c === 0 ? res() : rej(new Error('build failed'))));
+  });
+  const pServe = run('pnpm', ['--filter', '"vue2-in-vue3_vue*"', '-r', 'run', 'serve']);
+  await waitOn({ resources: ['http://localhost:3001', 'http://localhost:3002'], timeout: 180000 });
+  process.on('SIGINT', () => pServe.kill('SIGINT'));
+  process.on('SIGTERM', () => pServe.kill('SIGTERM'));
+  await new Promise(() => {});
+}
+
+main().catch(err => { console.error(err); process.exit(1); });
+