@sleep2agi/agent-network-dashboard 0.4.6-preview.281 → 0.4.6-preview.283

package/scripts/topo-freshness-text-color-coherence-test.mjs

@@ -1,97 +0,0 @@
-/* Round 272 verification: FreshnessChip text prefix matches color
- * state (fresh="live", stale="lag").
- *
- * Pre-R272 the chip read "live · {sec}s" in both states:
- *   fresh: gray  + "live · 3s"   → color says fresh, text says fresh ✓
- *   stale: amber + "live · 15s"  → color says stale, text says fresh ✗ (contradicts)
- *
- * Post-R272:
- *   fresh: gray  + "live · 3s"   → color and text both say fresh ✓
- *   stale: amber + "lag · 15s"   → color and text both signal stale ✓
- *
- * The chip's `stale` flag fires when sec > 10. Hard to wait 11s in
- * a test, so we test the fresh-state directly (default render is
- * fresh since useRef captures Date.now() at mount and 0s has
- * elapsed). For stale, we'd need to wait — instead, verify the
- * code path by checking the chip exists with fresh text + correct
- * `data-freshness-chip-stale='false'` attr.
- *
- * Test scope:
- *   1. Chip exists with data-freshness-chip attribute.
- *   2. At fresh state, data-freshness-chip-stale === 'false'.
- *   3. At fresh state, text starts with "live · " (prefix word "live").
- *   4. At fresh state, color is gray (computed color contains 156 or
- *      similar Tailwind gray RGB).
- *   5. Source code regression: the new JSX uses {stale ? 'lag' : 'live'}
- *      ternary (verified by grep'ing the rendered HTML node structure
- *      — the ternary always renders ONE of the two words, so the chip
- *      text should contain a single 3-letter prefix word).
- *   6. R271 regression: legend row hitbox y=21 (working row).
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-const browser = await chromium.launch({ headless: true });
-const ctx = await browser.newContext({ viewport: { width: 1500, height: 1500 } });
-await ctx.addCookies([{ name: 'anet_dashboard_session', value: `v3:${TOKEN}`, domain: '127.0.0.1', path: '/' }]);
-await ctx.addInitScript(() => {
-  try { localStorage.setItem('anet-theme', 'cyber'); sessionStorage.setItem('anet_v3_auth', '1'); } catch {}
-});
-const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-await ctx.route('**/api/hub/status*', async (route) => {
-  const r = await route.fetch();
-  const b = await r.json();
-  const nid = (b.sessions || [])[0]?.network_id || 'default';
-  const mk = (alias) => ({
-    alias, status: 'working', model: 'claude-opus-4', runtime: 'claude-code-cli',
-    network_id: nid, project_dir: null,
-    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
-  });
-  await route.fulfill({ response: r, json: { ...b, sessions: [
-    mk('alpha'), mk('beta'), mk('gamma'), mk('delta'),
-  ] } });
-});
-await ctx.route('**/api/hub/messages*', (r) => r.fulfill({ json: { messages: [] } }));
-await ctx.route('**/api/hub/tasks*', (r) => r.fulfill({ json: { tasks: [] } }));
-
-const page = await ctx.newPage();
-await page.goto('http://127.0.0.1:3000/', { waitUntil: 'domcontentloaded' });
-await page.waitForFunction(() => document.querySelectorAll('g[data-node]').length === 4, { timeout: 30000 });
-await page.waitForSelector('[data-freshness-chip]',           { timeout: 10000 });
-await page.waitForSelector('[data-legend-status="working"] rect', { timeout: 10000 });
-await page.waitForTimeout(300);
-
-const probe = await page.evaluate(() => {
-  const chip = document.querySelector('[data-freshness-chip]');
-  const legendRect = document.querySelector('[data-legend-status="working"] rect');
-  return {
-    chipText:   chip ? chip.textContent.trim() : null,
-    chipStale:  chip ? chip.getAttribute('data-freshness-chip-stale') : null,
-    chipColor:  chip ? window.getComputedStyle(chip).color : null,
-    legendRectY: legendRect ? +legendRect.getAttribute('y') : null,
-  };
-});
-await browser.close();
-
-// Fresh state: text should start with "live · " and stale attr === 'false'.
-// gray chip color: text-gray-400 in cyber theme = rgb(156, 163, 175) or oklab(...) → contains "156" or "rgb".
-const results = {
-  chip_present:                 probe.chipText !== null,
-  chip_is_fresh:                probe.chipStale === 'false',
-  chip_text_starts_with_live:   probe.chipText != null && probe.chipText.startsWith('live · '),
-  chip_text_no_lag_when_fresh:  probe.chipText != null && !probe.chipText.startsWith('lag · '),
-  // Fresh color in cyber is text-gray-400. Tailwind v4 renders modern
-  // browsers as oklab()/lab()/oklch(). Accept any computed-color
-  // function format that indicates a color was actually applied.
-  chip_color_set:               probe.chipColor != null
-                                 && /(rgb|oklab|lab|oklch|hsl)/.test(probe.chipColor),
-  r271_legend_rect_y_21:        probe.legendRectY === 21,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} freshness text color coherence:`, JSON.stringify(results),
-  '\n  chip text:', JSON.stringify(probe.chipText),
-  '\n  chip stale attr:', probe.chipStale,
-  '\n  chip color:', probe.chipColor,
-  '\n  legend rect y:', probe.legendRectY);
-process.exit(ok ? 0 : 1);

package/scripts/topo-orbit-busyness-test.mjs

@@ -1,96 +0,0 @@
-/* Round 131 verification: outer-ring orbit period buckets on
- * workingCount, mirroring R84's hub-breath cadence. Idle fleet
- * keeps the original 16s "calm sweep"; as work piles up the
- * orbit accelerates to 14 / 12 / 10s. Both motion layers now
- * read the same underlying "is the network busy" signal.
- *
- * Bucket boundaries identical to R84 (line ~2702):
- *   workingCount === 0     → bucket 0, dur 16s
- *   workingCount in [1, 2] → bucket 1, dur 14s
- *   workingCount in [3, 5] → bucket 2, dur 12s
- *   workingCount  >= 6     → bucket 3, dur 10s
- *
- * R50 only renders on cyber theme (light is skipped to keep the
- * white surface clean). All probes use cyber.
- *
- * Probe fleet sizes pick one representative per bucket.
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-
-async function probe(workingCount, totalCount) {
-  const browser = await chromium.launch({ headless: true });
-  const ctx = await browser.newContext({ viewport: { width: 1400, height: 1500 } });
-  await ctx.addCookies([{ name: 'anet_dashboard_session', value: `v3:${TOKEN}`, domain: '127.0.0.1', path: '/' }]);
-  await ctx.addInitScript(() => {
-    try { localStorage.setItem('anet-theme', 'cyber'); sessionStorage.setItem('anet_v3_auth', '1'); } catch {}
-  });
-  const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-  await ctx.route('**/api/hub/status*', async (route) => {
-    const r = await route.fetch();
-    const b = await r.json();
-    const nid = (b.sessions || [])[0]?.network_id || 'default';
-    const sessions = [];
-    for (let i = 0; i < totalCount; i++) {
-      sessions.push({
-        alias: `node${i}`,
-        status: i < workingCount ? 'working' : 'idle',
-        model: 'claude-opus-4', runtime: 'cli-claude-code',
-        network_id: nid, project_dir: null,
-        created_at: fresh, updated_at: fresh, last_seen_at: fresh,
-      });
-    }
-    await route.fulfill({ response: r, json: { ...b, sessions } });
-  });
-  await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [] } }));
-  await ctx.route('**/api/hub/tasks*', (route) => route.fulfill({ json: { tasks: [] } }));
-
-  const page = await ctx.newPage();
-  await page.goto('http://127.0.0.1:3000/', { waitUntil: 'domcontentloaded' });
-  await page.waitForFunction((n) => document.querySelectorAll('g[data-node]').length === n, totalCount, { timeout: 30000 });
-  await page.waitForTimeout(400);
-
-  const out = await page.evaluate(() => {
-    const orbits = [...document.querySelectorAll('[data-topo-orbit-bucket]')];
-    return orbits.map(g => ({
-      bucket: g.getAttribute('data-topo-orbit-bucket'),
-      dur:    g.getAttribute('data-topo-orbit-dur'),
-      animDur: g.querySelector('animateTransform')?.getAttribute('dur'),
-    }));
-  });
-
-  await browser.close();
-  return out;
-}
-
-// Pick one from each bucket
-const b0 = await probe(0, 4);  // workingCount=0  → bucket 0, dur 16
-const b1 = await probe(2, 4);  // workingCount=2  → bucket 1, dur 14
-const b2 = await probe(4, 5);  // workingCount=4  → bucket 2, dur 12
-const b3 = await probe(7, 8);  // workingCount=7  → bucket 3, dur 10
-
-const allConsistent = (orbits, bucket, dur) =>
-  orbits.length === 4 &&
-  orbits.every(o => o.bucket === String(bucket) && o.dur === String(dur) && o.animDur === `${dur}s`);
-
-const results = {
-  b0_fourOrbits:  b0.length === 4,
-  b0_bucket0_16s: allConsistent(b0, 0, 16),
-  b1_bucket1_14s: allConsistent(b1, 1, 14),
-  b2_bucket2_12s: allConsistent(b2, 2, 12),
-  b3_bucket3_10s: allConsistent(b3, 3, 10),
-  // dur strictly decreases as busy increases
-  dur_monotonic:
-    Number(b0[0]?.dur) > Number(b1[0]?.dur) &&
-    Number(b1[0]?.dur) > Number(b2[0]?.dur) &&
-    Number(b2[0]?.dur) > Number(b3[0]?.dur),
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} orbit busyness:`, JSON.stringify(results),
-  `\n  b0(0w/4)=`, b0,
-  `\n  b1(2w/4)=`, b1,
-  `\n  b2(4w/5)=`, b2,
-  `\n  b3(7w/8)=`, b3);
-process.exit(ok ? 0 : 1);

