@sleep2agi/agent-network-dashboard 0.4.6-preview.26 → 0.4.6-preview.261

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

@@ -0,0 +1,121 @@
+/* Round 124 verification: pin-intersection summary chip.
+ *
+ * The four filter pills (R64 status / R63 group / R89 vendor /
+ * R119 edge) each show their own dim's match count in isolation.
+ * But the node-opacity chain (lines 2723-2741 of TopoGraph.tsx)
+ * AND-composes all four pin dimensions — every miss dims the node.
+ * So two active pins produce an intersection ≤ either individual
+ * count, and the existing pills don't surface that.
+ *
+ * R124 adds a small "match: N pins · K" chip after the last pill
+ * when ≥ 2 pin dims are active. K = nodes that satisfy ALL active
+ * pins. Single pin keeps its old pill story (chip hidden).
+ *
+ * Fleet:
+ *   alpha   (working, vendor=A, group=agents)
+ *   beta    (working, vendor=O, group=agents)
+ *   gamma   (idle,    vendor=A, group=agents)
+ *   delta   (working, vendor=A, group=infra)
+ *
+ * Test path:
+ *   1. No pin                                 → chip hidden
+ *   2. Pin status=working                     → chip hidden (1 pin)
+ *   3. + Pin vendor=A                         → chip "2 pins · 2"
+ *      (working AND vendor=A: alpha, delta)
+ *   4. + Pin group=agents                     → chip "3 pins · 1"
+ *      (working AND A AND agents: alpha only)
+ *   5. Esc                                    → chip hidden
+ */
+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: 1100 } });
+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, model) => ({
+    alias, status, model, runtime: 'cli-claude-code',
+    network_id: nid, project_dir: alias.startsWith('infra-') ? '/srv/infra' : '/srv/agents',
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  });
+  await route.fulfill({ response: r, json: { ...b, sessions: [
+    mk('agents-alpha', 'working', 'claude-opus-4'),
+    mk('agents-beta',  'working', 'gpt-4o'),
+    mk('agents-gamma', 'idle',    'claude-sonnet-4'),
+    mk('infra-delta',  'working', 'claude-haiku-4'),
+  ] } });
+});
+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.waitForTimeout(400);
+
+const readChip = () => page.evaluate(() => {
+  const el = document.querySelector('[data-pin-intersection]');
+  if (!el) return null;
+  return {
+    dimCount:  parseInt(el.getAttribute('data-pin-dim-count') || '0', 10),
+    matchCount: parseInt(el.getAttribute('data-pin-intersection-count') || '0', 10),
+    aliases: (el.getAttribute('data-pin-intersection-aliases') || '').split(',').filter(Boolean),
+    text: el.textContent?.trim(),
+  };
+});
+
+// State 1 — no pins
+const s1 = await readChip();
+
+// State 2 — pin status=working via pressure-bar segment
+await page.locator('[data-pressure-seg="working"]').click();
+await page.waitForTimeout(200);
+const s2 = await readChip();
+
+// State 3 — + pin vendor=A
+await page.locator('[data-vendor-letter="A"]').click();
+await page.waitForTimeout(200);
+const s3 = await readChip();
+
+// State 4 — + pin group=agents via the R69 CustomEvent contract.
+// Direct dispatch is mode-independent (group-label hit-rects only
+// render in grid layout; default is ring). The handler at line 945
+// of TopoGraph.tsx accepts { kind: 'group', value: <key> }.
+await page.evaluate(() => {
+  window.dispatchEvent(new CustomEvent('anet:topo-pin', { detail: { kind: 'group', value: 'agents' } }));
+});
+await page.waitForTimeout(200);
+const s4 = await readChip();
+
+// State 5 — Esc clears all pins
+await page.keyboard.press('Escape');
+await page.waitForTimeout(200);
+const s5 = await readChip();
+
+await browser.close();
+
+const results = {
+  s1_noPins_chipHidden:            s1 === null,
+  s2_onePin_chipHidden:            s2 === null,
+  s3_twoPins_chipShown:            !!s3 && s3.dimCount === 2,
+  s3_intersection_2:               !!s3 && s3.matchCount === 2,
+  s3_aliases_alphaDelta:           !!s3 && s3.aliases.includes('agents-alpha') && s3.aliases.includes('infra-delta'),
+  s4_threePins_chipShown:          !!s4 && s4.dimCount === 3,
+  s4_intersection_1:               !!s4 && s4.matchCount === 1,
+  s4_aliases_alphaOnly:            !!s4 && s4.aliases.length === 1 && s4.aliases[0] === 'agents-alpha',
+  s5_escClears_chipHidden:         s5 === null,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pin-intersection chip:`, JSON.stringify(results),
+  `\n  s1=`, s1, `\n  s2=`, s2, `\n  s3=`, s3, `\n  s4=`, s4, `\n  s5=`, s5);
+process.exit(ok ? 0 : 1);

package/scripts/topo-pin-intersection-warning-crossfade-test.mjs

@@ -0,0 +1,107 @@
+/* Round 237 verification: pin-intersection chip's ⚠ warning glyph
+ * always-mounts with opacity gated on isEmpty, instead of
+ * conditional render on isEmpty. Closes the snap-mount + layout-
+ * shift jank that survived R236's color easing.
+ *
+ * Test scope:
+ *   - non-empty state: glyph in DOM, data-pin-intersection-warning
+ *     ='false', opacity=0, transition includes 'opacity 200ms'
+ *   - empty state:     glyph in DOM, data-pin-intersection-warning
+ *     ='true',  opacity=1, transition still present
+ *   - chip width: stable across the crossing (no layout-shift)
+ *
+ * Reuses the R236 scenario tuning — alpha is the only working
+ * anthropic, gpt sessions all idle; pin working+A (non-empty)
+ * then re-pin vendor to O (empty).
+ */
+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, status) => ({
+    alias, status, 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', 'working'),
+    mk('beta',  'claude-opus-4', 'idle'),
+    mk('gamma', 'gpt-4',         'idle'),
+    mk('delta', 'gpt-4',         '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.locator('[data-pressure-seg="working"]').first().click();
+await page.locator('[data-vendor-letter="A"]').first().click();
+await page.waitForSelector('[data-pin-intersection-warning]', { timeout: 5000, state: 'attached' });
+await page.waitForTimeout(300);
+
+const probe = (page) => page.evaluate(() => {
+  const glyph = document.querySelector('[data-pin-intersection-warning]');
+  const chip = document.querySelector('[data-pin-intersection]');
+  if (!glyph || !chip) return null;
+  return {
+    present:      true,
+    warning:      glyph.getAttribute('data-pin-intersection-warning'),
+    opacity:      parseFloat(glyph.style.opacity || '1'),
+    transition:   glyph.style.transition,
+    text:         glyph.textContent,
+    chipWidthPx:  Math.round(chip.getBoundingClientRect().width * 100) / 100,
+    chipEmpty:    chip.getAttribute('data-pin-intersection-empty'),
+  };
+});
+
+const nonEmpty = await probe(page);
+
+// Flip vendor pin to 'O' — working ∩ openai = 0 (gpt all idle) → empty
+await page.locator('[data-vendor-letter="O"]').first().click();
+await page.waitForTimeout(300);
+const empty = await probe(page);
+
+await browser.close();
+
+const widthDelta = nonEmpty && empty
+  ? Math.abs(nonEmpty.chipWidthPx - empty.chipWidthPx)
+  : Infinity;
+
+const results = {
+  nonempty_in_dom:           nonEmpty?.present === true,
+  nonempty_warning_false:    nonEmpty?.warning === 'false',
+  nonempty_opacity_0:        nonEmpty?.opacity === 0,
+  nonempty_has_transition:   /opacity\s+200ms/.test(nonEmpty?.transition || ''),
+  nonempty_text_is_warning:  nonEmpty?.text === '⚠',
+  nonempty_chip_empty_false: nonEmpty?.chipEmpty === 'false',
+
+  empty_in_dom:              empty?.present === true,
+  empty_warning_true:        empty?.warning === 'true',
+  empty_opacity_1:           empty?.opacity === 1,
+  empty_has_transition:      /opacity\s+200ms/.test(empty?.transition || ''),
+  empty_chip_empty_true:     empty?.chipEmpty === 'true',
+
+  // Chip width stable across the crossing (no layout-shift jank).
+  // 1px tolerance for fractional rounding only.
+  chip_width_stable:         widthDelta <= 1,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pin-intersection warning crossfade:`, JSON.stringify(results),
+  '\n  nonEmpty:', nonEmpty,
+  '\n  empty:   ', empty,
+  '\n  widthDelta:', widthDelta);
+process.exit(ok ? 0 : 1);

