fix: remove networkidle waits and timeout bumps that regressed #248 speed

PR #248 specifically removed networkidle waits and kept tight timeouts
for speed in an SPA where they're unnecessary. This commit removes the
networkidle and timeout increases added in the previous commit while
keeping the actual flakiness fixes:

Kept:
- Deterministic seed data script (tools/seed-test-data.js)
- Retry logic (1 retry per test)
- Fresh navigation for groupByHash test
- Compare page explicit waitForFunction/waitForSelector waits
- Observers page waitForFunction for table rows

Reverted:
- Default timeout 10s→15s (back to 10s)
- All added networkidle waits (6 instances)
- Map marker timeout 3s→8s (back to 3s)
- Node detail timeout bumps
- Nodes page timeout bumps

Principle: fix flakiness with deterministic data and targeted waits,
not with slower timeouts and networkidle.

.github/workflows/deploy.yml

@@ -10,20 +10,11 @@ on:
       - 'docs/**'
   pull_request:
     branches: [master]
-    paths-ignore:
-      - '**.md'
-      - 'LICENSE'
-      - '.gitignore'
-      - 'docs/**'
 
 concurrency:
   group: deploy-${{ github.event.pull_request.number || github.ref }}
   cancel-in-progress: true
 
-defaults:
-  run:
-    shell: bash
-
 env:
   FORCE_JAVASCRIPT_ACTIONS_TO_NODE24: true
 
@@ -46,8 +37,23 @@ jobs:
     steps:
       - name: Checkout code
         uses: actions/checkout@v5
+        with:
+          fetch-depth: 0
+
+      - name: Skip if docs-only change
+        id: docs-check
+        run: |
+          if [ "${{ github.event_name }}" = "pull_request" ]; then
+            CHANGED=$(git diff --name-only origin/${{ github.base_ref }}...HEAD)
+            NON_DOCS=$(echo "$CHANGED" | grep -cvE '\.(md)$|^LICENSE$|^\.gitignore$|^docs/' || true)
+            if [ "$NON_DOCS" -eq 0 ]; then
+              echo "docs_only=true" >> $GITHUB_OUTPUT
+              echo "📄 Docs-only PR — skipping heavy CI"
+            fi
+          fi
 
       - name: Set up Go 1.22
+        if: steps.docs-check.outputs.docs_only != 'true'
         uses: actions/setup-go@v6
         with:
           go-version: '1.22'
@@ -56,6 +62,7 @@ jobs:
             cmd/ingestor/go.sum
 
       - name: Build and test Go server (with coverage)
+        if: steps.docs-check.outputs.docs_only != 'true'
         run: |
           set -e -o pipefail
           cd cmd/server
@@ -65,6 +72,7 @@ jobs:
           go tool cover -func=server-coverage.out | tail -1
 
       - name: Build and test Go ingestor (with coverage)
+        if: steps.docs-check.outputs.docs_only != 'true'
         run: |
           set -e -o pipefail
           cd cmd/ingestor
@@ -74,6 +82,7 @@ jobs:
           go tool cover -func=ingestor-coverage.out | tail -1
 
       - name: Verify proto syntax (all .proto files compile)
+        if: steps.docs-check.outputs.docs_only != 'true'
         run: |
           set -e
           echo "Installing protoc..."
@@ -88,7 +97,7 @@ jobs:
           echo "✅ All .proto files are syntactically valid"
 
       - name: Generate Go coverage badges
-        if: always()
+        if: always() && steps.docs-check.outputs.docs_only != 'true'
         run: |
           mkdir -p .badges
 
@@ -148,21 +157,39 @@ jobs:
   node-test:
     name: "🧪 Node.js Tests"
     runs-on: [self-hosted, Linux]
+    defaults:
+      run:
+        shell: bash
     steps:
       - name: Checkout code
         uses: actions/checkout@v5
         with:
-          fetch-depth: 2
+          fetch-depth: 0
+
+      - name: Skip if docs-only change
+        id: docs-check
+        run: |
+          if [ "${{ github.event_name }}" = "pull_request" ]; then
+            CHANGED=$(git diff --name-only origin/${{ github.base_ref }}...HEAD)
+            NON_DOCS=$(echo "$CHANGED" | grep -cvE '\.(md)$|^LICENSE$|^\.gitignore$|^docs/' || true)
+            if [ "$NON_DOCS" -eq 0 ]; then
+              echo "docs_only=true" >> $GITHUB_OUTPUT
+              echo "📄 Docs-only PR — skipping heavy CI"
+            fi
+          fi
 
       - name: Set up Node.js 22
+        if: steps.docs-check.outputs.docs_only != 'true'
         uses: actions/setup-node@v5
         with:
           node-version: '22'
 
       - name: Install npm dependencies
+        if: steps.docs-check.outputs.docs_only != 'true'
         run: npm ci --production=false
 
       - name: Detect changed files
+        if: steps.docs-check.outputs.docs_only != 'true'
         id: changes
         run: |
           BACKEND=$(git diff --name-only HEAD~1 | grep -cE '^(server|db|decoder|packet-store|server-helpers|iata-coords)\.js$' || true)
