@sleep2agi/agent-network-dashboard 0.5.6-preview.0 → 0.5.7-preview.0

package/scripts/topo-hub-hover-ring-glow-test.mjs

@@ -1,97 +0,0 @@
-/* Round 535 verification: hub hover-ring gains drop-shadow glow on
- * hub-hover — completes hub-cluster glow quartet (digit + disc +
- * spokes + ring).
- *
- * Test phases:
- *   1. rest: glow attr='false', filter='none', opacity=0
- *   2. hover hub (mouse.move to hub center bbox): glow='true',
- *      filter has cyber emerald-400 drop-shadow, opacity > 0
- *   3. transition list includes 'filter 200ms ease-out'
- *   4. source-side regex confirms filter ternary + transition wiring
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-
-const browser = await chromium.launch({ headless: true });
-const ctx = await browser.newContext({ viewport: { width: 1500, height: 1200 } });
-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');
-    localStorage.setItem('anet-topo-layout', 'ring');
-    sessionStorage.setItem('anet_v3_auth', '1');
-  } catch {}
-});
-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: 'idle', 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('a·1'), mk('a·2')] } });
-});
-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: 'networkidle' });
-await page.waitForSelector('[data-topo-hub-hover-ring]', { timeout: 15000 });
-await page.waitForTimeout(800);
-
-const restRead = async () => page.evaluate(() => {
-  const el = document.querySelector('[data-topo-hub-hover-ring]');
-  if (!el) return null;
-  const cs = getComputedStyle(el);
-  return {
-    glowAttr:  el.getAttribute('data-topo-hub-hover-ring-glow'),
-    opacity:   el.getAttribute('opacity'),
-    filter:    cs.filter,
-    transition: cs.transition,
-  };
-});
-
-// Phase 1: rest
-const rest = await restRead();
-
-// Phase 2: hover hub via hub-highlight bbox (banked R527 path)
-const hubBbox = await page.locator('[data-topo-hub-highlight]').first().boundingBox();
-if (hubBbox) {
-  await page.mouse.move(hubBbox.x + hubBbox.width / 2, hubBbox.y + hubBbox.height / 2);
-}
-await page.waitForTimeout(400);
-const hover = await restRead();
-
-await browser.close();
-
-// Source regex
-const src = readFileSync('/home/vansin/agent-network-dashboard/app/components/TopoGraph.tsx', 'utf8');
-const sourceFilterTernary =
-  /filter: !reducedMotion && hoveredHub\s+\? \(isLight\s+\? 'drop-shadow\(0 0 3px rgba\(16, 185, 129, 0\.5\)\)'\s+: 'drop-shadow\(0 0 3px rgba\(52, 211, 153, 0\.5\)\)'\)\s+: undefined,/.test(src);
-const sourceAttrWired =
-  /data-topo-hub-hover-ring-glow=\{!reducedMotion && hoveredHub \? 'true' : 'false'\}/.test(src);
-const sourceTransitionExt =
-  /transition: 'opacity 180ms ease-out, r 180ms ease-out, stroke 200ms ease-out, filter 200ms ease-out'/.test(src);
-
-const results = {
-  rest_glow_false:           rest?.glowAttr === 'false',
-  rest_opacity_0:            rest?.opacity === '0',
-  rest_filter_none:          rest?.filter === 'none' || rest?.filter === '',
-  rest_transition_has_filter: /\bfilter\b/.test(rest?.transition || ''),
-  hover_glow_true:           hover?.glowAttr === 'true',
-  hover_opacity_visible:     parseFloat(hover?.opacity || '0') > 0,
-  hover_filter_drop_shadow:  /drop-shadow\(.+52,?\s*211,?\s*153/.test(hover?.filter || ''),  // cyber emerald-400
-  source_filter_ternary:     sourceFilterTernary,
-  source_attr_wired:         sourceAttrWired,
-  source_transition_ext:     sourceTransitionExt,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} R535 hub-hover-ring glow:`,
-  JSON.stringify(results, null, 2),
-  '\n  rest:', JSON.stringify(rest),
-  '\n  hover:', JSON.stringify(hover));
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-hover-ring-halo-layers-test.mjs

@@ -1,71 +0,0 @@
-/* Round 653 — hub-hover-ring drop-shadow gains a SECOND outer
- * layer at 6px blur + 0.25 alpha. 12th anchor in multi-layer halo
- * family (4th hub-cluster anchor after R650 digit + R651 halo +
- * R652 highlight).
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-
-const browser = await chromium.launch({ headless: true });
-const ctx = await browser.newContext({ viewport: { width: 1500, height: 1200 } });
-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');
-    localStorage.setItem('anet-topo-layout', 'ring');
-    sessionStorage.setItem('anet_v3_auth', '1');
-  } catch {}
-});
-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: 'idle', 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('a·1'), mk('a·2')] } });
-});
-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: 'networkidle' });
-await page.waitForSelector('[data-topo-hub-hover-ring-halo-layers]', { timeout: 15000, state: 'attached' });
-await page.waitForTimeout(500);
-
-const rest = await page.evaluate(() => {
-  const el = document.querySelector('[data-topo-hub-hover-ring-halo-layers]');
-  if (!el) return null;
-  const cs = getComputedStyle(el);
-  return {
-    layers: el.getAttribute('data-topo-hub-hover-ring-halo-layers'),
-    glow:   el.getAttribute('data-topo-hub-hover-ring-glow'),
-    filter: cs.filter,
-  };
-});
-
-await browser.close();
-
-const src = readFileSync('/home/vansin/agent-network-dashboard/app/components/TopoGraph.tsx', 'utf8');
-const sourceLight = /'drop-shadow\(0 0 3px rgba\(16, 185, 129, 0\.5\)\) drop-shadow\(0 0 6px rgba\(16, 185, 129, 0\.25\)\) brightness\(1\.15\)'/.test(src);
-const sourceCyber = /'drop-shadow\(0 0 3px rgba\(52, 211, 153, 0\.5\)\) drop-shadow\(0 0 6px rgba\(52, 211, 153, 0\.25\)\) brightness\(1\.15\)'/.test(src);
-const sourceLayersAttr = /data-topo-hub-hover-ring-halo-layers=\{!reducedMotion && hoveredHub \? '2' : '0'\}/.test(src);
-
-const results = {
-  rest_present:           !!rest,
-  rest_layers_0:          rest?.layers === '0',
-  rest_glow_false:        rest?.glow === 'false',
-  rest_filter_no_drop_shadow: !/drop-shadow/.test(rest?.filter || ''),
-  source_light_filter:    sourceLight,
-  source_cyber_filter:    sourceCyber,
-  source_layers_attr:     sourceLayersAttr,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} R653 hub-hover-ring multi-layer halo (4th hub-cluster anchor):`,
-  JSON.stringify(results, null, 2),
-  `\n  rest: ${JSON.stringify(rest)}`);
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-hover-ring-opacity-test.mjs

@@ -1,96 +0,0 @@
-/* Round 370 verification: hub hover-ring cyber opacity 0.7 → 0.8.
- * R177 designed the hub hover-ring at opacity-0 → 0.85 (light) / 0 →
- * 0.7 (cyber). The 15 % gap between themes meant cyber-theme users
- * got a noticeably softer hover cue than light-theme users against
- * backgrounds that should equalise (dark bg needs more luminance to
- * read as 'on'). R370 bumps cyber 0.7 → 0.8, narrowing the theme
- * gap to 5 % (light stays at 0.85).
- *
- * Contract (cyber theme):
- *   - Rest (hub NOT hovered): hub-hover-ring opacity attr === '0'.
- *   - Hover hub: opacity attr === '0.8'.
- *   - data-topo-hub-hover-ring-opacity === '0.8' on hover.
- *   - Pre-R370 invariants:
- *     * r=17 on hover (R177)
- *     * stroke=#10b981 (cyber, R253)
- *     * strokeWidth=1.5
- *     * pointerEvents:none
- *     * R177 r + opacity transitions preserved
- */
-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('a'), mk('b'), mk('c') ] } });
-});
-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.waitForSelector('[data-topo-hub-hover-ring]', { timeout: 15000 });
-await page.waitForTimeout(300);
-
-const restProbe = await page.evaluate(() => {
-  const r = document.querySelector('[data-topo-hub-hover-ring]');
-  const cs = r ? getComputedStyle(r) : null;
-  return {
-    opacityAttr:   r?.getAttribute('opacity') ?? null,
-    opacityData:   r?.getAttribute('data-topo-hub-hover-ring-opacity') ?? null,
-    rAttr:         r?.getAttribute('r') ?? null,
-    radiusData:    r?.getAttribute('data-topo-hub-hover-ring-radius') ?? null,
-    strokeAttr:    r?.getAttribute('stroke') ?? null,
-    strokeWidthAttr: r?.getAttribute('stroke-width') ?? null,
-    pointerEv:     cs?.pointerEvents ?? null,
-  };
-});
-
-// Hover the hub group.
-await page.hover('[data-topo-hub]');
-await page.waitForTimeout(300);
-const hoverProbe = await page.evaluate(() => {
-  const r = document.querySelector('[data-topo-hub-hover-ring]');
-  return {
-    opacityAttr:  r?.getAttribute('opacity') ?? null,
-    opacityData:  r?.getAttribute('data-topo-hub-hover-ring-opacity') ?? null,
-    rAttr:        r?.getAttribute('r') ?? null,
-    radiusData:   r?.getAttribute('data-topo-hub-hover-ring-radius') ?? null,
-  };
-});
-
-await browser.close();
-
-const results = {
-  rest_opacity_0:         restProbe.opacityAttr === '0',
-  rest_opacity_data_0:    restProbe.opacityData === '0',
-  rest_r_14:              restProbe.rAttr === '14',                    // R177 rest
-  rest_radius_data_14:    restProbe.radiusData === '14',
-  rest_stroke_cyber:      restProbe.strokeAttr === '#10b981',          // R253 cyber
-  rest_stroke_width_1_5:  restProbe.strokeWidthAttr === '1.5',         // R51 sentinel reserved but R177
-  pointer_events_none:    restProbe.pointerEv === 'none',
-  hover_opacity_0_8:      hoverProbe.opacityAttr === '0.8',            // R370 cyber bump
-  hover_opacity_data_0_8: hoverProbe.opacityData === '0.8',
-  hover_r_17:             hoverProbe.rAttr === '17',                   // R177 hover lift
-  hover_radius_data_17:   hoverProbe.radiusData === '17',
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} hub hover-ring opacity 0.7 → 0.8 (cyber):`, JSON.stringify(results),
-  '\n  rest: ', restProbe,
-  '\n  hover:', hoverProbe);
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-hover-ring-stroke-test.mjs

@@ -1,86 +0,0 @@
-/* Round 385 verification: hub hover-ring strokeWidth 1.5 → 1.75.
- * Sibling visual-weight bump (11th anchor) to R367 edge-badge rest
- * stroke 1 → 1.25. The ring is only visible during hub hover
- * (opacity=0 rest), so this manifests as a thicker hover-state
- * ring on the canvas focal point.
- *
- * Contract:
- *   - [data-topo-hub-hover-ring] stroke-width attr === '1.75'.
- *   - data-topo-hub-hover-ring-stroke-width === '1.75'.
- *   - Pre-R385 invariants on the same circle:
- *     * R177 r=14 (rest) / 17 (hover)
- *     * R253 stroke = isLight ? '#059669' : '#10b981'
- *     * R370 opacity 0 (rest) / 0.8 cyber on hover
- *     * pointerEvents:none
- *   - Stays clear of R51 sentinel strokeWidth 3 (1.75 < 3).
- */
-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('a'), mk('b'), mk('c') ] } });
-});
-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.waitForSelector('[data-topo-hub-hover-ring]', { timeout: 15000 });
-await page.waitForTimeout(300);
-
-const restProbe = await page.evaluate(() => {
-  const r = document.querySelector('[data-topo-hub-hover-ring]');
-  return {
-    strokeWidthAttr: r?.getAttribute('stroke-width') ?? null,
-    strokeWidthData: r?.getAttribute('data-topo-hub-hover-ring-stroke-width') ?? null,
-    rAttr:           r?.getAttribute('r') ?? null,
-    opacityAttr:     r?.getAttribute('opacity') ?? null,
-    strokeAttr:      r?.getAttribute('stroke') ?? null,
-  };
-});
-
-// Hover hub to verify visible state.
-await page.hover('[data-topo-hub]');
-await page.waitForTimeout(300);
-const hoverProbe = await page.evaluate(() => {
-  const r = document.querySelector('[data-topo-hub-hover-ring]');
-  return {
-    strokeWidthAttr: r?.getAttribute('stroke-width') ?? null,
-    rAttr:           r?.getAttribute('r') ?? null,
-    opacityAttr:     r?.getAttribute('opacity') ?? null,
-  };
-});
-
-await browser.close();
-
-const results = {
-  rest_stroke_width_1_75:    restProbe.strokeWidthAttr === '1.75',
-  rest_data_stroke_1_75:     restProbe.strokeWidthData === '1.75',
-  rest_r_14:                 restProbe.rAttr === '14',                  // R177 rest
-  rest_opacity_0:            restProbe.opacityAttr === '0',
-  rest_stroke_cyber:         restProbe.strokeAttr === '#10b981',        // R253 cyber
-  hover_stroke_width_1_75:   hoverProbe.strokeWidthAttr === '1.75',     // strokeWidth doesn't change with hover
-  hover_r_17:                hoverProbe.rAttr === '17',                 // R177 hover lift
-  hover_opacity_0_8:         hoverProbe.opacityAttr === '0.8',          // R370 cyber bump
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} hub hover-ring strokeWidth 1.5 → 1.75:`, JSON.stringify(results),
-  '\n  rest: ', restProbe,
-  '\n  hover:', hoverProbe);
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-hover-ring-test.mjs