package/scripts/topo-pin-mirror-transition-test.mjs

@@ -0,0 +1,101 @@
+/* Round 180 verification: working / online / vendor-letter chips
+ * pick up box-shadow transition on pin/unpin.
+ *
+ * Pre-R180 the inset-ring pin-mirror style snapped instantly when
+ * the user pinned or unpinned a filter via these three chip
+ * surfaces. R165 had added the transition to pressure-bar
+ * segments only — R180 closes the smooth-pin-mirror family
+ * across all chip-row pinnable surfaces.
+ *
+ * Test:
+ *   1. Mock 3 working sessions across 2 vendors (claude + 书生)
+ *   2. Probe inline transition on working / online / vendor chips
+ *   3. All three should have 'box-shadow 150ms ease-out' in their
+ *      inline transition style
+ */
+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';
+  // Two distinct vendor families so vendor letter chip shows up
+  // (vendorDist.length > 1 requirement).
+  const mk = (alias, model) => ({
+    alias, status: 'working', model, 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', 'claude-opus-4'),
+    mk('beta',  'claude-opus-4'),
+    mk('gamma', 'intern-s1-mini'),
+  ] } });
+});
+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-working-chip]', { timeout: 10000 });
+await page.waitForSelector('[data-vendor-letter]', { timeout: 10000 });
+await page.waitForTimeout(400);
+
+const probe = async () => page.evaluate(() => {
+  const grab = (sel) => {
+    const el = document.querySelector(sel);
+    return el ? {
+      transition: el.style.transition || getComputedStyle(el).transition || '',
+      boxShadow:  el.style.boxShadow || getComputedStyle(el).boxShadow || '',
+    } : null;
+  };
+  return {
+    working: grab('[data-working-chip]'),
+    online:  grab('[data-online-chip-clickable]'),
+    vendor:  grab('[data-vendor-letter]'),
+  };
+});
+
+const idle = await probe();
+
+// Click the working chip to pin → boxShadow should appear
+await page.locator('[data-working-chip]').click();
+await page.waitForTimeout(250);
+const pinnedWorking = await probe();
+
+await browser.close();
+
+const hasTransition = (s) =>
+  (s?.transition || '').includes('box-shadow 150ms') ||
+  /box-shadow\s+0\.15s|box-shadow\s+150ms/.test(s?.transition || '');
+
+const results = {
+  working_found:                idle.working !== null,
+  online_found:                 idle.online !== null,
+  vendor_found:                 idle.vendor !== null,
+  working_has_bs_transition:    hasTransition(idle.working),
+  online_has_bs_transition:     hasTransition(idle.online),
+  vendor_has_bs_transition:     hasTransition(idle.vendor),
+  // Pre-pin: no inset rings on working chip
+  working_idle_no_inset:        !(idle.working?.boxShadow || '').includes('inset'),
+  // After pin: inset rings appear, transition still set
+  working_pinned_has_inset:     (pinnedWorking.working?.boxShadow || '').includes('inset'),
+  working_pinned_keeps_transition: hasTransition(pinnedWorking.working),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pin-mirror transition:`, JSON.stringify(results),
+  `\n  idle =`, idle,
+  `\n  pinned =`, pinnedWorking);
+process.exit(ok ? 0 : 1);

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

@@ -0,0 +1,105 @@
+/* Round 66 verification: pinnedStatus + pinnedGroup persist across page
+ * reloads via sessionStorage. Stale group pins (group no longer exists)
+ * are cleared on hydration so the chip row doesn't show a phantom team.
+ *
+ *  - Pre-seed sessionStorage with anet-topo-pinned-status='working' →
+ *    reload → assert filter pill renders + working stays bright + idles
+ *    dim. (Status pin survives.)
+ *  - Pre-seed anet-topo-pinned-group='alpha' WITH alpha sessions → reload
+ *    → pill renders + alpha team stays bright.
+ *  - Pre-seed anet-topo-pinned-group='ghost' WITHOUT any ghost session →
+ *    reload → the stale pin is cleared on hydration; no pill renders.
+ */
+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 probe({ status = null, group = null, sessions }) {
+  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(({ status, group }) => {
+    try {
+      localStorage.setItem('anet-theme', 'cyber');
+      localStorage.setItem('anet-topo-layout', 'grid');
+      sessionStorage.setItem('anet_v3_auth', '1');
+      if (status) sessionStorage.setItem('anet-topo-pinned-status', status);
+      else        sessionStorage.removeItem('anet-topo-pinned-status');
+      if (group)  sessionStorage.setItem('anet-topo-pinned-group', group);
+      else        sessionStorage.removeItem('anet-topo-pinned-group');
+    } catch {}
+  }, { status, group });
+  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 seeded = sessions.map(s => ({
+      alias: s.alias, status: s.status, network_id: nid, project_dir: null,
+      created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+    }));
+    await route.fulfill({ response: r, json: { ...b, sessions: seeded } });
+  });
+  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(c => document.querySelectorAll('g[data-node]').length === c, sessions.length, { timeout: 30000 });
+  await page.waitForTimeout(700);
+  const result = await page.evaluate(() => {
+    const pills = [...document.querySelectorAll('[data-active-filter]')].map(el => ({
+      kind: el.getAttribute('data-active-filter'),
+      text: (el.textContent || '').trim(),
+    }));
+    const opacities = {};
+    for (const el of document.querySelectorAll('g[data-node]')) {
+      const a = el.getAttribute('data-node');
+      if (a) opacities[a] = +(el.style.opacity || '1');
+    }
+    const storage = {
+      status: sessionStorage.getItem('anet-topo-pinned-status'),
+      group:  sessionStorage.getItem('anet-topo-pinned-group'),
+    };
+    return { pills, opacities, storage };
+  });
+  await ctx.close();
+  return result;
+}
+
+const sessions3 = [
+  { alias: 'alpha1', status: 'working' },
+  { alias: 'alpha2', status: 'idle' },
+  { alias: 'beta',   status: 'idle' },
+];
+const alphaPlus = [
+  { alias: 'alpha1', status: 'idle' },
+  { alias: 'alpha2', status: 'idle' },
+  { alias: 'alpha3', status: 'idle' },
+  { alias: 'beta',   status: 'idle' },
+];
+
+const statusRestore = await probe({ status: 'working', sessions: sessions3 });
+const groupRestore  = await probe({ group: 'alpha',   sessions: alphaPlus });
+const stalePin      = await probe({ group: 'ghost',   sessions: sessions3 });
+
+await browser.close();
+
+const bright = (v) => v != null && v >= 0.55;
+const dim    = (v) => v != null && v < 0.4;
+const results = {
+  statusPill_restored: statusRestore.pills.length === 1 && statusRestore.pills[0].kind === 'status'
+                        && /filter:\s*working/.test(statusRestore.pills[0].text),
+  statusPin_dimsIdle:  bright(statusRestore.opacities.alpha1) && dim(statusRestore.opacities.alpha2),
+  groupPill_restored:  groupRestore.pills.length === 1 && groupRestore.pills[0].kind === 'group'
+                        && /filter:\s*alpha/.test(groupRestore.pills[0].text),
+  groupPin_dimsOutsider: bright(groupRestore.opacities.alpha1) && dim(groupRestore.opacities.beta),
+  stale_pillCleared:   stalePin.pills.length === 0,
+  stale_storageCleared: stalePin.storage.group === null,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pin persistence:`, JSON.stringify(results),
+  `\n  statusRestore=`, statusRestore,
+  `\n  groupRestore=`, groupRestore,
+  `\n  stalePin=`, stalePin);
+process.exit(ok ? 0 : 1);

