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

package/scripts/topo-group-pill-glow-test.mjs

@@ -1,76 +0,0 @@
-/* Round 544 verification: group filter pill gains cyan-accent drop-
- * shadow when rendered (pin-active visual). Sibling to R543 status pill.
- *
- * Test strategy: source-canonical because group-label click via Playwright
- * is impractical (banked R538/R544 lesson — SVG hit-test intercept).
- * Source regex confirms the wiring; rest-state DOM probe confirms pill
- * is absent when unpinned (baseline behavior unchanged).
- *
- * Test phases:
- *   1. unpinned (default): no [data-active-filter="group"] element
- *   2. source-side regex confirms filter wired with pal.legendAccent
- *      via color-mix 60% syntax
- */
-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', 'grid');
-    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: [
-    mk('alpha·1', 'working'), mk('alpha·2', 'working'),
-    mk('beta·1', 'idle'),    mk('beta·2', 'idle'),
-  ] } });
-});
-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-group-label]', { timeout: 15000 });
-await page.waitForTimeout(500);
-
-const unpinned = await page.evaluate(() =>
-  document.querySelector('[data-active-filter="group"]') !== null
-);
-
-await browser.close();
-
-const src = readFileSync('/home/vansin/agent-network-dashboard/app/components/TopoGraph.tsx', 'utf8');
-const sourceFilterWired =
-  /filter: `drop-shadow\(0 0 3px color-mix\(in srgb, \$\{pal\.legendAccent\} 60%, transparent\)\)`,/.test(src);
-
-// Confirm we edited the GROUP pill specifically (data-active-filter="group")
-// — look for the filter wiring within the group-pill scope by matching
-// the surrounding setPinnedGroup handler.
-const groupPillScope = src.match(/onClick=\{\(\) => setPinnedGroup\(null\)\}[\s\S]{0,2500}/)?.[0] || '';
-const groupPillHasFilter = /filter: `drop-shadow\(0 0 3px color-mix\(in srgb, \$\{pal\.legendAccent\} 60%, transparent\)\)`,/.test(groupPillScope);
-
-const results = {
-  unpinned_pill_absent:    unpinned === false,
-  source_filter_wired:     sourceFilterWired,
-  source_group_pill_scope: groupPillHasFilter,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} R544 group filter pill glow (source-canonical):`,
-  JSON.stringify(results, null, 2),
-  '\n  unpinned absent:', unpinned);
-process.exit(ok ? 0 : 1);

package/scripts/topo-group-pin-test.mjs

@@ -1,119 +0,0 @@
-/* Round 63 verification: clicking the group label pins the group focus
- * via pinnedGroup. activeGroup = hoveredGroup ?? pinnedGroup is read by
- * the R8 inFocus dim mechanic and the R53 in-group edge boost.
- *
- *  - Click a group label → that group's nodes stay bright, others dim
- *    via the existing inFocus formula (opacity 0.32).
- *  - Move mouse away → pin persists (transient hover cleared).
- *  - In-group edge between OTHER team members brightens 1.3× even
- *    without an alias hover.
- *  - Esc clears the pin (R62 extended).
- *  - aria-pressed flips on the group <text>.
- */
-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: 1280, 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', 'grid');
-    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 = [
-    { alias: 'alpha1', status: 'idle', network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
-    { alias: 'alpha2', status: 'idle', network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
-    { alias: 'alpha3', status: 'idle', network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
-    { alias: 'beta',   status: 'idle', network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
-  ];
-  await route.fulfill({ response: r, json: { ...b, sessions } });
-});
-const now = new Date().toISOString();
-await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [
-  // alpha2 → alpha3: both in alpha group, neither is the pinned-group's "exact alias"
-  { from_alias: 'alpha2', to_alias: 'alpha3', content: 'm', created_at: now },
-  // alpha1 → beta: alpha1 in pinned group, beta outside → should dim
-  { from_alias: 'alpha1', to_alias: 'beta', content: 'm', created_at: now },
-] } }));
-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 === 4, { timeout: 30000 });
-await page.waitForTimeout(600);
-
-const nodeOpacities = () => page.evaluate(() => {
-  const o = {};
-  for (const a of ['alpha1', 'alpha2', 'alpha3', 'beta']) {
-    const g = document.querySelector(`g[data-node="${a}"]`);
-    o[a] = g ? +(g.style.opacity || '1') : null;
-  }
-  return o;
-});
-const edgeOpacities = () => page.evaluate(() => {
-  const svg = document.querySelector('svg[viewBox="0 0 1000 680"]');
-  const out = {};
-  for (const g of svg.querySelectorAll(':scope > g > g')) {
-    const t = g.querySelector('path[data-edge-hitbox] title');
-    if (!t) continue;
-    const route = (t.textContent || '').split('\n')[0];
-    const base = [...g.querySelectorAll(':scope > path')].find(
-      p => !p.hasAttribute('data-edge-hitbox') && p.hasAttribute('marker-end')
-    );
-    if (base) out[route] = +base.getAttribute('opacity');
-  }
-  return out;
-});
-
-const before = await nodeOpacities();
-const beforeEdges = await edgeOpacities();
-
-// Click the alpha group label via its R63 hitbox wrapper.
-const alphaLabel = page.locator('g[data-group-label-hit="alpha"]').first();
-const exists = await alphaLabel.count() > 0;
-if (!exists) { console.log('❌ alpha group label hit not found'); process.exit(1); }
-await alphaLabel.click({ force: true });
-// Mouse away so we observe pin-only state.
-await page.mouse.move(10, 10);
-await page.waitForTimeout(300);
-const afterPinNodes = await nodeOpacities();
-const afterPinEdges = await edgeOpacities();
-const ariaPressed = await page.evaluate(() => document.querySelector('g[data-group-label-hit="alpha"]')?.getAttribute('aria-pressed'));
-
-// Esc to release.
-await page.evaluate(() => document.activeElement && typeof document.activeElement.blur === 'function' && document.activeElement.blur());
-await page.keyboard.press('Escape');
-await page.waitForTimeout(300);
-const afterEscNodes = await nodeOpacities();
-const ariaAfterEsc = await page.evaluate(() => document.querySelector('g[data-group-label-hit="alpha"]')?.getAttribute('aria-pressed'));
-
-await browser.close();
-
-const bright = (v) => v != null && v >= 0.55;
-const dim    = (v) => v != null && v < 0.4;
-const results = {
-  before_baseline:           bright(before.alpha1) && bright(before.alpha2) && bright(before.alpha3) && bright(before.beta),
-  pin_keepsAlphaTeam:        bright(afterPinNodes.alpha1) && bright(afterPinNodes.alpha2) && bright(afterPinNodes.alpha3),
-  pin_dimsBeta:              dim(afterPinNodes.beta),
-  pin_ariaPressed:           ariaPressed === 'true',
-  pin_inGroupEdgeBoosts:     afterPinEdges['alpha2 → alpha3'] > beforeEdges['alpha2 → alpha3'] * 1.15,
-  pin_leavingEdgeDims:       afterPinEdges['alpha1 → beta'] < beforeEdges['alpha1 → beta'] * 0.6,
-  esc_releasesPin:           bright(afterEscNodes.alpha1) && bright(afterEscNodes.beta),
-  esc_ariaBackToFalse:       ariaAfterEsc === 'false',
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} group pin:`, JSON.stringify(results),
-  `\n  before nodes=`, before, ` edges=`, beforeEdges,
-  `\n  afterPin nodes=`, afterPinNodes, ` edges=`, afterPinEdges, ` aria=${ariaPressed}`,
-  `\n  afterEsc nodes=`, afterEscNodes, ` aria=${ariaAfterEsc}`);
-process.exit(ok ? 0 : 1);