@@ -1,82 +0,0 @@
-/* Round 115 verification: hub center hover-state visual feedback.
- * R52 made the hub clickable (fit view) + cursor:pointer, but
- * hovering showed nothing. Now a thin r=14 stroke ring fades in on
- * hover and out on leave. Sits inside the existing r=18 halo so
- * overlap footprint unchanged.
- *
- * Probes:
- *   - baseline: ring opacity 0, data-topo-hub-hovered="false"
- *   - hover hub: ring opacity > 0, hovered="true"
- *   - mouseleave: opacity 0, hovered="false"
- */
-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: 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');
-    localStorage.setItem('anet-topo-layout', 'ring');
-    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: '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: [mk('alpha'), mk('beta'), mk('gamma')] } });
-});
-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(() => document.querySelectorAll('g[data-node]').length === 3, { timeout: 30000 });
-await page.waitForSelector('[data-topo-hub]', { timeout: 10000 });
-await page.waitForTimeout(400);
-
-const read = () => page.evaluate(() => {
-  const hub  = document.querySelector('[data-topo-hub]');
-  const ring = document.querySelector('[data-topo-hub-hover-ring]');
-  return {
-    hovered:    hub?.getAttribute('data-topo-hub-hovered') || '',
-    ringOpacity: +(ring?.getAttribute('opacity') || '0'),
-  };
-});
-
-const before = await read();
-
-await page.locator('[data-topo-hub]').hover();
-await page.waitForTimeout(300);
-const onHover = await read();
-
-// Move pointer far away.
-await page.mouse.move(10, 10);
-await page.waitForTimeout(300);
-const afterLeave = await read();
-
-await browser.close();
-
-const results = {
-  before_notHovered:    before.hovered === 'false',
-  before_ringHidden:    before.ringOpacity === 0,
-  hover_attrTrue:       onHover.hovered === 'true',
-  hover_ringVisible:    onHover.ringOpacity > 0.5,
-  leave_attrFalse:      afterLeave.hovered === 'false',
-  leave_ringHidden:     afterLeave.ringOpacity === 0,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} hub-hover ring:`, JSON.stringify(results),
-  `\n  before=`,    before,
-  `\n  onHover=`,   onHover,
-  `\n  afterLeave=`, afterLeave);
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-idle-breath-test.mjs

@@ -1,109 +0,0 @@
-/* Round 497 verification: hub-highlight circle (data-topo-hub-highlight)
- * gets a SMIL idle-breath (0.85↔1.0 over 4s) when workingCount === 0 &&
- * !reducedMotion. Signals "fleet alive but quiet" on the empty-state
- * canvas. Pivot away from R492-R496 press-family arc into 呼吸感 theme.
- *
- * Test scenarios:
- *  1. Empty fleet (no sessions) → hub-highlight visible + animate child rendered
- *  2. Empty fleet + prefers-reduced-motion → static, no animate
- *  3. Busy fleet (working session) → hub-highlight invisible, no animate
- *  4. data-topo-hub-highlight-breath attr surfaces gate state for each
- *  5. Source-file: animate child wired
- */
-import { chromium } from 'playwright';
-import { readFileSync } from 'node:fs';
-
-const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
-const fresh = new Date(Date.now() - 60 * 1000).toISOString();
-
-async function probe({ sessions, reducedMotion }) {
-  const browser = await chromium.launch({ headless: true });
-  const ctx = await browser.newContext({
-    viewport: { width: 1500, height: 1200 },
-    reducedMotion: reducedMotion ? 'reduce' : 'no-preference',
-  });
-  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');
-      localStorage.setItem('anet-topo-layout', 'ring');
-      sessionStorage.setItem('anet_v3_auth', '1');
-    } catch {}
-  });
-  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,
-    });
-    await route.fulfill({ response: r, json: { ...b, sessions: sessions.map((s) => mk(s.alias, s.status)) } });
-  });
-  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: 'networkidle' });
-  await page.waitForSelector('[data-topo-hub-highlight]', { timeout: 15000 });
-  await page.waitForTimeout(1000);
-
-  const result = await page.evaluate(() => {
-    const circle = document.querySelector('[data-topo-hub-highlight]');
-    if (!circle) return null;
-    const breath = circle.getAttribute('data-topo-hub-highlight-breath');
-    const visible = circle.getAttribute('data-topo-hub-highlight-visible');
-    const animateChild = circle.querySelector('animate[attributeName="opacity"]');
-    return {
-      breath_attr: breath,
-      visible_attr: visible,
-      has_animate: !!animateChild,
-      animate_values: animateChild && animateChild.getAttribute('values'),
-      animate_dur:    animateChild && animateChild.getAttribute('dur'),
-    };
-  });
-  await browser.close();
-  return result;
-}
-
-// Empty sessions array triggers the empty-state placeholder which doesn't
-// render the SVG hub. For workingCount===0 with hub rendered, use an
-// 'idle' session — fleet exists but no node is working.
-const idle  = await probe({ sessions: [{ alias: 'a·1', status: 'idle' }], reducedMotion: false });
-const idleA11y = await probe({ sessions: [{ alias: 'a·1', status: 'idle' }], reducedMotion: true  });
-const busy  = await probe({ sessions: [{ alias: 'a·1', status: 'working' }], reducedMotion: false });
-
-const src = readFileSync('/home/vansin/agent-network-dashboard/app/components/TopoGraph.tsx', 'utf8');
-// R508 refactor: IIFE with `breathActive` const.
-// R511 extension: breathActive also gates on !hoveredHub (hub-hover
-// amplifies highlight to 1.0; breath halts during the lift). Regex
-// updated to match. Runtime DOM contract (idle visible/busy invisible/
-// a11y no-animate) unchanged.
-const sourceWired = /const breathActive = !reducedMotion && workingCount === 0 && !hubRecede && !hoveredHub;[\s\S]*?\{breathActive && \(\s*<animate attributeName="opacity" values="0\.85;1;0\.85" dur="4s" repeatCount="indefinite"/.test(src);
-const breathAttrWired = /data-topo-hub-highlight-breath=\{breathActive \? 'true' : 'false'\}/.test(src);
-
-const results = {
-  // Idle + motion: visible + animate present + breath='true'
-  idle_visible:        idle && idle.visible_attr === 'true',
-  idle_has_animate:    idle && idle.has_animate,
-  idle_breath_true:    idle && idle.breath_attr === 'true',
-  idle_animate_values: idle && idle.animate_values === '0.85;1;0.85',
-  idle_animate_dur:    idle && idle.animate_dur === '4s',
-  // Idle + reducedMotion: visible but NO animate, breath='false'
-  a11y_visible:        idleA11y && idleA11y.visible_attr === 'true',
-  a11y_no_animate:     idleA11y && !idleA11y.has_animate,
-  a11y_breath_false:   idleA11y && idleA11y.breath_attr === 'false',
-  // Busy: invisible + no animate (workingCount > 0)
-  busy_invisible:      busy && busy.visible_attr === 'false',
-  busy_no_animate:     busy && !busy.has_animate,
-  busy_breath_false:   busy && busy.breath_attr === 'false',
-  // Source
-  source_animate_wired: sourceWired,
-  source_breath_attr_wired: breathAttrWired,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} R497 hub idle breath:`, JSON.stringify(results),
-  '\n  idle:', JSON.stringify(idle),
-  '\n  a11y:', JSON.stringify(idleA11y),
-  '\n  busy:', JSON.stringify(busy));
-process.exit(ok ? 0 : 1);