package/scripts/topo-ping-pulse-ease-test.mjs

@@ -0,0 +1,96 @@
+/* Round 228 verification: arrival-ping (R75) and dispatch-pulse
+ * (R76) SMIL <animate>s get pulse-pop ease curves via calcMode/
+ * keyTimes/keySplines.
+ *
+ * Coverage:
+ *   - [data-arrival-ping] r       → ease-out across both segments
+ *   - [data-arrival-ping] opacity → ease-out rise, ease-in fall
+ *   - [data-dispatch-pulse] r       → ease-out across both segments
+ *   - [data-dispatch-pulse] opacity → ease-out rise, ease-in fall
+ *
+ * Scenario: 4 working agents + 5 messages alpha→beta so:
+ *   - link.count = 5 ≥ 3   (dispatch pulse fires)
+ *   - fresh > 0.5          (both ping + pulse gate active)
+ *   - reducedMotion off    (cyber-themed cookie default)
+ */
+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'),
+  ] } });
+});
+const now = Date.now();
+const msgs = [];
+for (let i = 0; i < 5; i++) {
+  msgs.push({
+    id: `m${i}`, from_alias: 'alpha', to_alias: 'beta', content: 'hi',
+    network_id: 'default', created_at: new Date(now - (1000 + i * 50)).toISOString(),
+  });
+}
+await ctx.route('**/api/hub/messages*', (r2) => r2.fulfill({ json: { messages: msgs } }));
+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-arrival-ping]', { timeout: 10000, state: 'attached' });
+await page.waitForSelector('[data-dispatch-pulse]', { timeout: 10000, state: 'attached' });
+await page.waitForTimeout(400);
+
+const out = await page.evaluate(() => {
+  const probe = (parentSelector) => {
+    const el = document.querySelector(parentSelector);
+    if (!el) return null;
+    const animates = Array.from(el.querySelectorAll('animate'));
+    return animates.map((a) => ({
+      attr:       a.getAttribute('attributeName'),
+      calcMode:   a.getAttribute('calcMode'),
+      keyTimes:   a.getAttribute('keyTimes'),
+      keySplines: a.getAttribute('keySplines'),
+    }));
+  };
+  return {
+    arrival:  probe('[data-arrival-ping]'),
+    dispatch: probe('[data-dispatch-pulse]'),
+  };
+});
+await browser.close();
+
+const easeOutBoth   = '0.25 0.1 0.25 1;0.25 0.1 0.25 1';
+const pulsePop      = '0.25 0.1 0.25 1;0.42 0 1 1';
+const keyTimes      = '0;0.5;1';
+
+const find = (arr, attr) => arr?.find(a => a.attr === attr);
+const matches = (a, splines) => a && a.calcMode === 'spline' && a.keyTimes === keyTimes && a.keySplines === splines;
+
+const results = {
+  arrival_present:    Array.isArray(out.arrival) && out.arrival.length === 2,
+  arrival_r_easeout:  matches(find(out.arrival, 'r'),       easeOutBoth),
+  arrival_op_pulse:   matches(find(out.arrival, 'opacity'), pulsePop),
+  dispatch_present:   Array.isArray(out.dispatch) && out.dispatch.length === 2,
+  dispatch_r_easeout: matches(find(out.dispatch, 'r'),       easeOutBoth),
+  dispatch_op_pulse:  matches(find(out.dispatch, 'opacity'), pulsePop),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} ping+pulse ease:`, JSON.stringify(results),
+  '\n  arrival:',  out.arrival,
+  '\n  dispatch:', out.dispatch);
+process.exit(ok ? 0 : 1);

package/scripts/topo-popover-meta-test.mjs

@@ -0,0 +1,78 @@
+/* Round 37 verification: ChatPopover header carries cwd / last-seen
+ * lines pulled from the SWR session cache. Three cases:
+ *   - online node with cwd → cwd line, no last-seen
+ *   - offline node with cwd → both lines
+ *   - bare node (no cwd, no last_seen) → drag/Esc fallback hint */
+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 probe(targetAlias) {
+  const ctx = await browser.newContext({ viewport: { width: 1400, height: 1000 } });
+  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');
+      localStorage.setItem('anet-topo-nodescale', '1');
+      sessionStorage.setItem('anet_v3_auth', '1');
+    } catch {}
+  });
+  const fresh = new Date(Date.now() - 60 * 1000).toISOString();
+  const offline = new Date(Date.now() - 8 * 60 * 1000).toISOString(); // 8 min ago
+  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: 'liveCwd', status: 'idle', network_id: nid,
+        project_dir: '/home/vansin/agent-orchestra',
+        created_at: fresh, updated_at: fresh, last_seen_at: fresh },
+      { alias: 'offCwd', status: 'offline', network_id: nid,
+        project_dir: '/home/vansin/some-project',
+        created_at: fresh, updated_at: fresh, last_seen_at: offline },
+      { alias: 'bare', 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 } });
+  });
+  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);
+  await page.locator(`g[data-node="${targetAlias}"]`).click();
+  await page.waitForTimeout(300);
+  const meta = await page.evaluate(() => {
+    const cwd = document.querySelector('[data-popover-cwd]');
+    const ls = document.querySelector('[data-popover-lastseen]');
+    const popover = document.querySelector('[aria-label^="Chat with"]');
+    const dragHint = popover ? [...popover.querySelectorAll('div')].find(d => /Drag to move/.test(d.textContent || '')) : null;
+    return {
+      cwdText: cwd?.textContent || null,
+      lsText: ls?.textContent || null,
+      dragHintPresent: !!dragHint,
+    };
+  });
+  await ctx.close();
+  return meta;
+}
+
+const live = await probe('liveCwd');
+const off = await probe('offCwd');
+const bare = await probe('bare');
+await browser.close();
+
+const results = {
+  liveShowsCwd: live.cwdText === 'cwd: /home/vansin/agent-orchestra' && live.lsText === null && !live.dragHintPresent,
+  offlineShowsBoth: off.cwdText === 'cwd: /home/vansin/some-project'
+    && /last seen: [78]m ago/.test(off.lsText || '')
+    && !off.dragHintPresent,
+  bareFallsBackToDragHint: bare.cwdText === null && bare.lsText === null && bare.dragHintPresent,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} popover meta:`, JSON.stringify(results),
+  `\n  live=`, live, `\n  off=`, off, `\n  bare=`, bare);
+process.exit(ok ? 0 : 1);