package/scripts/topo-group-pip-fadein-test.mjs

@@ -1,104 +0,0 @@
-/* Round 207 verification: group box label status pip tspans
- * (`2w`, `1i`, `1o`) get anet-fade-in on mount. Pre-R207 a tier
- * crossing 0 → 1+ snap-popped its tspan into the group label;
- * R207 eases the entrance the same way R203 did for recent rows.
- *
- * Group boxes only render in grid layout when sessions share a
- * ≥2-char alias prefix (computeGroups union-find).
- *
- * Test:
- *   Mock 4 sessions: alpha-1 working, alpha-2 idle, beta-1 working,
- *   beta-2 working. Two groups form:
- *     alpha · 1 working + 1 idle (both pips fire)
- *     beta  · 2 working          (only working pip fires)
- *   Switch to grid layout via the R163 toggle, wait for group boxes.
- *   Probe:
- *     1. >=3 [data-group-pip] elements present (alpha working +
- *        alpha idle + beta working)
- *     2. No [data-group-pip="offline"] (offline tier is empty)
- *     3. Every pip's className includes 'anet-fade-in'
- *     4. CSS animationName resolves to 'anet-fade-in'
- *     5. tspan textContent matches digit+letter pattern (e.g.
- *        '2w', '1i')
- */
-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, status) => ({
-    alias, status, 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: [
-    // R319 fixture: both groups must be multi-tier so all tier pips
-    // render. Pre-R319 beta was 2 working (single-tier) and its pip
-    // rendered fine; post-R319 a tier pip is dropped when its count
-    // equals box.count, so beta needs idle to remain multi-tier here.
-    mk('alpha-1', 'working'),
-    mk('alpha-2', 'idle'),
-    mk('beta-1',  'working'),
-    mk('beta-2',  'idle'),
-  ] } });
-});
-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(() => document.querySelectorAll('g[data-node]').length === 4, { timeout: 30000 });
-await page.waitForSelector('[data-topo-chrome-layout="grid"]', { timeout: 10000 });
-await page.waitForTimeout(200);
-
-// Switch to grid layout to trigger groupBoxes rendering
-await page.click('[data-topo-chrome-layout="grid"]');
-await page.waitForTimeout(600);  // R170 layout-switch crossfade + group derivation
-await page.waitForSelector('[data-group-pip]', { timeout: 5000 });
-await page.waitForTimeout(300);
-
-const pips = await page.evaluate(() => {
-  return [...document.querySelectorAll('[data-group-pip]')].map(el => {
-    const cs = getComputedStyle(el);
-    return {
-      tier:          el.getAttribute('data-group-pip'),
-      text:          el.textContent,
-      className:     el.getAttribute('class') || '',
-      animationName: cs.animationName,
-    };
-  });
-});
-
-await browser.close();
-
-const working = pips.filter(p => p.tier === 'working');
-const idleP   = pips.filter(p => p.tier === 'idle');
-const offline = pips.filter(p => p.tier === 'offline');
-
-const has = (s, c) => (s || '').split(/\s+/).includes(c);
-
-const results = {
-  at_least_three_pips:       pips.length >= 3,
-  has_working_pip:            working.length >= 2,  // alpha + beta both have working
-  has_idle_pip:               idleP.length >= 1,    // alpha has 1 idle
-  no_offline_pip:             offline.length === 0,
-  all_have_fadein_class:      pips.every(p => has(p.className, 'anet-fade-in')),
-  all_have_animation_bound:   pips.every(p => /anet-fade-in/i.test(p.animationName)),
-  text_format_correct:        pips.every(p => /^\d+[wio]$/.test(p.text || '')),
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} group pip fade-in:`, JSON.stringify(results),
-  `\n  pips:`, pips);
-process.exit(ok ? 0 : 1);

package/scripts/topo-group-pip-fontsize-test.mjs

@@ -1,106 +0,0 @@
-/* Round 458 verification: status pip strip fontSize 11 → 8 + dx
- * 8/4/4 → 6/3/3, to scale-match the new 9px label that N站牛/codex
- * preview.125 shipped (Hero D #147 Option C: label fontSize 13→9,
- * opacity 0.55 rest / 1 hover+pin, count tspan 11→8). R458 closes
- * the pip-strip leg of the same family.
- *
- * Contract:
- *   - every <tspan data-group-pip="working|idle|offline">
- *     reports font-size '8' (down from '11')
- *   - source-file dx values for the 3 pips are '6'/'3'/'3'
- *     (down from '8'/'4'/'4')
- *   - parent <text data-group-label> font-size stays '9' (codex
- *     preview.125 baseline preserved — R458 is a follow-on, not a
- *     replacement)
- *   - count tspan font-size stays '8' (codex preview.125 baseline)
- */
-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', 'grid');
-    sessionStorage.setItem('anet_v3_auth', '1');
-  } catch {}
-});
-// Fixture: 2 prefix groups, each MIXED (so at least one pip
-// renders — R319 drops pips when count===box.count).
-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: [
-    mk('alpha·1', 'working'),
-    mk('alpha·2', 'idle'),
-    mk('alpha·3', 'offline'),
-    mk('beta·1',  'working'),
-    mk('beta·2',  'idle'),
-  ] } });
-});
-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-group-label]', { timeout: 15000 });
-await page.waitForTimeout(500);
-
-const probe = await page.evaluate(() => {
-  const pips = [...document.querySelectorAll('[data-group-pip]')].map(t => ({
-    tier: t.getAttribute('data-group-pip'),
-    fontSize: t.getAttribute('font-size'),
-    text: t.textContent,
-  }));
-  const labels = [...document.querySelectorAll('[data-group-label]')].map(t => ({
-    key: t.getAttribute('data-group-label'),
-    fontSize: t.getAttribute('font-size'),
-  }));
-  const counts = [...document.querySelectorAll('[data-group-label-count]')].map(t => ({
-    key: t.getAttribute('data-group-label-count'),
-    fontSize: t.getAttribute('font-size'),
-  }));
-  return { pips, labels, counts };
-});
-
-const src = readFileSync('/home/vansin/agent-network-dashboard/app/components/TopoGraph.tsx', 'utf8');
-// dx values for the 3 pips — the source file uses dx="6" then dx="3" twice
-const dxWorking = /data-group-pip="working"[\s\S]{0,400}?dx="6"/.test(src) ||
-                  /dx="6"[\s\S]{0,400}?data-group-pip="working"/.test(src);
-const dxIdle    = /data-group-pip="idle"[\s\S]{0,400}?dx="3"/.test(src) ||
-                  /dx="3"[\s\S]{0,400}?data-group-pip="idle"/.test(src);
-const dxOffline = /data-group-pip="offline"[\s\S]{0,400}?dx="3"/.test(src) ||
-                  /dx="3"[\s\S]{0,400}?data-group-pip="offline"/.test(src);
-
-await browser.close();
-
-const allPipsAre8 = probe.pips.length >= 2 && probe.pips.every(p => p.fontSize === '8');
-const labelStays9 = probe.labels.length >= 2 && probe.labels.every(l => l.fontSize === '9');
-const countStays8 = probe.counts.length >= 2 && probe.counts.every(c => c.fontSize === '8');
-
-const results = {
-  pips_count_ge_2:       probe.pips.length >= 2,
-  pips_all_fontsize_8:   allPipsAre8,
-  labels_stay_9:         labelStays9,
-  counts_stay_8:         countStays8,
-  dx_working_is_6:       dxWorking,
-  dx_idle_is_3:          dxIdle,
-  dx_offline_is_3:       dxOffline,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} group pip fontSize scale-match:`, JSON.stringify(results),
-  '\n  pips:', JSON.stringify(probe.pips),
-  '\n  labels:', JSON.stringify(probe.labels),
-  '\n  counts:', JSON.stringify(probe.counts));
-process.exit(ok ? 0 : 1);

