@sleep2agi/agent-network-dashboard 0.4.6-preview.99 → 0.5.0

package/scripts/topo-minimap-viewport-smooth-test.mjs

@@ -0,0 +1,124 @@
+/* Round 199 verification: minimap viewport rect transitions x/y/w/h
+ * during R169 smoothView (discrete zoom +/− and reset). Closes the
+ * rhythm-mismatch R198 just fixed for minimap dots — now extended to
+ * the rectangle that frames them.
+ *
+ * Pre-R199 a click on zoom-in crossfaded the main canvas over R168's
+ * 280ms but the minimap viewport rect snap-cut to its new dimensions
+ * in one frame. R199 gates a `transition: x/y/w/h 280ms` on
+ * smoothView=true so discrete zooms ease the rect smoothly. Drag-pan
+ * and wheel-zoom (smoothView=false) keep snappy response — a
+ * persistent transition during drag would lag the cursor by 280ms.
+ *
+ * Test:
+ *   1. Open page with 4 sessions, zoom in once to mount minimap.
+ *   2. Idle (smoothView=false): rect has
+ *      data-topo-minimap-viewport-smooth='false', style.transition='none'.
+ *   3. Click zoom-in again → smoothView arms to 'true' for ~350ms.
+ *   4. Within 100ms of click: probe rect →
+ *      data-topo-minimap-viewport-smooth='true', style.transition
+ *      includes 'x 280ms', 'y 280ms', 'width 280ms', 'height 280ms'.
+ *   5. Wait past 400ms → smoothView clears → back to 'false', no
+ *      transition.
+ */
+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: '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'), mk('delta'),
+  ] } });
+});
+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 === 4, { timeout: 30000 });
+await page.waitForSelector('[data-topo-chrome-zoom-in]', { timeout: 10000 });
+await page.waitForTimeout(300);
+
+// First zoom-in mounts the minimap. Wait past the 350ms smoothView
+// timer so the minimap rect is at idle state (smooth='false') before
+// we probe.
+await page.click('[data-topo-chrome-zoom-in]');
+await page.waitForTimeout(450);
+await page.waitForSelector('[data-topo-minimap-viewport]', { timeout: 5000 });
+
+const probe = async () => page.evaluate(() => {
+  const el = document.querySelector('[data-topo-minimap-viewport]');
+  if (!el) return null;
+  return {
+    smooth:     el.getAttribute('data-topo-minimap-viewport-smooth'),
+    transition: el.style.transition,
+    x:          parseFloat(el.getAttribute('x') || ''),
+    y:          parseFloat(el.getAttribute('y') || ''),
+    w:          parseFloat(el.getAttribute('width')  || ''),
+    h:          parseFloat(el.getAttribute('height') || ''),
+  };
+});
+
+const idle = await probe();
+
+// Click zoom-in once more — arms smoothView for ~350ms — and probe
+// within the arming window.
+await page.click('[data-topo-chrome-zoom-in]');
+await page.waitForTimeout(80);  // well inside the 350ms arming window
+const armed = await probe();
+
+await page.waitForTimeout(420);  // past 350ms timer + transition
+const settled = await probe();
+
+await browser.close();
+
+const hasAllAxes = (s) =>
+  /\bx\s+(?:280ms|0\.28s)/.test(s || '') &&
+  /\by\s+(?:280ms|0\.28s)/.test(s || '') &&
+  /\bwidth\s+(?:280ms|0\.28s)/.test(s || '') &&
+  /\bheight\s+(?:280ms|0\.28s)/.test(s || '');
+
+const results = {
+  idle_smooth_false:           idle?.smooth === 'false',
+  idle_transition_none:        idle?.transition === 'none' || idle?.transition === '',
+  idle_has_dimensions:         idle && Number.isFinite(idle.x) && Number.isFinite(idle.w) && idle.w > 0,
+
+  armed_smooth_true:           armed?.smooth === 'true',
+  armed_transition_present:    !!armed?.transition && armed.transition !== 'none',
+  armed_transition_has_all:    hasAllAxes(armed?.transition),
+
+  settled_smooth_false:        settled?.smooth === 'false',
+  settled_transition_none:     settled?.transition === 'none' || settled?.transition === '',
+
+  // R199 actually changed dimensions between idle (zoom 120%) and
+  // settled (zoom 144% after second click), or x/y diverged.
+  zoom_changed_dimensions:     idle && settled && (
+    Math.abs(idle.w - settled.w) > 1 ||
+    Math.abs(idle.h - settled.h) > 1 ||
+    Math.abs(idle.x - settled.x) > 1 ||
+    Math.abs(idle.y - settled.y) > 1
+  ),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} minimap viewport smooth:`, JSON.stringify(results),
+  `\n  idle:`,    idle,
+  `\n  armed:`,   armed,
+  `\n  settled:`, settled);
+process.exit(ok ? 0 : 1);

package/scripts/topo-monogram-font-test.mjs

@@ -0,0 +1,112 @@
+/* Round 284 verification: known-vendor monogram letter fontFamily
+ * swaps monospace → system sans-serif. Continuation of R283 Vincent
+ * 5216 vendor avatar polish arc.
+ *
+ * Contract:
+ *   - Known vendor (Anthropic, OpenAI, …) monogram letter — rendered
+ *     fontFamily resolves into a sans-serif stack (NOT monospace).
+ *     The actual computed font-family will likely return the OS-
+ *     preferred match such as -apple-system / Segoe UI / Inter / etc.
+ *     (We assert it does NOT include 'monospace' as the active stack.)
+ *   - data-monogram-letter attribute present on the <text> element
+ *     with the vendor.initial as its value.
+ *   - Prefix-group fallback (unknown vendor) keeps monospace — the
+ *     R283 contrast pattern: designed glyph = known, code text =
+ *     unknown.
+ *   - R283 monogram stroke=1.5 still in place (regression).
+ *   - R282 watermark still present (regression).
+ */
+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, model) => ({
+    alias, status: 'working', model, 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', 'claude-opus-4'),    // Anthropic → monogram (sans-serif)
+    mk('beta',  'gpt-4o'),            // OpenAI → monogram (sans-serif)
+    mk('gamma', null),                 // unknown → prefix-group (monospace)
+    mk('delta', null),                 // unknown
+  ] } });
+});
+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-monogram-letter]', { timeout: 10000, state: 'attached' });
+await page.waitForTimeout(300);
+
+const probe = await page.evaluate(() => {
+  // All monogram letters carry data-monogram-letter; expect 2 (alpha + beta).
+  const monos = [...document.querySelectorAll('[data-monogram-letter]')];
+  const monoSamples = monos.map((t) => ({
+    letter:    t.getAttribute('data-monogram-letter'),
+    family:    getComputedStyle(t).fontFamily,
+    weight:    getComputedStyle(t).fontWeight,
+    parentAlias: t.closest('g[data-node]')?.getAttribute('data-node') ?? null,
+  }));
+  // Find prefix-group fallback text — inside g[data-node='gamma'], the
+  // <text> WITHOUT data-monogram-letter attribute (the prefix-group one).
+  const gammaNode = document.querySelector('g[data-node="gamma"]');
+  const gammaTexts = gammaNode ? [...gammaNode.querySelectorAll('text')] : [];
+  // The avatar text is the one inside the avatar IIFE — look for the
+  // text whose font-size matches avatar radius (~10-14) and is centered
+  // on the node. Easiest heuristic: text-anchor=middle, no data-monogram
+  // attr (so it's the unknown-vendor branch).
+  const prefixText = gammaTexts.find((t) =>
+    t.getAttribute('text-anchor') === 'middle' &&
+    !t.hasAttribute('data-monogram-letter')
+  );
+  const prefixFamily = prefixText ? getComputedStyle(prefixText).fontFamily : null;
+  // Also probe alpha monogram circle stroke (R283 regression).
+  const alphaNode = document.querySelector('g[data-node="alpha"]');
+  const alphaCircles = alphaNode ? [...alphaNode.querySelectorAll('circle')] : [];
+  const alphaAvatarCircle = alphaCircles
+    .map(c => ({ r: +c.getAttribute('r') || 0, sw: c.getAttribute('stroke-width'), isBadge: c.hasAttribute('data-runtime-badge') }))
+    .filter(c => c.r > 0 && c.r < 18 && !c.isBadge)
+    .sort((a, b) => b.r - a.r)[0];
+  const watermark = document.querySelector('[data-topo-brand-watermark]');
+  return {
+    monoSamples,
+    prefixFamily,
+    alphaAvatarStroke: alphaAvatarCircle?.sw ?? null,
+    watermarkPresent: watermark !== null,
+  };
+});
+await browser.close();
+
+const isMonospace = (s) => /(^|,)\s*monospace\s*(,|$)|"monospace"/i.test(s || '');
+const isSansSerif = (s) => /(sans-serif|system|Inter|Segoe|Helvetica|Arial|-apple-system|BlinkMac)/i.test(s || '');
+
+const results = {
+  two_monograms:                   probe.monoSamples.length === 2,
+  alpha_letter_A:                  probe.monoSamples.some(s => s.parentAlias === 'alpha' && s.letter === 'A'),
+  beta_letter_O:                   probe.monoSamples.some(s => s.parentAlias === 'beta'  && s.letter === 'O'),
+  all_monos_sans_serif:            probe.monoSamples.every(s => isSansSerif(s.family) && !isMonospace(s.family)),
+  prefix_group_keeps_monospace:    isMonospace(probe.prefixFamily),
+  r283_monogram_stroke_1_5_kept:   probe.alphaAvatarStroke === '1.5',
+  r282_watermark_present:          probe.watermarkPresent,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} monogram font swap:`, JSON.stringify(results),
+  '\n  alpha mono family:', probe.monoSamples.find(s => s.parentAlias === 'alpha')?.family,
+  '\n  beta  mono family:', probe.monoSamples.find(s => s.parentAlias === 'beta')?.family,
+  '\n  gamma prefix family:', probe.prefixFamily,
+  '\n  alpha avatar circle stroke (R283):', probe.alphaAvatarStroke);
+process.exit(ok ? 0 : 1);