@@ -178,7 +205,7 @@ jobs:
           echo "Changes: backend=$BACKEND frontend=$FRONTEND tests=$TESTS ci=$CI"
 
       - name: Run backend tests with coverage
-        if: steps.changes.outputs.backend == 'true'
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.backend == 'true'
         run: |
           npx c8 --reporter=text-summary --reporter=text sh test-all.sh 2>&1 | tee test-output.txt
           
@@ -196,19 +223,23 @@ jobs:
           echo "## Backend: ${TOTAL_PASS} tests, ${BE_COVERAGE}% coverage" >> $GITHUB_STEP_SUMMARY
 
       - name: Run backend tests (quick, no coverage)
-        if: steps.changes.outputs.backend == 'false'
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.backend == 'false'
         run: npm run test:unit
 
       - name: Install Playwright browser
-        if: steps.changes.outputs.frontend == 'true'
-        run: npx playwright install chromium --with-deps 2>/dev/null || true
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
+        run: |
+          # Install chromium (skips download if already cached on self-hosted runner)
+          npx playwright install chromium 2>/dev/null || true
+          # Install system deps only if missing (apt-get is slow)
+          npx playwright install-deps chromium 2>/dev/null || true
 
       - name: Instrument frontend JS for coverage
-        if: steps.changes.outputs.frontend == 'true'
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
         run: sh scripts/instrument-frontend.sh
 
       - name: Start instrumented test server on port 13581
-        if: steps.changes.outputs.frontend == 'true'
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
         run: |
           # Kill any stale server on 13581
           fuser -k 13581/tcp 2>/dev/null || true
@@ -231,19 +262,36 @@ jobs:
             sleep 1
           done
 
-      - name: Run Playwright E2E tests
-        if: steps.changes.outputs.frontend == 'true'
-        run: BASE_URL=http://localhost:13581 node test-e2e-playwright.js 2>&1 | tee e2e-output.txt
+      - name: Seed test data for Playwright
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
+        run: BASE_URL=http://localhost:13581 node tools/seed-test-data.js
 
-      - name: Collect frontend coverage report
-        if: always() && steps.changes.outputs.frontend == 'true'
+      - name: Run Playwright E2E + coverage collection concurrently
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
+        run: |
+          # Run E2E tests and coverage collection in parallel — both use the same server
+          BASE_URL=http://localhost:13581 node test-e2e-playwright.js 2>&1 | tee e2e-output.txt &
+          E2E_PID=$!
+          BASE_URL=http://localhost:13581 node scripts/collect-frontend-coverage.js 2>&1 | tee fe-coverage-output.txt &
+          COV_PID=$!
+
+          # Wait for both — E2E must pass, coverage is best-effort
+          E2E_EXIT=0
+          wait $E2E_PID || E2E_EXIT=$?
+          wait $COV_PID || true
+
+          # Fail if E2E failed
+          [ $E2E_EXIT -ne 0 ] && exit $E2E_EXIT
+          true
+
+      - name: Generate frontend coverage badges
+        if: always() && steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
         run: |
-          BASE_URL=http://localhost:13581 node scripts/collect-frontend-coverage.js 2>&1 | tee fe-coverage-output.txt
-          
           E2E_PASS=$(grep -oP '[0-9]+(?=/)' e2e-output.txt | tail -1)
           
           mkdir -p .badges
-          if [ -f .nyc_output/frontend-coverage.json ]; then
+          # Merge E2E + coverage collector data if both exist
+          if [ -f .nyc_output/frontend-coverage.json ] || [ -f .nyc_output/e2e-coverage.json ]; then
             npx nyc report --reporter=text-summary --reporter=text 2>&1 | tee fe-report.txt
             FE_COVERAGE=$(grep 'Statements' fe-report.txt | head -1 | grep -oP '[\d.]+(?=%)' || echo "0")
             FE_COVERAGE=${FE_COVERAGE:-0}
@@ -256,7 +304,7 @@ jobs:
           echo "{\"schemaVersion\":1,\"label\":\"frontend tests\",\"message\":\"${E2E_PASS:-0} E2E passed\",\"color\":\"brightgreen\"}" > .badges/frontend-tests.json
 
       - name: Stop test server
-        if: always() && steps.changes.outputs.frontend == 'true'
+        if: always() && steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'true'
         run: |
           if [ -f .server.pid ]; then
             kill $(cat .server.pid) 2>/dev/null || true
@@ -265,12 +313,17 @@ jobs:
           fi
 
       - name: Run frontend E2E (quick, no coverage)
-        if: steps.changes.outputs.frontend == 'false'
+        if: steps.docs-check.outputs.docs_only != 'true' && steps.changes.outputs.frontend == 'false'
         run: |
           fuser -k 13581/tcp 2>/dev/null || true
           PORT=13581 node server.js &
           SERVER_PID=$!