package/scripts/topo-group-pip-singletier-drop-test.mjs

@@ -1,131 +0,0 @@
-/* Round 319 verification: prefix-group label drops the redundant
- * tier pip when its count equals box.count (single-tier groups).
- *
- * Vincent telegram 5304 (2026-05-16) flagged real-data screenshot
- * with `ai-insight · 6 6i`, `blueleap · 3 3i`, `P站 · 4 4i` as
- * 比较难看 — the same number was visually doubled (total chip "·N"
- * + tier pip "Ni") whenever a group was single-tier.
- *
- * R319: tier pip is now conditionally rendered with both
- *   `box.statuses.{tier} > 0` AND `box.statuses.{tier} !== box.count`
- * so single-tier groups collapse to `· N` (no duplicated digit).
- * Multi-tier groups keep all pips — the breakdown is genuinely
- * additional info there.
- *
- * Fixture:
- *   - alpha-1..alpha-3: all working (single-tier, count=3, working=3)
- *   - beta-1, beta-2: working; beta-3, beta-4: idle (multi-tier)
- *
- * Contract:
- *   - alpha group: no [data-group-pip="working"] tspan (dropped because
- *     working === count)
- *   - alpha group: still has [data-group-label-count] with value=3
- *     (R229 total chip untouched)
- *   - beta group: has [data-group-pip="working"] AND [data-group-pip="idle"]
- *     (multi-tier — both pips render because neither equals count)
- *   - beta group: [data-group-label-count-value]=4 still rendered
- *   - R317 inactive Layout toggle gray-400 + R318 active font-medium
- *     + R294 pulse absent all 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');
-    localStorage.setItem('anet-topo-layout', 'grid');
-  } 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, 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: [
-    // alpha — single-tier (all working, count=3)
-    mk('alpha-1', 'working'),
-    mk('alpha-2', 'working'),
-    mk('alpha-3', 'working'),
-    // beta — multi-tier (2 working + 2 idle, count=4)
-    mk('beta-1', 'working'),
-    mk('beta-2', 'working'),
-    mk('beta-3', 'idle'),
-    mk('beta-4', 'idle'),
-  ] } });
-});
-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 === 7, { timeout: 30000 });
-await page.waitForSelector('[data-group-label-count]', { timeout: 10000, state: 'attached' });
-await page.waitForTimeout(500);
-
-const probe = await page.evaluate(() => {
-  // Find each group's <text data-group-label> wrapper and its pip
-  // children + count tspan.
-  const labels = Array.from(document.querySelectorAll('[data-group-label]'));
-  const byGroup = {};
-  for (const label of labels) {
-    const key = label.getAttribute('data-group-label');
-    const countTspan  = label.querySelector('[data-group-label-count]');
-    const pips        = Array.from(label.querySelectorAll('[data-group-pip]'));
-    byGroup[key] = {
-      hasCountTspan: !!countTspan,
-      countValue:    countTspan?.getAttribute('data-group-label-count-value') ?? null,
-      pipTiers:      pips.map(p => p.getAttribute('data-group-pip')),
-      pipTexts:      pips.map(p => p.textContent),
-    };
-  }
-  return {
-    groups: byGroup,
-    r317InactiveLayoutCls:
-      document.querySelector('[data-topo-chrome-layout="grid"]')?.className ?? '',
-    r317ActiveLayoutCls:
-      document.querySelector('[data-topo-chrome-layout="ring"]')?.className ?? '',
-    pulseCount: document.querySelectorAll('[data-pulse-wrapper]').length,
-  };
-});
-await browser.close();
-
-// R106 cluster algorithm preserves the trailing separator in the
-// group key (e.g. alpha-1/2/3 → key 'alpha-'); match by prefix.
-const alpha = probe.groups['alpha-'] || probe.groups['alpha'] || null;
-const beta  = probe.groups['beta-']  || probe.groups['beta']  || null;
-
-const results = {
-  alpha_group_found:           alpha !== null,
-  alpha_has_count_tspan:       alpha?.hasCountTspan === true,
-  alpha_count_value_3:         alpha?.countValue === '3',
-  alpha_no_working_pip:        !alpha?.pipTiers.includes('working'),
-  alpha_no_pips_at_all:        alpha?.pipTiers.length === 0,
-  beta_group_found:            beta !== null,
-  beta_has_count_tspan:        beta?.hasCountTspan === true,
-  beta_count_value_4:          beta?.countValue === '4',
-  beta_has_working_pip:        beta?.pipTiers.includes('working'),
-  beta_has_idle_pip:           beta?.pipTiers.includes('idle'),
-  beta_no_offline_pip:         !beta?.pipTiers.includes('offline'),
-  // R317 regression — Layout toggle inactive Grid is the layout-active
-  // here (we forced grid via initScript), so check that Ring is the
-  // INACTIVE one with text-gray-400. After R318, the ACTIVE button
-  // (grid) has font-medium.
-  r317_ring_inactive_gray_400: probe.r317ActiveLayoutCls.includes('text-gray-400'),
-  r318_grid_active_font_medium: probe.r317InactiveLayoutCls.includes('font-medium'),
-  r294_pulse_absent:           probe.pulseCount === 0,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} group-pip single-tier drop:`, JSON.stringify(results),
-  '\n  alpha:', alpha,
-  '\n  beta:',  beta);
-process.exit(ok ? 0 : 1);

package/scripts/topo-group-pip-tabular-test.mjs

@@ -1,95 +0,0 @@
-/* Round 230 verification: R58 status mix pip strip tspans
- * ([data-group-pip='working|idle|offline']) get fontVariantNumeric:
- * 'tabular-nums' so the digit doesn't jitter the dx-offset pip
- * chain at the 9→10 boundary.
- *
- * Scenario: 1 group with mixed tiers — alpha-1/2 working, alpha-3
- * idle, alpha-4 offline. R106 cluster forms one alpha- group with
- * box.statuses.working=2, idle=1, offline=1 → all three pips
- * present.
- *
- * Verifies each pip:
- *   getComputedStyle.fontVariantNumeric contains 'tabular-nums'
- *   text matches the expected '{N}{tier-letter}' shape
- *   fill is tier-specific (color check — sanity)
- */
-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');
-    localStorage.setItem('anet-topo-layout', 'grid');
-  } 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, 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: [
-    mk('alpha-1', 'working'),
-    mk('alpha-2', 'working'),
-    mk('alpha-3', 'idle'),
-    mk('alpha-4', 'offline'),
-  ] } });
-});
-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(() => document.querySelectorAll('g[data-node]').length === 4, { timeout: 30000 });
-await page.waitForSelector('[data-group-pip="working"]', { timeout: 10000, state: 'attached' });
-await page.waitForTimeout(400);
-
-const out = await page.evaluate(() => {
-  const grab = (tier) => {
-    const el = document.querySelector(`[data-group-pip="${tier}"]`);
-    if (!el) return null;
-    return {
-      tier,
-      text:           el.textContent,
-      fontVarNumeric: getComputedStyle(el).fontVariantNumeric,
-      fill:           getComputedStyle(el).fill,
-    };
-  };
-  return {
-    working: grab('working'),
-    idle:    grab('idle'),
-    offline: grab('offline'),
-  };
-});
-await browser.close();
-
-const hasTab = (s) => /tabular-nums/.test(s || '');
-
-const results = {
-  working_present:   out.working !== null,
-  working_text:      out.working?.text === '2w',
-  working_tabular:   hasTab(out.working?.fontVarNumeric),
-  idle_present:      out.idle !== null,
-  idle_text:         out.idle?.text === '1i',
-  idle_tabular:      hasTab(out.idle?.fontVarNumeric),
-  offline_present:   out.offline !== null,
-  offline_text:      out.offline?.text === '1o',
-  offline_tabular:   hasTab(out.offline?.fontVarNumeric),
-  // Sanity: tier-specific fills still distinct from each other
-  fills_distinct:    out.working && out.idle && out.offline &&
-                     new Set([out.working.fill, out.idle.fill, out.offline.fill]).size === 3,
-};
-const ok = Object.values(results).every(Boolean);
-console.log(`${ok ? '✅' : '❌'} group-pip tabular:`, JSON.stringify(results),
-  '\n  pips:', out);
-process.exit(ok ? 0 : 1);