package/scripts/topo-monogram-stroke-test.mjs

@@ -0,0 +1,101 @@
+/* Round 283 verification: vendor monogram circle strokeWidth bumps
+ * 1 → 1.5 per Vincent 5216 "vendor avatar quality" ask increment.
+ *
+ * Pre-R283: monogram circle (known vendor, no logo asset) rendered
+ * with strokeWidth="1". The prefix-group fallback (unknown vendor)
+ * also uses strokeWidth="1".
+ *
+ * Post-R283: monogram (known vendor) bumps to strokeWidth="1.5";
+ * prefix-group fallback stays at 1 (less weight = "we don't know
+ * what this is" signal preserved).
+ *
+ * Test trap encountered first draft: each g[data-node] contains
+ * THREE small (<r=18) circles —
+ *   1. avatar/monogram (r=10-14): strokeWidth 1 or 1.5 per vendor
+ *   2. runtime badge   (r=5.5-7): strokeWidth ALWAYS 1.5
+ *   3. pulse dot       (r=2.5):   no stroke (null)
+ * To isolate the avatar circle, filter by:
+ *   - r is the largest of the small circles (avatar) OR
+ *   - exclude elements with [data-runtime-badge] attribute
+ * We use the data-attr filter — cleaner intent.
+ */
+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, model) => ({
+    alias, status: 'working', model, runtime: 'claude-code-cli',
+    network_id: nid, project_dir: null,
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  });
+  // Mix: known vendors (Anthropic + OpenAI monogram) + unknown vendor
+  // (no model field).
+  await route.fulfill({ response: r, json: { ...b, sessions: [
+    mk('alpha', 'claude-opus-4'),    // Anthropic, monogram
+    mk('beta',  'gpt-4o'),            // OpenAI, monogram
+    mk('gamma', null),                 // unknown, prefix-group fallback
+    mk('delta', null),                 // unknown
+  ] } });
+});
+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-topo-brand-watermark]', { timeout: 10000 });
+await page.waitForTimeout(300);
+
+const probe = await page.evaluate(() => {
+  // For each node, find the AVATAR circle specifically:
+  //   - r < 18 (excludes status ring with r ~22-26)
+  //   - NOT a runtime badge (no data-runtime-badge attr)
+  //   - has stroke (excludes pulse dot)
+  const nodes = [...document.querySelectorAll('g[data-node]')];
+  const samples = nodes.map((g) => {
+    const alias = g.getAttribute('data-node');
+    const circles = [...g.querySelectorAll('circle')];
+    const avatar = circles
+      .map((c) => ({
+        r:        +c.getAttribute('r') || 0,
+        sw:       c.getAttribute('stroke-width'),
+        stroke:   c.getAttribute('stroke'),
+        isBadge:  c.hasAttribute('data-runtime-badge'),
+      }))
+      .filter((c) => c.r > 0 && c.r < 18 && !c.isBadge && c.stroke && c.stroke !== 'none');
+    // Of the remaining, the avatar/monogram is the largest-r one.
+    avatar.sort((a, b) => b.r - a.r);
+    return { alias, avatarStroke: avatar[0]?.sw ?? null, avatarR: avatar[0]?.r ?? null };
+  });
+  const watermark = document.querySelector('[data-topo-brand-watermark]');
+  return { samples, watermarkPresent: watermark !== null };
+});
+await browser.close();
+
+const alphaSample = probe.samples.find(s => s.alias === 'alpha');
+const betaSample  = probe.samples.find(s => s.alias === 'beta');
+const gammaSample = probe.samples.find(s => s.alias === 'gamma');
+
+const results = {
+  alpha_anthropic_mono_1_5: alphaSample?.avatarStroke === '1.5',
+  beta_openai_mono_1_5:     betaSample?.avatarStroke === '1.5',
+  gamma_prefix_stays_1:     gammaSample?.avatarStroke === '1',
+  r282_watermark_present:   probe.watermarkPresent,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} monogram stroke:`, JSON.stringify(results),
+  '\n  alpha (claude):  stroke=', alphaSample?.avatarStroke, ' r=', alphaSample?.avatarR,
+  '\n  beta  (gpt-4o):  stroke=', betaSample?.avatarStroke,  ' r=', betaSample?.avatarR,
+  '\n  gamma (unknown): stroke=', gammaSample?.avatarStroke, ' r=', gammaSample?.avatarR);
+process.exit(ok ? 0 : 1);

package/scripts/topo-more-flows-letterspacing-test.mjs

@@ -0,0 +1,111 @@
+/* Round 325 verification: "+N more flows" footer link picks up
+ * letterSpacing="0.2" — joins the R285/R289/R301/R302/R304
+ * editorial-letterspacing family.
+ *
+ * The footer is the recent-signal panel's primary navigation
+ * affordance into /messages (R128/R133). It carries designed-
+ * label semantics ("action label", not row data) but pre-R325
+ * sat orphaned from the editorial-spacing axis even though its
+ * siblings — kicker/watermark/panel titles/empty hint — all had
+ * intentional letter-spacing.
+ *
+ * 6-axis editorial-letterspacing hierarchy after this round:
+ *   R285 kicker:        1.2px (eyebrow loud)
+ *   R289 watermark:     0.5px (wordmark brand)
+ *   R301 panel titles:  0.3px (section headers)
+ *   R302 empty main:    0.2px (empty-state hint)
+ *   R325 footer link:   0.2px (panel nav action) ← this round
+ *   R304 empty sub:     0.15px (instructional sub)
+ *
+ * Contract:
+ *   - [data-recent-panel-more] is present (requires > 3 flowLinks
+ *     so the footer mounts visible — fixture: 5 message pairs to
+ *     produce 5 flows).
+ *   - The element's `letter-spacing` SVG attribute === '0.2' (the
+ *     literal authored value; computed style normalizes).
+ *   - R195 cyan-hover regression: [data-recent-panel-more-hovered]
+ *     defaults to 'false' (no hover simulated).
+ *   - R259 fontSize regression: fontSize="9" preserved.
+ *   - R317 / R318 / R294 chrome + pulse regressions intact.
+ */
+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'), mk('epsilon'),
+  ] } });
+});
+// 5 distinct flow pairs — recent-signal panel renders top 3 + "+ 2 more flows".
+const now = Date.now();
+const mkMsg = (i, from_alias, to_alias) => ({
+  id: `${from_alias}-${to_alias}-${i}`,
+  from_alias, to_alias, content: `m${i}`,
+  network_id: 'default',
+  created_at: new Date(now - (5 + i) * 1000).toISOString(),
+});
+await ctx.route('**/api/hub/messages*', (r) => r.fulfill({ json: { messages: [
+  mkMsg(1, 'alpha', 'beta'),
+  mkMsg(2, 'beta',  'gamma'),
+  mkMsg(3, 'gamma', 'delta'),
+  mkMsg(4, 'delta', 'epsilon'),
+  mkMsg(5, 'epsilon', 'alpha'),
+] } }));
+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-recent-panel-more]', { timeout: 15000 });
+await page.waitForTimeout(400);
+
+const probe = await page.evaluate(() => {
+  const more = document.querySelector('[data-recent-panel-more]');
+  return {
+    text:           more?.textContent ?? null,
+    moreCountAttr:  more?.getAttribute('data-recent-panel-more') ?? null,
+    hoveredAttr:    more?.getAttribute('data-recent-panel-more-hovered') ?? null,
+    letterSpacing:  more?.getAttribute('letter-spacing') ?? null,
+    fontSize:       more?.getAttribute('font-size') ?? null,
+    fontStyle:      more?.getAttribute('font-style') ?? null,
+    layoutInactiveCls: document.querySelector('[data-topo-chrome-layout="grid"]')?.className ?? '',
+    layoutActiveCls:   document.querySelector('[data-topo-chrome-layout="ring"]')?.className ?? '',
+    pulseCount:        document.querySelectorAll('[data-pulse-wrapper]').length,
+  };
+});
+await browser.close();
+
+const results = {
+  more_link_present:           probe.text !== null,
+  more_text_pattern:           /\+\s*\d+\s+more\s+flow/i.test(probe.text || ''),
+  more_letter_spacing_0_2:     probe.letterSpacing === '0.2',
+  // R259 regression — fontSize 9.
+  r259_font_size_9:            probe.fontSize === '9',
+  more_italic:                 probe.fontStyle === 'italic',
+  // R195 regression — default not-hovered state.
+  r195_default_not_hovered:    probe.hoveredAttr === 'false',
+  // R317 / R318 chrome regression.
+  r317_inactive_gray_400:      probe.layoutInactiveCls.includes('text-gray-400'),
+  r318_active_font_medium:     probe.layoutActiveCls.includes('font-medium'),
+  r294_pulse_absent:           probe.pulseCount === 0,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} more-flows letterSpacing:`, JSON.stringify(results),
+  '\n  text:', JSON.stringify(probe.text),
+  '\n  letter-spacing:', probe.letterSpacing);
+process.exit(ok ? 0 : 1);