-          sleep 5
+          # Wait for server to be ready (up to 15s)
+          for i in $(seq 1 15); do
+            curl -sf http://localhost:13581/api/stats > /dev/null 2>&1 && break
+            sleep 1
+          done
+          BASE_URL=http://localhost:13581 node tools/seed-test-data.js || true
           BASE_URL=http://localhost:13581 node test-e2e-playwright.js || true
           kill $SERVER_PID 2>/dev/null || true
 

README.md

@@ -8,7 +8,7 @@
 
 > High-performance mesh network analyzer powered by Go. Sub-millisecond packet queries, ~300 MB memory for 56K+ packets, real-time WebSocket broadcast, full channel decryption.
 
-Self-hosted, open-source MeshCore packet analyzer — a community alternative to the closed-source `analyzer.letsmesh.net`. Collects MeshCore packets via MQTT, decodes them in real time, and presents a full web UI with live packet feed, interactive maps, channel chat, packet tracing, and per-node analytics.
+Self-hosted, open-source MeshCore packet analyzer. Collects MeshCore packets via MQTT, decodes them in real time, and presents a full web UI with live packet feed, interactive maps, channel chat, packet tracing, and per-node analytics.
 
 ## ⚡ Performance
 

scripts/collect-frontend-coverage.js

@@ -64,9 +64,9 @@ async function collectCoverage() {
   // ══════════════════════════════════════════════
   console.log('  [coverage] Home page — chooser...');
   // Clear localStorage to get chooser
-  await page.goto(BASE, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(BASE, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   await page.evaluate(() => localStorage.clear()).catch(() => {});
-  await page.goto(`${BASE}/#/home`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/home`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Click "I'm new"
   await safeClick('#chooseNew');
@@ -105,7 +105,7 @@ async function collectCoverage() {
 
   // Switch to experienced mode
   await page.evaluate(() => localStorage.clear()).catch(() => {});
-  await page.goto(`${BASE}/#/home`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/home`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   await safeClick('#chooseExp');
 
   // Interact with experienced home page
@@ -120,7 +120,7 @@ async function collectCoverage() {
   // NODES PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Nodes page...');
-  await page.goto(`${BASE}/#/nodes`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/nodes`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Sort by EVERY column
   for (const col of ['name', 'public_key', 'role', 'last_seen', 'advert_count']) {
@@ -168,7 +168,7 @@ async function collectCoverage() {
   try {
     const firstNodeKey = await page.$eval('#nodesBody tr td:nth-child(2)', el => el.textContent.trim());
     if (firstNodeKey) {
-      await page.goto(`${BASE}/#/nodes/${firstNodeKey}`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+      await page.goto(`${BASE}/#/nodes/${firstNodeKey}`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
       // Click tabs on detail page
       await clickAll('.tab-btn, [data-tab]', 10);
@@ -191,7 +191,7 @@ async function collectCoverage() {
   try {
     const firstKey = await page.$eval('#nodesBody tr td:nth-child(2)', el => el.textContent.trim()).catch(() => null);
     if (firstKey) {
-      await page.goto(`${BASE}/#/nodes/${firstKey}?scroll=paths`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+      await page.goto(`${BASE}/#/nodes/${firstKey}?scroll=paths`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
     }
   } catch {}
 
@@ -199,7 +199,7 @@ async function collectCoverage() {
   // PACKETS PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Packets page...');
-  await page.goto(`${BASE}/#/packets`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/packets`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Open filter bar
   await safeClick('#filterToggleBtn');
@@ -285,13 +285,13 @@ async function collectCoverage() {
   } catch {}
 
   // Navigate to specific packet by hash
-  await page.goto(`${BASE}/#/packets/deadbeef`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/packets/deadbeef`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // ══════════════════════════════════════════════
   // MAP PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Map page...');
-  await page.goto(`${BASE}/#/map`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/map`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Toggle controls panel
   await safeClick('#mapControlsToggle');
@@ -345,7 +345,7 @@ async function collectCoverage() {
   // ANALYTICS PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Analytics page...');
-  await page.goto(`${BASE}/#/analytics`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/analytics`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Click EVERY analytics tab
   const analyticsTabs = ['overview', 'rf', 'topology', 'channels', 'hashsizes', 'collisions', 'subpaths', 'nodes', 'distance'];
@@ -383,7 +383,7 @@ async function collectCoverage() {
 
   // Deep-link to each analytics tab via URL
   for (const tab of analyticsTabs) {
-    await page.goto(`${BASE}/#/analytics?tab=${tab}`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+    await page.goto(`${BASE}/#/analytics?tab=${tab}`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   }
 
   // Region filter on analytics
@@ -396,7 +396,7 @@ async function collectCoverage() {
   // CUSTOMIZE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Customizer...');
-  await page.goto(BASE, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(BASE, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   await safeClick('#customizeToggle');
 
   // Click EVERY customizer tab
@@ -503,7 +503,7 @@ async function collectCoverage() {
   // CHANNELS PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Channels page...');
-  await page.goto(`${BASE}/#/channels`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/channels`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   // Click channel rows/items
   await clickAll('.channel-item, .channel-row, .channel-card', 3);
   await clickAll('table tbody tr', 3);
@@ -512,7 +512,7 @@ async function collectCoverage() {
   try {
     const channelHash = await page.$eval('table tbody tr td:first-child', el => el.textContent.trim()).catch(() => null);
     if (channelHash) {
-      await page.goto(`${BASE}/#/channels/${channelHash}`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+      await page.goto(`${BASE}/#/channels/${channelHash}`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
     }
   } catch {}
 
@@ -520,7 +520,7 @@ async function collectCoverage() {
   // LIVE PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Live page...');
-  await page.goto(`${BASE}/#/live`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/live`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // VCR controls
   await safeClick('#vcrPauseBtn');
@@ -603,14 +603,14 @@ async function collectCoverage() {
   // TRACES PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Traces page...');
-  await page.goto(`${BASE}/#/traces`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/traces`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   await clickAll('table tbody tr', 3);
 
   // ══════════════════════════════════════════════
   // OBSERVERS PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Observers page...');
-  await page.goto(`${BASE}/#/observers`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/observers`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   // Click observer rows
   const obsRows = await page.$$('table tbody tr, .observer-card, .observer-row');
   for (let i = 0; i < Math.min(obsRows.length, 3); i++) {
@@ -631,7 +631,7 @@ async function collectCoverage() {
   // PERF PAGE
   // ══════════════════════════════════════════════
   console.log('  [coverage] Perf page...');
-  await page.goto(`${BASE}/#/perf`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/perf`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
   await safeClick('#perfRefresh');
   await safeClick('#perfReset');
 
@@ -641,14 +641,14 @@ async function collectCoverage() {
   console.log('  [coverage] App.js — router + global...');
 
   // Navigate to bad route to trigger error/404
-  await page.goto(`${BASE}/#/nonexistent-route`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+  await page.goto(`${BASE}/#/nonexistent-route`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
 
   // Navigate to every route via hash
   const allRoutes = ['home', 'nodes', 'packets', 'map', 'live', 'channels', 'traces', 'observers', 'analytics', 'perf'];
   for (const route of allRoutes) {
     try {
       await page.evaluate((r) => { location.hash = '#/' + r; }, route);
-      await page.waitForLoadState('networkidle').catch(() => {});
+      await new Promise(r => setTimeout(r, 200));
     } catch {}
   }
 
@@ -788,14 +788,14 @@ async function collectCoverage() {
   console.log('  [coverage] Region filter...');
   try {
     // Open region filter on nodes page
-    await page.goto(`${BASE}/#/nodes`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+    await page.goto(`${BASE}/#/nodes`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
     await safeClick('#nodesRegionFilter');
     await clickAll('#nodesRegionFilter input[type="checkbox"]', 3);
   } catch {}
 
   // Region filter on packets
   try {
-    await page.goto(`${BASE}/#/packets`, { waitUntil: 'networkidle', timeout: 15000 }).catch(() => {});
+    await page.goto(`${BASE}/#/packets`, { waitUntil: 'domcontentloaded', timeout: 10000 }).catch(() => {});
     await safeClick('#packetsRegionFilter');
     await clickAll('#packetsRegionFilter input[type="checkbox"]', 3);
   } catch {}
@@ -807,7 +807,7 @@ async function collectCoverage() {
   for (const route of allRoutes) {
     try {
       await page.evaluate((r) => { location.hash = '#/' + r; }, route);
-      await page.waitForLoadState('networkidle').catch(() => {});
+      await new Promise(r => setTimeout(r, 200));
     } catch {}
   }
 

test-e2e-playwright.js

@@ -10,13 +10,21 @@ const GO_BASE = process.env.GO_BASE_URL || '';  // e.g. https://analyzer.00id.ne
 const results = [];
 
 async function test(name, fn) {
-  try {
-    await fn();
-    results.push({ name, pass: true });
-    console.log(`  \u2705 ${name}`);
-  } catch (err) {
-    results.push({ name, pass: false, error: err.message });
-    console.log(`  \u274c ${name}: ${err.message}`);
+  const MAX_RETRIES = 2;
+  for (let attempt = 1; attempt <= MAX_RETRIES; attempt++) {
+    try {
+      await fn();
+      results.push({ name, pass: true });
+      console.log(`  \u2705 ${name}${attempt > 1 ? ` (retry ${attempt - 1})` : ''}`);
+      return;
+    } catch (err) {
+      if (attempt < MAX_RETRIES) {
+        console.log(`  \u26a0\ufe0f ${name}: ${err.message} (retrying...)`);
+        continue;
+      }
+      results.push({ name, pass: false, error: err.message });
+      console.log(`  \u274c ${name}: ${err.message}`);
+    }
   }
 }
 
@@ -324,7 +332,9 @@ async function run() {
 
   // Test: Packets groupByHash toggle changes view
   await test('Packets groupByHash toggle works', async () => {
-    await page.waitForSelector('table tbody tr');
+    // Fresh navigation to ensure clean state
+    await page.goto(`${BASE}/#/packets`, { waitUntil: 'domcontentloaded' });
+    await page.waitForSelector('table tbody tr', { timeout: 15000 });
     const groupBtn = await page.$('#fGroup');
     assert(groupBtn, 'Group by hash button (#fGroup) not found');
     // Check initial state (default is grouped/active)
@@ -354,10 +364,17 @@ async function run() {
   await test('Packets clicking row shows detail pane', async () => {
     // Fresh navigation to avoid stale row references from previous test
     await page.goto(`${BASE}/#/packets`, { waitUntil: 'domcontentloaded' });
+    // Wait for table rows AND initial API data to settle
     await page.waitForSelector('table tbody tr[data-action]', { timeout: 15000 });
+    await page.waitForLoadState('networkidle');
     const firstRow = await page.$('table tbody tr[data-action]');
     assert(firstRow, 'No clickable packet rows found');
-    await firstRow.click();
+    // Click the row and wait for the /packets/{hash} API response
+    const [response] = await Promise.all([
+      page.waitForResponse(resp => resp.url().includes('/packets/') && resp.status() === 200, { timeout: 15000 }),
+      firstRow.click(),
+    ]);
+    assert(response, 'API response for packet detail not received');
     await page.waitForFunction(() => {
       const panel = document.getElementById('pktRight');
       return panel && !panel.classList.contains('empty');
@@ -375,12 +392,16 @@ async function run() {
     if (!pktRight) {
       await page.goto(`${BASE}/#/packets`, { waitUntil: 'domcontentloaded' });
       await page.waitForSelector('table tbody tr[data-action]', { timeout: 15000 });
+      await page.waitForLoadState('networkidle');
     }
     const panelOpen = await page.$eval('#pktRight', el => !el.classList.contains('empty'));
     if (!panelOpen) {
       const firstRow = await page.$('table tbody tr[data-action]');
       if (!firstRow) { console.log('    ⏭️  Skipped (no clickable rows)'); return; }
-      await firstRow.click();
+      await Promise.all([
+        page.waitForResponse(resp => resp.url().includes('/packets/') && resp.status() === 200, { timeout: 15000 }),
+        firstRow.click(),
+      ]);
       await page.waitForFunction(() => {
         const panel = document.getElementById('pktRight');
         return panel && !panel.classList.contains('empty');
@@ -523,6 +544,11 @@ async function run() {
   });
 
   await test('Compare page runs comparison', async () => {
+    // Wait for dropdowns to be populated (may still be loading from previous test)
+    await page.waitForFunction(() => {
+      const selA = document.getElementById('compareObsA');
+      return selA && selA.options.length > 2;
+    }, { timeout: 10000 });
     const options = await page.$$eval('#compareObsA option', opts =>
       opts.filter(o => o.value).map(o => o.value)
     );
@@ -544,6 +570,12 @@ async function run() {
 
   // Test: Compare results show shared/unique breakdown (#129)
   await test('Compare results show shared/unique cards', async () => {
+    // Wait for comparison results to fully render (depends on previous test)
+    await page.waitForFunction(() => {
+      return document.querySelector('.compare-card-both') &&
+             document.querySelector('.compare-card-a') &&
+             document.querySelector('.compare-card-b');
+    }, { timeout: 10000 });
     // Results should be visible from previous test
     const cardBoth = await page.$('.compare-card-both');
     assert(cardBoth, 'Should have "shared" card (.compare-card-both)');
@@ -566,6 +598,11 @@ async function run() {
 
   // Test: Compare "both" tab shows table with shared packets
   await test('Compare both tab shows shared packets table', async () => {
+    // Ensure compare results are present
+    await page.waitForFunction(() => {
+      const c = document.getElementById('compareContent');
+      return c && c.textContent.trim().length > 20;
+    }, { timeout: 10000 });
     const bothTab = await page.$('[data-cview="both"]');
     assert(bothTab, '"both" tab button not found');
     await bothTab.click();
@@ -789,7 +826,11 @@ async function run() {
     // Check for summary stats
     const summary = await page.$('.obs-summary');
     assert(summary, 'Observer summary stats not found');
-    // Verify table has rows
+    // Wait for table rows to populate
+    await page.waitForFunction(() => {
+      const rows = document.querySelectorAll('#obsTable tbody tr');
+      return rows.length > 0;
+    }, { timeout: 10000 });
     const rows = await page.$$('#obsTable tbody tr');
     assert(rows.length > 0, `Expected >=1 observer rows, got ${rows.length}`);
   });
@@ -909,6 +950,19 @@ async function run() {
     assert(hexDump, 'Hex dump should be visible after selecting a packet');
   });
 
+  // Extract frontend coverage if instrumented server is running
+  try {
+    const coverage = await page.evaluate(() => window.__coverage__);
+    if (coverage) {
+      const fs = require('fs');
+      const path = require('path');
+      const outDir = path.join(__dirname, '.nyc_output');
+      if (!fs.existsSync(outDir)) fs.mkdirSync(outDir, { recursive: true });
+      fs.writeFileSync(path.join(outDir, 'e2e-coverage.json'), JSON.stringify(coverage));
+      console.log(`Frontend coverage from E2E: ${Object.keys(coverage).length} files`);
+    }
+  } catch {}
+
   await browser.close();
 
   // Summary

test-frontend-helpers.js

@@ -1322,7 +1322,7 @@ console.log('\n=== app.js: formatVersionBadge ===');
     assert.ok(result.includes('>v2.6.0</a>'), 'version text has v prefix');
     assert.ok(result.includes(`href="${GH}/commit/abc1234def5678"`), 'commit links to full hash');
     assert.ok(result.includes('>abc1234</a>'), 'commit display is truncated to 7');
-    assert.ok(result.includes('[node]'), 'should show engine');
+    assert.ok(result.includes('engine-badge'), 'should show engine badge'); assert.ok(result.includes('>node<'), 'should show engine name');
   });
   test('prod port 80: shows version', () => {
     const { formatVersionBadge } = makeBadgeSandbox('80');
@@ -1348,7 +1348,7 @@ console.log('\n=== app.js: formatVersionBadge ===');
     assert.ok(!result.includes('v2.6.0'), 'staging should NOT show version');
     assert.ok(result.includes('>abc1234</a>'), 'should show commit hash');
     assert.ok(result.includes(`href="${GH}/commit/abc1234def5678"`), 'commit is linked');
-    assert.ok(result.includes('[go]'), 'should show engine');
+    assert.ok(result.includes('engine-badge'), 'should show engine badge'); assert.ok(result.includes('>go<'), 'should show engine name');
   });
   test('staging port 81: hides version', () => {
     const { formatVersionBadge } = makeBadgeSandbox('81');
@@ -1369,18 +1369,18 @@ console.log('\n=== app.js: formatVersionBadge ===');
     const result = formatVersionBadge('2.6.0', 'unknown', 'node');
     assert.ok(result.includes('>v2.6.0</a>'), 'should show version');
     assert.ok(!result.includes('unknown'), 'should not show unknown commit');
-    assert.ok(result.includes('[node]'), 'should show engine');
+    assert.ok(result.includes('engine-badge'), 'should show engine badge'); assert.ok(result.includes('>node<'), 'should show engine name');
   });
   test('skips commit when missing', () => {
     const { formatVersionBadge } = makeBadgeSandbox('');
     const result = formatVersionBadge('2.6.0', null, 'go');
     assert.ok(result.includes('>v2.6.0</a>'), 'should show version');
-    assert.ok(result.includes('[go]'), 'should show engine');
+    assert.ok(result.includes('engine-badge'), 'should show engine badge'); assert.ok(result.includes('>go<'), 'should show engine name');
   });
   test('shows only engine when version/commit missing', () => {
     const { formatVersionBadge } = makeBadgeSandbox('3000');
     const result = formatVersionBadge(null, null, 'go');
-    assert.ok(result.includes('[go]'), 'should show engine');
+    assert.ok(result.includes('engine-badge'), 'should show engine badge'); assert.ok(result.includes('>go<'), 'should show engine name');
     assert.ok(result.includes('version-badge'), 'should use version-badge class');
   });
   test('short commit not truncated in display', () => {
@@ -1398,7 +1398,7 @@ console.log('\n=== app.js: formatVersionBadge ===');
     const { formatVersionBadge } = makeBadgeSandbox('8080');
     const result = formatVersionBadge('2.6.0', null, 'go');
     assert.ok(!result.includes('2.6.0'), 'no version on staging');
-    assert.ok(result.includes('[go]'), 'engine shown');
+    assert.ok(result.includes('engine-badge'), 'engine badge shown'); assert.ok(result.includes('>go<'), 'engine name shown');
   });
 }
 

tools/seed-test-data.js

@@ -0,0 +1,228 @@
+#!/usr/bin/env node
+'use strict';
+
+/**
+ * Seed synthetic test data into a running CoreScope server.
+ * Usage: node tools/seed-test-data.js [baseUrl]
+ * Default: http://localhost:13581
+ */
+
+const crypto = require('crypto');
+
+const BASE = process.argv[2] || process.env.BASE_URL || 'http://localhost:13581';
+
+const OBSERVERS = [
+  { id: 'E2E-SJC-1', iata: 'SJC' },
+  { id: 'E2E-SFO-2', iata: 'SFO' },
+  { id: 'E2E-OAK-3', iata: 'OAK' },
+];
+
+const NODE_NAMES = [
+  'TestNode Alpha', 'TestNode Beta', 'TestNode Gamma', 'TestNode Delta',
+  'TestNode Epsilon', 'TestNode Zeta', 'TestNode Eta', 'TestNode Theta',
+];
+
+function rand(a, b) { return Math.random() * (b - a) + a; }
+function randInt(a, b) { return Math.floor(rand(a, b + 1)); }
+function pick(a) { return a[randInt(0, a.length - 1)]; }
+function randomBytes(n) { return crypto.randomBytes(n); }
+function pubkeyFor(name) { return crypto.createHash('sha256').update(name).digest(); }
+
+function encodeHeader(routeType, payloadType, ver = 0) {
+  return (routeType & 0x03) | ((payloadType & 0x0F) << 2) | ((ver & 0x03) << 6);
+}
+
+function buildPath(hopCount, hashSize = 2) {
+  const pathByte = ((hashSize - 1) << 6) | (hopCount & 0x3F);
+  const hops = crypto.randomBytes(hashSize * hopCount);
+  return { pathByte, hops };
+}
+
+function buildAdvert(name, role) {
+  const pubKey = pubkeyFor(name);
+  const ts = Buffer.alloc(4); ts.writeUInt32LE(Math.floor(Date.now() / 1000));
+  const sig = randomBytes(64);
+  let flags = 0x80 | 0x10; // hasName + hasLocation
+  if (role === 'repeater') flags |= 0x02;
+  else if (role === 'room') flags |= 0x04;
+  else if (role === 'sensor') flags |= 0x08;
+  else flags |= 0x01;
+  const nameBuf = Buffer.from(name, 'utf8');
+  const appdata = Buffer.alloc(9 + nameBuf.length);
+  appdata[0] = flags;
+  appdata.writeInt32LE(Math.round(37.34 * 1e6), 1);
+  appdata.writeInt32LE(Math.round(-121.89 * 1e6), 5);
+  nameBuf.copy(appdata, 9);
+  const payload = Buffer.concat([pubKey, ts, sig, appdata]);
+  const header = encodeHeader(1, 0x04, 0); // FLOOD + ADVERT
+  const { pathByte, hops } = buildPath(randInt(0, 3));
+  return Buffer.concat([Buffer.from([header, pathByte]), hops, payload]);
+}
+
+function buildGrpTxt(channelHash = 0) {
+  const mac = randomBytes(2);
+  const enc = randomBytes(randInt(10, 40));
+  const payload = Buffer.concat([Buffer.from([channelHash]), mac, enc]);
+  const header = encodeHeader(1, 0x05, 0); // FLOOD + GRP_TXT
+  const { pathByte, hops } = buildPath(randInt(0, 3));
+  return Buffer.concat([Buffer.from([header, pathByte]), hops, payload]);
+}
+
+/**
+ * Build a properly encrypted GRP_TXT packet that decrypts to a CHAN message.
+ * Uses #LongFast channel key from channel-rainbow.json.
+ */
+function buildEncryptedGrpTxt(sender, message) {
+  try {
+    const CryptoJS = require('crypto-js');
+    const { ChannelCrypto } = require('@michaelhart/meshcore-decoder/dist/crypto/channel-crypto');
+
+    const channelKey = '2cc3d22840e086105ad73443da2cacb8'; // #LongFast
+    const text = `${sender}: ${message}`;
+    const buf = Buffer.alloc(5 + text.length + 1);
+    buf.writeUInt32LE(Math.floor(Date.now() / 1000), 0);
+    buf[4] = 0;
+    buf.write(text + '\0', 5, 'utf8');
+
+    const padded = Buffer.alloc(Math.ceil(buf.length / 16) * 16);
+    buf.copy(padded);
+
+    const keyWords = CryptoJS.enc.Hex.parse(channelKey);
+    const plaintextWords = CryptoJS.enc.Hex.parse(padded.toString('hex'));
+    const encrypted = CryptoJS.AES.encrypt(plaintextWords, keyWords, {
+      mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.NoPadding
+    });
+    const cipherHex = encrypted.ciphertext.toString(CryptoJS.enc.Hex);
+
+    const channelSecret = Buffer.alloc(32);
+    Buffer.from(channelKey, 'hex').copy(channelSecret);
+    const mac = CryptoJS.HmacSHA256(
+      CryptoJS.enc.Hex.parse(cipherHex),
+      CryptoJS.enc.Hex.parse(channelSecret.toString('hex'))
+    );
+    const macHex = mac.toString(CryptoJS.enc.Hex).substring(0, 4);
+
+    const chHash = ChannelCrypto.calculateChannelHash('#LongFast');
+    const grpPayload = Buffer.from(
+      chHash.toString(16).padStart(2, '0') + macHex + cipherHex, 'hex'
+    );
+
+    const header = encodeHeader(1, 0x05, 0);
+    const { pathByte, hops } = buildPath(randInt(0, 2));
+    return Buffer.concat([Buffer.from([header, pathByte]), hops, grpPayload]);
+  } catch (e) {
+    // Fallback to unencrypted if crypto libs unavailable
+    return buildGrpTxt(0);
+  }
+}
+
+function buildAck() {
+  const payload = randomBytes(18);
+  const header = encodeHeader(2, 0x03, 0);
+  const { pathByte, hops } = buildPath(randInt(0, 2));
+  return Buffer.concat([Buffer.from([header, pathByte]), hops, payload]);
+}
+
+function buildTxtMsg() {
+  const payload = Buffer.concat([randomBytes(6), randomBytes(6), randomBytes(4), randomBytes(20)]);
+  const header = encodeHeader(2, 0x02, 0);
+  const { pathByte, hops } = buildPath(randInt(0, 2));
+  return Buffer.concat([Buffer.from([header, pathByte]), hops, payload]);
+}
+
+function computeContentHash(hex) {
+  return crypto.createHash('sha256').update(hex.toUpperCase()).digest('hex').substring(0, 16);
+}
+
+async function post(path, body) {
+  const r = await fetch(`${BASE}${path}`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(body),
+  });
+  return { status: r.status, data: await r.json() };
+}
+
+async function main() {
+  console.log(`Seeding test data into ${BASE}...`);
+
+  const packets = [];
+
+  // 1. ADVERTs for each node (creates nodes with location for map)
+  const roles = ['repeater', 'repeater', 'room', 'companion', 'repeater', 'companion', 'sensor', 'repeater'];
+  for (let i = 0; i < NODE_NAMES.length; i++) {
+    const obs = pick(OBSERVERS);
+    const hex = buildAdvert(NODE_NAMES[i], roles[i]).toString('hex').toUpperCase();
+    const hash = computeContentHash(hex);
+    packets.push({ hex, observer: obs.id, region: obs.iata, hash, snr: 5.0, rssi: -80 });
+    // Send same advert from multiple observers for compare page
+    for (const otherObs of OBSERVERS) {
+      if (otherObs.id !== obs.id) {
+        packets.push({ hex, observer: otherObs.id, region: otherObs.iata, hash, snr: rand(-2, 10), rssi: rand(-110, -60) });
+      }
+    }
+  }
+
+  // 2. Encrypted GRP_TXT packets (creates channel messages for channels page)
+  const chatMessages = [
+    ['Alice', 'Hello everyone!'], ['Bob', 'Hey Alice!'], ['Charlie', 'Good morning'],
+    ['Alice', 'How is the mesh today?'], ['Bob', 'Looking great, 8 nodes online'],
+    ['Charlie', 'I just set up a new repeater'], ['Alice', 'Nice! Where is it?'],
+    ['Bob', 'Signal looks strong from here'], ['Charlie', 'On top of the hill'],
+    ['Alice', 'Perfect location!'],
+  ];
+  for (const [sender, message] of chatMessages) {
+    const obs = pick(OBSERVERS);
+    const hex = buildEncryptedGrpTxt(sender, message).toString('hex').toUpperCase();
+    const hash = computeContentHash(hex);
+    packets.push({ hex, observer: obs.id, region: obs.iata, hash, snr: rand(-2, 10), rssi: rand(-110, -60) });
+  }
+
+  // 3. Unencrypted GRP_TXT packets (won't create channel entries but add packet variety)
+  for (let i = 0; i < 10; i++) {
+    const obs = pick(OBSERVERS);
+    const hex = buildGrpTxt(randInt(0, 3)).toString('hex').toUpperCase();
+    const hash = computeContentHash(hex);
+    packets.push({ hex, observer: obs.id, region: obs.iata, hash, snr: rand(-2, 10), rssi: rand(-110, -60) });
+  }
+
+  // 3. ACK packets
+  for (let i = 0; i < 15; i++) {
+    const obs = pick(OBSERVERS);
+    const hex = buildAck().toString('hex').toUpperCase();
+    const hash = computeContentHash(hex);
+    packets.push({ hex, observer: obs.id, region: obs.iata, hash, snr: rand(-2, 10), rssi: rand(-110, -60) });
+  }
+
+  // 4. TXT_MSG packets
+  for (let i = 0; i < 15; i++) {
+    const obs = pick(OBSERVERS);
+    const hex = buildTxtMsg().toString('hex').toUpperCase();
+    const hash = computeContentHash(hex);
+    packets.push({ hex, observer: obs.id, region: obs.iata, hash, snr: rand(-2, 10), rssi: rand(-110, -60) });
+  }
+
+  // 5. Extra packets with shared hashes (for trace/compare)
+  for (let t = 0; t < 5; t++) {
+    const hex = buildGrpTxt(0).toString('hex').toUpperCase();
+    const traceHash = computeContentHash(hex);
+    for (const obs of OBSERVERS) {
+      packets.push({ hex, observer: obs.id, region: obs.iata, hash: traceHash, snr: 5, rssi: -80 });
+    }
+  }
+
+  console.log(`Injecting ${packets.length} packets...`);
+  let ok = 0, fail = 0;
+  for (const pkt of packets) {
+    const r = await post('/api/packets', pkt);
+    if (r.status === 200) ok++;
+    else { fail++; if (fail <= 3) console.error('  Inject fail:', r.data); }
+  }
+  console.log(`Done: ${ok} ok, ${fail} fail`);
+
+  if (fail > 0) {
+    process.exit(1);
+  }
+}
+
+main().catch(err => { console.error(err); process.exit(1); });