fix: e2e tests

Author: alejoamiras

.github/workflows/e2e.yml

@@ -31,6 +31,12 @@ jobs:
           aztec-up 3.0.0-devnet.20251212
           aztec start --local-network &
 
+      - name: Wait for local network to be ready
+        run: |
+          echo "Waiting for Aztec node to be ready..."
+          timeout 300 bash -c 'until curl -s http://localhost:8080/status > /dev/null 2>&1; do sleep 5; echo "Waiting..."; done'
+          echo "Aztec node is ready!"
+
       - name: Install dependencies
         run: yarn install
 
@@ -40,5 +46,30 @@ jobs:
       - name: Build
         run: yarn build
 
-      - name: Run tests
-        run: yarn test
+      - name: Deploy contracts (prep for test)
+        run: PROVER_ENABLED=false yarn deploy-contracts
+
+      - name: Start static server
+        run: |
+          echo "Starting static server..."
+          yarn serve:static &
+          SERVER_PID=$!
+          echo $SERVER_PID > server.pid
+          echo "Server PID: $SERVER_PID"
+          sleep 5
+          echo "Checking server health..."
+          curl -sf http://127.0.0.1:3000 > /dev/null && echo "Server is up!" || (echo "Server failed to start" && exit 1)
+
+      - name: Run Playwright tests
+        run: yarn playwright test --reporter=list
+        env:
+          CI: true
+          FORCE_COLOR: 1
+
+      - name: Stop server
+        if: always()
+        run: |
+          if [ -f server.pid ]; then
+            kill $(cat server.pid) || true
+            rm server.pid
+          fi

app/main.ts

@@ -56,7 +56,7 @@ document.addEventListener('DOMContentLoaded', async () => {
     // Get existing account
     displayStatusMessage('Checking for existing account...');
     const account = await wallet.connectExistingAccount();
-    await displayAccount();
+    displayAccount();
 
     // Refresh tally if account exists
     if (account) {

package.json

@@ -17,6 +17,7 @@
     "build-app": "webpack --mode production",
     "build": "yarn build-contracts && yarn build-app",
     "serve": "webpack serve --mode production --port ${PORT:-3000}",
+    "serve:static": "npx serve app/dist -l ${PORT:-3000}",
     "prep-test": "PROVER_ENABLED=false yarn deploy-contracts && yarn build-app",
     "test": "yarn prep-test && yarn playwright test",
     "lint": "prettier --check ./src"

playwright.config.ts

@@ -33,10 +33,14 @@ export default defineConfig({
     },
   ],
 
-  webServer: {
-    command: 'PORT=3000 yarn serve',
-    url: 'http://127.0.0.1:3000',
-    reuseExistingServer: !process.env.CI,
-    timeout: 30_000,
-  },
+  // In CI, server is started manually in the workflow for better visibility
+  // Locally, Playwright handles starting the dev server
+  webServer: process.env.CI
+    ? undefined
+    : {
+        command: 'PORT=3000 yarn serve',
+        url: 'http://127.0.0.1:3000',
+        reuseExistingServer: true,
+        timeout: 120_000,
+      },
 });

tests/e2e.spec.ts

@@ -6,11 +6,23 @@ const proofTimeout = 250_000;
 test.beforeAll(async () => {
   // Make sure the node is running
   const nodeUrl = process.env.AZTEC_NODE_URL || 'http://localhost:8080';
-  const nodeResp = await fetch(nodeUrl + '/status');
-  if (!nodeResp.ok) {
-    throw new Error(
-      `Failed to connect to node. This test assumes you have a local network running at ${nodeUrl}.`
-    );
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), 30_000); // 30 second timeout
+
+  try {
+    const nodeResp = await fetch(nodeUrl + '/status', { signal: controller.signal });
+    clearTimeout(timeoutId);
+    if (!nodeResp.ok) {
+      throw new Error(
+        `Failed to connect to node. This test assumes you have a local network running at ${nodeUrl}.`
+      );
+    }
+  } catch (error) {
+    clearTimeout(timeoutId);
+    if (error.name === 'AbortError') {
+      throw new Error(`Timeout connecting to node at ${nodeUrl}. Is the local network running?`);
+    }
+    throw error;
   }
 });