package/scripts/topo-node-a11y-test.mjs

@@ -0,0 +1,107 @@
+/* Round 151 verification: node <g> gains a11y compliance.
+ *
+ * Node clickable for chat since R45, but tab-unreachable +
+ * screen-reader-unannounced. R151 matches the pattern R116 /
+ * R139 / R140 / R148 / R149 applied to other interactive
+ * surfaces:
+ *   role="button"
+ *   tabIndex={0}
+ *   aria-label="Chat with {alias} ({status})"
+ *   aria-pressed={chatAlias === session.alias}
+ *   onKeyDown(Enter / Space) → setChatAlias
+ *
+ * Three checks:
+ *   1. All nodes carry role=button, tabIndex=0, aria-label, aria-
+ *      pressed=false by default
+ *   2. Pressing Enter on a focused node opens chat (aria-pressed
+ *      flips to true, chat popover renders)
+ *   3. Pressing Space on a different node moves the open chat
+ *      target — only one aria-pressed=true at a time
+ */
+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'); 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: [
+    mk('alpha', 'working'), mk('beta', 'idle'), mk('gamma', 'working'),
+  ] } });
+});
+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.waitForTimeout(400);
+
+const inspectAll = () => page.evaluate(() => {
+  const nodes = [...document.querySelectorAll('g[data-node]')];
+  return nodes.map(n => ({
+    alias:    n.getAttribute('data-node'),
+    role:     n.getAttribute('role'),
+    tabIndex: n.getAttribute('tabindex'),
+    ariaLabel: n.getAttribute('aria-label'),
+    ariaPressed: n.getAttribute('aria-pressed'),
+  }));
+});
+
+const before = await inspectAll();
+
+// Focus alpha node and press Enter → opens chat
+await page.locator('g[data-node="alpha"]').focus();
+await page.keyboard.press('Enter');
+await page.waitForTimeout(250);
+const afterAlpha = await inspectAll();
+const popoverPresentA = await page.locator('.anet-chat-popover, [data-chat-popover]').count() > 0
+                       || await page.evaluate(() => !!document.querySelector('[role="dialog"]'));
+
+// Focus gamma node and press Space → moves chat target (only one pressed)
+await page.locator('g[data-node="gamma"]').focus();
+await page.keyboard.press(' ');
+await page.waitForTimeout(250);
+const afterGamma = await inspectAll();
+
+await browser.close();
+
+const results = {
+  // Baseline shape
+  threeNodes:         before.length === 3,
+  allRoleButton:      before.every(n => n.role === 'button'),
+  allTabIndex0:       before.every(n => n.tabIndex === '0'),
+  allAriaLabel:       before.every(n => /^Chat with /.test(n.ariaLabel || '')),
+  allAriaPressedFalse: before.every(n => n.ariaPressed === 'false'),
+
+  // After Enter on alpha
+  enterOpensChat:     afterAlpha.find(n => n.alias === 'alpha')?.ariaPressed === 'true',
+  popoverShown:       popoverPresentA,
+  othersStillFalse:   afterAlpha.filter(n => n.alias !== 'alpha').every(n => n.ariaPressed === 'false'),
+
+  // After Space on gamma (chat target moved)
+  spaceMovesTarget:   afterGamma.find(n => n.alias === 'gamma')?.ariaPressed === 'true',
+  alphaUnpressed:     afterGamma.find(n => n.alias === 'alpha')?.ariaPressed === 'false',
+  onlyOnePressed:     afterGamma.filter(n => n.ariaPressed === 'true').length === 1,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} node a11y:`, JSON.stringify(results),
+  `\n  before=`, before,
+  `\n  afterAlpha=`, afterAlpha,
+  `\n  afterGamma=`, afterGamma);
+process.exit(ok ? 0 : 1);

package/scripts/topo-node-alias-chat-pin-test.mjs

@@ -0,0 +1,95 @@
+/* Round 305 verification: node alias text picks up pin-signature
+ * letterSpacing (0.5px) when chatAlias === session.alias. Extends
+ * the R219 pin-signature family (recent-row text + legend-row text
+ * + edge badge) to the per-node alias label.
+ *
+ * Test gates: with no chat open, alias should have data-node-alias-
+ * chat-target='false'. We cannot easily simulate chat-open without
+ * triggering a click + side-effects; this round's primary contract
+ * is that the data attribute exists, the transition list includes
+ * letter-spacing, and the default (non-chat) state is 0px.
+ *
+ * Contract:
+ *   - All [data-node-alias-text] have data-node-alias-chat-target.
+ *   - Default state attribute is 'false'.
+ *   - computed transition includes letter-spacing at 0.2s.
+ *   - All node alias texts have computed letter-spacing 0px in the
+ *     default state.
+ *   - R304 sub-hint ls=0.15 + R302 main hint ls=0.2 + R301 panel
+ *     titles ls=0.3 + R294 pulse absent intact.
+ */
+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, model) => ({
+    alias, status: 'working', model, 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', 'claude-opus-4'),
+    mk('beta',  'gpt-4o'),
+  ] } });
+});
+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-node-alias-text]', { timeout: 15000 });
+await page.waitForTimeout(400);
+
+const probe = await page.evaluate(() => {
+  const aliases = [...document.querySelectorAll('[data-node-alias-text]')];
+  const samples = aliases.map(a => ({
+    alias:        a.getAttribute('data-node-alias-text'),
+    chatTarget:   a.getAttribute('data-node-alias-chat-target'),
+    transition:   getComputedStyle(a).transition,
+    letterSpacing: getComputedStyle(a).letterSpacing,
+  }));
+  const subhint = document.querySelector('[data-recent-signal-empty-hint]');
+  const empty   = document.querySelector('[data-recent-signal-empty]');
+  const recentTitle = document.querySelector('[data-recent-panel-title]');
+  const legendTitle = document.querySelector('[data-legend-panel-title]');
+  return {
+    samples,
+    subhintLs:       subhint?.getAttribute('letter-spacing') ?? null,
+    emptyLs:         empty?.getAttribute('letter-spacing') ?? null,
+    recentTitleLs:   recentTitle?.getAttribute('letter-spacing') ?? null,
+    legendTitleLs:   legendTitle?.getAttribute('letter-spacing') ?? null,
+    pulseCount:      document.querySelectorAll('[data-pulse-wrapper]').length,
+  };
+});
+await browser.close();
+
+const hasLsTransition = (s) => /letter-spacing\s+0\.?\d*s|letter-spacing\s+\d+ms/i.test(s || '');
+
+const results = {
+  alias_texts_present:     probe.samples.length >= 2,
+  all_have_chat_target_attr: probe.samples.every(s => s.chatTarget === 'true' || s.chatTarget === 'false'),
+  all_default_not_chat:    probe.samples.every(s => s.chatTarget === 'false'),
+  all_transition_has_ls:   probe.samples.every(s => hasLsTransition(s.transition)),
+  all_default_ls_0:        probe.samples.every(s => parseFloat(s.letterSpacing || '0') === 0 || s.letterSpacing === 'normal' || s.letterSpacing === '0px'),
+  r304_subhint_ls:         probe.subhintLs === '0.15',
+  r302_empty_main_ls:      probe.emptyLs === '0.2',
+  r301_panel_titles_ls:    probe.recentTitleLs === '0.3' && probe.legendTitleLs === '0.3',
+  r294_pulse_absent:       probe.pulseCount === 0,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} node alias chat-pin signature:`, JSON.stringify(results),
+  '\n  alias samples:', probe.samples.slice(0, 2),
+  '\n  R304 sub-hint ls:', probe.subhintLs,
+  '\n  R302 main hint ls:', probe.emptyLs);
+process.exit(ok ? 0 : 1);