package/scripts/topo-orbit-opacity-bucket-test.mjs

@@ -1,124 +0,0 @@
-/* Round 216 verification: outer-ring orbit particle opacity scales
- * with busy bucket alongside R131's speed scaling. Idle fleet → dim
- * particles; busy fleet → bright. transitions on opacity 300ms.
- *
- * Bucket map: workingCount 0 → busy 0; 1-2 → 1; 3-5 → 2; 6+ → 3
- *             opacity      [0.5, 0.7, 0.85, 1.0]
- *
- * Test scenarios (cyber dark, orbit particles only render in dark):
- *   A. 0 working sessions (4 idle):   busy=0, opacity≈0.5
- *   B. 2 working sessions (2 working+2 idle):  busy=1, opacity≈0.7
- *   C. 6 working sessions:            busy=3, opacity≈1.0
- *   Every orbit particle has style.transition: 'opacity 300ms'
- *   Every orbit <g> exposes data-topo-orbit-opacity matching the
- *   bucket value (test verifies derivation + DOM agreement).
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-const browser = await chromium.launch({ headless: true });
-
-async function pageFor(workingN) {
-  const ctx = await browser.newContext({ viewport: { width: 1500, height: 1500 } });
-  await ctx.addCookies([{ name: 'anet_dashboard_session', value: `v3:${TOKEN}`, domain: '127.0.0.1', path: '/' }]);
-  await ctx.addInitScript(() => {
-    try { localStorage.setItem('anet-theme', 'cyber'); sessionStorage.setItem('anet_v3_auth', '1'); } catch {}
-  });
-  const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-  const totalSessions = Math.max(workingN, 4);
-  await ctx.route('**/api/hub/status*', async (route) => {
-    const r = await route.fetch();
-    const b = await r.json();
-    const nid = (b.sessions || [])[0]?.network_id || 'default';
-    const mk = (alias, status) => ({
-      alias, status, model: 'claude-opus-4', runtime: 'claude-code-cli',
-      network_id: nid, project_dir: null,
-      created_at: fresh, updated_at: fresh, last_seen_at: fresh,
-    });
-    const sessions = [];
-    for (let i = 0; i < totalSessions; i++) {
-      sessions.push(mk(`node-${(i + 1).toString().padStart(2, '0')}`, i < workingN ? 'working' : 'idle'));
-    }
-    await route.fulfill({ response: r, json: { ...b, sessions } });
-  });
-  await ctx.route('**/api/hub/messages*', (r2) => r2.fulfill({ json: { messages: [] } }));
-  await ctx.route('**/api/hub/tasks*', (r2) => r2.fulfill({ json: { tasks: [] } }));
-  const page = await ctx.newPage();
-  await page.goto('http://127.0.0.1:3000/', { waitUntil: 'domcontentloaded' });
-  await page.waitForFunction((n) => document.querySelectorAll('g[data-node]').length === n, totalSessions, { timeout: 30000 });
-  await page.waitForSelector('[data-topo-orbit-bucket]', { timeout: 10000, state: 'attached' });
-  await page.waitForTimeout(300);
-  return page;
-}
-
-const probe = async (page) => page.evaluate(() => {
-  return [...document.querySelectorAll('[data-topo-orbit-bucket]')].map(el => {
-    const inner = el.querySelector('circle');
-    return {
-      bucket:        el.getAttribute('data-topo-orbit-bucket'),
-      bucketOpacity: el.getAttribute('data-topo-orbit-opacity'),
-      dur:           el.getAttribute('data-topo-orbit-dur'),
-      circleOpacity: parseFloat(inner?.getAttribute('opacity') || ''),
-      transition:    inner?.style.transition,
-    };
-  });
-});
-
-// Scenario A: 0 working → busy=0, opacity=0.5
-const pageA = await pageFor(0);
-const probeA = await probe(pageA);
-await pageA.close();
-
-// Scenario B: 2 working → busy=1, opacity=0.7
-const pageB = await pageFor(2);
-const probeB = await probe(pageB);
-await pageB.close();
-
-// Scenario C: 6 working → busy=3, opacity=1.0
-const pageC = await pageFor(6);
-const probeC = await probe(pageC);
-await pageC.close();
-await browser.close();
-
-const near = (got, want, tol = 0.05) => Math.abs(got - want) < tol;
-const hasOpacityT = (s) => /opacity\s+(?:300ms|0\.3s)/.test(s || '');
-
-const results = {
-  // 4 orbit particles in each scenario (R50 phase array of 4)
-  A_four_particles:        probeA.length === 4,
-  B_four_particles:        probeB.length === 4,
-  C_four_particles:        probeC.length === 4,
-
-  // Scenario A — idle fleet (busy=0)
-  A_bucket_0:              probeA.every(p => p.bucket === '0'),
-  A_opacity_half:          probeA.every(p => near(p.circleOpacity, 0.5)),
-  A_data_attr_matches:     probeA.every(p => parseFloat(p.bucketOpacity) === p.circleOpacity),
-
-  // Scenario B — light load (busy=1)
-  B_bucket_1:              probeB.every(p => p.bucket === '1'),
-  B_opacity_0p7:           probeB.every(p => near(p.circleOpacity, 0.7)),
-
-  // Scenario C — heavy load (busy=3)
-  C_bucket_3:              probeC.every(p => p.bucket === '3'),
-  C_opacity_full:          probeC.every(p => near(p.circleOpacity, 1.0)),
-
-  // Brightness actually grew across buckets
-  brightness_grew:         probeA[0].circleOpacity < probeB[0].circleOpacity
-                           && probeB[0].circleOpacity < probeC[0].circleOpacity,
-
-  // Transitions present in every particle of every scenario
-  A_all_have_transition:   probeA.every(p => hasOpacityT(p.transition)),
-  B_all_have_transition:   probeB.every(p => hasOpacityT(p.transition)),
-  C_all_have_transition:   probeC.every(p => hasOpacityT(p.transition)),
-
-  // R131's existing speed scaling still derives — dur shortens as
-  // bucket grows
-  speed_scales:            parseFloat(probeA[0].dur || '0') > parseFloat(probeC[0].dur || '99'),
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} orbit opacity bucket:`, JSON.stringify(results),
-  `\n  probeA (0 working):`, probeA.slice(0, 1),
-  `\n  probeB (2 working):`, probeB.slice(0, 1),
-  `\n  probeC (6 working):`, probeC.slice(0, 1));
-process.exit(ok ? 0 : 1);