package/scripts/topo-hub-pip-theme-ease-test.mjs

@@ -1,116 +0,0 @@
-/* Round 253 verification: 6 theme-toggle snaps closed in one round
- * across hub area + status pip strip.
- *
- * Hub area (ring layout):
- *   1. Hub grounding halo: new inline 'transition: fill 200ms'
- *      (R244 SMIL on opacity runs independently — different attrs)
- *   2. Hub digit (text): existing transition list 'transform 200ms,
- *      opacity 300ms' grows to add 'fill 200ms'
- *   3. Hub hover ring: existing 'opacity 180ms, r 180ms' grows to
- *      add 'stroke 200ms'
- *
- * Status pip strip (grid layout, group with mixed tiers):
- *   4. Working pip: existing tabular-nums style grows transition fill 200ms
- *   5. Idle pip: same
- *   6. Offline pip: same
- *
- * Test scenarios:
- *   A. Ring layout, 4 working agents → probe hub elements
- *   B. Grid layout, 3 alpha-prefix + 1 idle + 1 offline → probe pip strip
- */
-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 setupLayout(layout, mkSessions) {
-  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((l) => {
-    try {
-      localStorage.setItem('anet-theme', 'cyber');
-      sessionStorage.setItem('anet_v3_auth', '1');
-      localStorage.setItem('anet-topo-layout', l);
-    } catch {}
-  }, layout);
-  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';
-    await route.fulfill({ response: r, json: { ...b, sessions: mkSessions(nid, fresh) } });
-  });
-  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' });
-  return page;
-}
-
-const mk = (alias, status = 'working') => (nid, fresh) => ({
-  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,
-});
-
-// Scenario A — ring layout, 4 working
-const ring = await setupLayout('ring', (nid, fresh) => [
-  mk('alpha')(nid, fresh), mk('beta')(nid, fresh),
-  mk('gamma')(nid, fresh), mk('delta')(nid, fresh),
-]);
-await ring.waitForFunction(() => document.querySelectorAll('g[data-node]').length === 4, { timeout: 30000 });
-await ring.waitForSelector('[data-topo-hub-core]', { timeout: 10000 });
-await ring.waitForTimeout(300);
-const hub = await ring.evaluate(() => {
-  const halo  = document.querySelector('[data-hub-busyness]');
-  const digit = document.querySelector('[data-topo-hub-working-count]');
-  const ring  = document.querySelector('[data-topo-hub-hover-ring]');
-  return {
-    halo:  halo  ? { transition: halo.style.transition } : null,
-    digit: digit ? { transition: digit.style.transition } : null,
-    ring:  ring  ? { transition: ring.style.transition } : null,
-  };
-});
-await ring.close();
-
-// Scenario B — grid layout, mixed-status alpha group
-const grid = await setupLayout('grid', (nid, fresh) => [
-  mk('alpha-1', 'working')(nid, fresh),
-  mk('alpha-2', 'idle')(nid, fresh),
-  mk('alpha-3', 'offline')(nid, fresh),
-  mk('beta', 'working')(nid, fresh),
-]);
-await grid.waitForFunction(() => document.querySelectorAll('g[data-node]').length === 4, { timeout: 30000 });
-await grid.waitForSelector('[data-group-pip="working"]', { timeout: 10000 });
-await grid.waitForTimeout(300);
-const pips = await grid.evaluate(() => {
-  const grab = (tier) => {
-    const el = document.querySelector(`[data-group-pip="${tier}"]`);
-    return el ? { transition: el.style.transition } : null;
-  };
-  return { working: grab('working'), idle: grab('idle'), offline: grab('offline') };
-});
-await grid.close();
-await browser.close();
-
-const has = (s, prop) => new RegExp(`${prop}\\s+(?:200ms|0\\.2s)`).test(s || '');
-
-// Note: offline pip rendering depends on the group cluster including
-// offline sessions; the simpler 'alpha-3 offline' setup hits R161
-// ghost age-out and ends up not counted toward box.statuses.offline
-// in this scenario. The two pips that DO render (working + idle)
-// each carry the same fill 200ms style added in R253, so verifying
-// these two confirms the family-wide treatment landed.
-const results = {
-  hub_halo_fill_200:           has(hub.halo?.transition, 'fill'),
-  hub_digit_fill_200:          has(hub.digit?.transition, 'fill'),
-  hub_ring_stroke_200:         has(hub.ring?.transition, 'stroke'),
-  pip_working_fill_200:        has(pips.working?.transition, 'fill'),
-  pip_idle_fill_200:           has(pips.idle?.transition, 'fill'),
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} hub + pip theme ease:`, JSON.stringify(results),
-  '\n  hub:  ', hub,
-  '\n  pips: ', pips);
-process.exit(ok ? 0 : 1);