@1agh/maude 0.29.0 → 0.31.0

package/apps/studio/test/canvas-meta-api.test.ts

@@ -1,15 +1,21 @@
 // Phase 4 T5 — `/_api/canvas-meta` GET/PATCH endpoint round-trip.
+// DDR-115 — per-user camera split: `viewport` lives in a gitignored per-machine
+// view file (`_canvas-state/<slug>.view.json`), NEVER inline in the versioned
+// `.meta.json`. PATCH splits the lanes; GET merges them back.
 //
 // Verifies:
-//   - PATCH merges `viewport` into an existing `<canvas>.meta.json`
-//   - PATCH preserves other top-level keys (title, sections, ai_context …)
-//   - PATCH clamps zoom to [0.1, 4.0]
-//   - PATCH rejects non-finite viewport coords (no write, returns prior)
-//   - GET returns the merged meta
-//   - Paths that escape repoRoot are 400
+//   - PATCH `viewport` leaves `.meta.json` BYTE-UNCHANGED + writes the view file
+//     (the mouse-move churn killer) — and a viewport-only patch on a meta-less
+//     canvas still succeeds
+//   - PATCH clamps zoom to [0.1, 4.0] / rejects non-finite coords (view file)
+//   - GET merges the view file's viewport into the returned meta
+//   - GET strips a stale inline viewport from a legacy meta
+//   - PATCH `layout` writes meta AND bumps `last_modified` (a real shared change)
+//   - PATCH layout persists position-only entries (DDR-027)
+//   - Paths that escape repoRoot are 404
 
 import { describe, expect, test } from 'bun:test';
-import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
 import { join } from 'node:path';
 
 import { bootServer, killProc, makeSandbox, nextPort } from './_helpers.ts';
@@ -29,8 +35,13 @@ function repoRel(designRoot: string, abs: string): string {
   return abs.startsWith(`${repoRoot}/`) ? abs.slice(repoRoot.length + 1) : abs;
 }
 
-describe('/_api/canvas-meta — GET/PATCH', () => {
-  test('PATCH merges viewport onto existing meta and preserves other keys', async () => {
+/** `_canvas-state/<slug>.view.json` for a `<designRoot>/ui/<Name>.tsx` canvas. */
+function viewPath(designRoot: string, slug: string): string {
+  return join(designRoot, '_canvas-state', `${slug}.view.json`);
+}
+
+describe('/_api/canvas-meta — GET/PATCH (DDR-115 camera split)', () => {
+  test('PATCH viewport leaves meta byte-unchanged + writes the view file (churn killer)', async () => {
     const { root, designRoot } = makeSandbox();
     const port = nextPort();
     const proc = await bootServer(root, port);
@@ -47,6 +58,7 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
           ai_context: { pinned_decisions: ['keep dc-* classes'] },
         })
       );
+      const before = readFileSync(metaAbs, 'utf8');
       const file = repoRel(designRoot, tsxAbs);
 
       const r = await fetch(`http://localhost:${port}/_api/canvas-meta`, {
@@ -56,16 +68,48 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
       });
       expect(r.status).toBe(200);
       const merged = (await r.json()) as MetaShape;
+      // The returned object is GET-shaped: shared keys + the camera merged in.
       expect(merged.title).toBe('Phase 4');
       expect(merged.sections).toBeDefined();
       expect(merged.ai_context).toBeDefined();
       expect(merged.viewport).toEqual({ x: 12, y: 34, zoom: 1.5 });
-      expect(typeof merged.last_modified).toBe('string');
 
-      // On-disk reflects the merge.
-      const onDisk = JSON.parse(readFileSync(metaAbs, 'utf8')) as MetaShape;
-      expect(onDisk.viewport?.zoom).toBe(1.5);
-      expect(onDisk.title).toBe('Phase 4');
+      // KEYSTONE — the versioned meta is byte-identical; no viewport, no
+      // last_modified bump on a viewport-only patch.
+      expect(readFileSync(metaAbs, 'utf8')).toBe(before);
+
+      // The camera landed in the gitignored per-machine view file.
+      const vAbs = viewPath(designRoot, 'ui-phase4');
+      expect(existsSync(vAbs)).toBe(true);
+      const view = JSON.parse(readFileSync(vAbs, 'utf8'));
+      expect(view.viewport).toEqual({ x: 12, y: 34, zoom: 1.5 });
+    } finally {
+      await killProc(proc);
+    }
+  });
+
+  test('PATCH viewport succeeds on a canvas with no meta yet (writes only the view file)', async () => {
+    const { root, designRoot } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      mkdirSync(join(designRoot, 'ui'), { recursive: true });
+      const tsxAbs = join(designRoot, 'ui', 'NoMeta.tsx');
+      writeFileSync(tsxAbs, 'export default function N(){return <main/>}\n');
+      const metaAbs = tsxAbs.replace(/\.tsx$/, '.meta.json');
+      const file = repoRel(designRoot, tsxAbs);
+
+      const r = await fetch(`http://localhost:${port}/_api/canvas-meta`, {
+        method: 'PATCH',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ file, patch: { viewport: { x: 1, y: 2, zoom: 2 } } }),
+      });
+      expect(r.status).toBe(200);
+      const merged = (await r.json()) as MetaShape;
+      expect(merged.viewport).toEqual({ x: 1, y: 2, zoom: 2 });
+      // No meta was conjured into existence.
+      expect(existsSync(metaAbs)).toBe(false);
+      expect(existsSync(viewPath(designRoot, 'ui-nometa'))).toBe(true);
     } finally {
       await killProc(proc);
     }
@@ -102,7 +146,7 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
     }
   });
 
-  test('PATCH ignores non-finite viewport (NaN/Infinity)', async () => {
+  test('PATCH ignores non-finite viewport (NaN/Infinity) — keeps the prior camera', async () => {
     const { root, designRoot } = makeSandbox();
     const port = nextPort();
     const proc = await bootServer(root, port);
@@ -110,36 +154,44 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
       mkdirSync(join(designRoot, 'ui'), { recursive: true });
       const tsxAbs = join(designRoot, 'ui', 'Bad.tsx');
       writeFileSync(tsxAbs, 'export default function B(){return <main/>}\n');
-      writeFileSync(
-        tsxAbs.replace(/\.tsx$/, '.meta.json'),
-        '{"title":"Bad","viewport":{"x":1,"y":2,"zoom":1}}'
-      );
+      writeFileSync(tsxAbs.replace(/\.tsx$/, '.meta.json'), '{"title":"Bad"}');
       const file = repoRel(designRoot, tsxAbs);
 
+      // Seed a valid camera (writes the view file).
+      await fetch(`http://localhost:${port}/_api/canvas-meta`, {
+        method: 'PATCH',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ file, patch: { viewport: { x: 1, y: 2, zoom: 1 } } }),
+      });
+
       const r = await fetch(`http://localhost:${port}/_api/canvas-meta`, {
         method: 'PATCH',
         headers: { 'content-type': 'application/json' },
         body: JSON.stringify({ file, patch: { viewport: { x: 'nope', y: null, zoom: 1 } } }),
       });
       const m = (await r.json()) as MetaShape;
-      // Prior value preserved.
+      // Prior valid camera preserved (the bad patch was a no-op for the view file).
       expect(m.viewport).toEqual({ x: 1, y: 2, zoom: 1 });
+      const view = JSON.parse(readFileSync(viewPath(designRoot, 'ui-bad'), 'utf8'));
+      expect(view.viewport).toEqual({ x: 1, y: 2, zoom: 1 });
     } finally {
       await killProc(proc);
     }
   });
 
-  test('GET returns the meta document', async () => {
+  test('GET merges the view file viewport into the returned meta', async () => {
     const { root, designRoot } = makeSandbox();
     const port = nextPort();
     const proc = await bootServer(root, port);
     try {
       mkdirSync(join(designRoot, 'ui'), { recursive: true });
-      const tsxAbs = join(designRoot, 'ui', 'Read.tsx');
-      writeFileSync(tsxAbs, 'export default function R(){return <main/>}\n');
+      const tsxAbs = join(designRoot, 'ui', 'Merge.tsx');
+      writeFileSync(tsxAbs, 'export default function M(){return <main/>}\n');
+      writeFileSync(tsxAbs.replace(/\.tsx$/, '.meta.json'), JSON.stringify({ title: 'Merge' }));
+      mkdirSync(join(designRoot, '_canvas-state'), { recursive: true });
       writeFileSync(
-        tsxAbs.replace(/\.tsx$/, '.meta.json'),
-        JSON.stringify({ title: 'Read', viewport: { x: 5, y: 6, zoom: 0.5 } })
+        viewPath(designRoot, 'ui-merge'),
+        JSON.stringify({ viewport: { x: 7, y: 8, zoom: 0.5 } })
       );
       const file = repoRel(designRoot, tsxAbs);
 
@@ -148,8 +200,69 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
       );
       expect(r.status).toBe(200);
       const m = (await r.json()) as MetaShape;
-      expect(m.title).toBe('Read');
-      expect(m.viewport?.zoom).toBe(0.5);
+      expect(m.title).toBe('Merge');
+      expect(m.viewport).toEqual({ x: 7, y: 8, zoom: 0.5 });
+    } finally {
+      await killProc(proc);
+    }
+  });
+
+  test('GET strips a stale inline viewport from a legacy meta (no view file)', async () => {
+    const { root, designRoot } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      mkdirSync(join(designRoot, 'ui'), { recursive: true });
+      const tsxAbs = join(designRoot, 'ui', 'Legacy.tsx');
+      writeFileSync(tsxAbs, 'export default function L(){return <main/>}\n');
+      // A pre-DDR-115 meta with the camera baked inline + a stale last_modified.
+      writeFileSync(
+        tsxAbs.replace(/\.tsx$/, '.meta.json'),
+        JSON.stringify({
+          title: 'Legacy',
+          viewport: { x: 5, y: 6, zoom: 0.5 },
+          last_modified: '2020-01-01T00:00:00.000Z',
+        })
+      );
+      const file = repoRel(designRoot, tsxAbs);
+
+      const r = await fetch(
+        `http://localhost:${port}/_api/canvas-meta?file=${encodeURIComponent(file)}`
+      );
+      const m = (await r.json()) as MetaShape;
+      expect(m.title).toBe('Legacy');
+      // The stale inline camera + timestamp are NOT surfaced (no view file → none).
+      expect(m.viewport).toBeUndefined();
+      expect(m.last_modified).toBeUndefined();
+    } finally {
+      await killProc(proc);
+    }
+  });
+
+  test('PATCH layout writes meta AND bumps last_modified (a real shared change)', async () => {
+    const { root, designRoot } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      mkdirSync(join(designRoot, 'ui'), { recursive: true });
+      const tsxAbs = join(designRoot, 'ui', 'Layout.tsx');
+      writeFileSync(tsxAbs, 'export default function L(){return <main/>}\n');
+      const metaAbs = tsxAbs.replace(/\.tsx$/, '.meta.json');
+      writeFileSync(metaAbs, JSON.stringify({ title: 'L', sections: [] }));
+      const file = repoRel(designRoot, tsxAbs);
+
+      const r = await fetch(`http://localhost:${port}/_api/canvas-meta`, {
+        method: 'PATCH',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ file, patch: { layout: { artboards: [{ id: 'a', x: 0, y: 0 }] } } }),
+      });
+      expect(r.status).toBe(200);
+      const onDisk = JSON.parse(readFileSync(metaAbs, 'utf8')) as MetaShape;
+      expect(onDisk.layout?.artboards).toBeDefined();
+      expect(typeof onDisk.last_modified).toBe('string');
+      expect(onDisk.title).toBe('L');
+      // The camera never leaks into the versioned meta.
+      expect(onDisk.viewport).toBeUndefined();
     } finally {
       await killProc(proc);
     }
@@ -204,6 +317,27 @@ describe('/_api/canvas-meta — GET/PATCH', () => {
     }
   });
 
+  test('PATCH viewport on a non-existent canvas is refused (404) and mints no file (DDR-115 F-A2)', async () => {
+    const { root, designRoot } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      mkdirSync(join(designRoot, 'ui'), { recursive: true });
+      // No .tsx written — the canvas does not exist.
+      const file = '.design/ui/Ghost.tsx';
+      const r = await fetch(`http://localhost:${port}/_api/canvas-meta`, {
+        method: 'PATCH',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({ file, patch: { viewport: { x: 1, y: 2, zoom: 1 } } }),
+      });
+      expect(r.status).toBe(404);
+      // The untrusted-origin write was refused — no per-machine file minted.
+      expect(existsSync(viewPath(designRoot, 'ui-ghost'))).toBe(false);
+    } finally {
+      await killProc(proc);
+    }
+  });
+
   test('PATCH rejects paths that escape repoRoot', async () => {
     const { root } = makeSandbox();
     const port = nextPort();

package/apps/studio/test/canvas-origin-gate.test.ts

@@ -54,11 +54,54 @@ describe('canvas-origin gate — A1/A2 traversal + privilege containment', () =>
       // /_api/canvas (Phase 22 file-write) is deliberately NOT in the canvas
       // origin's route allowlist — an untrusted canvas iframe must never create
       // arbitrary .tsx files. It is reachable ONLY from the main origin.
+      // Phase 12 (DDR-103) — the in-canvas direct-edit write routes are
+      // MAIN-ORIGIN ONLY: absent from CANVAS_SAFE_API + startCanvasServer's
+      // route map, so the untrusted canvas iframe origin must never reach a
+      // source-write endpoint. A GET here 403s at the gate (not 405 from the
+      // handler), proving the route is unreachable on this origin.
       for (const p of [
         '/_config',
         '/_sync-status',
         '/_api/export',
         '/_api/canvas',
+        '/_api/edit-css',
+        '/_api/edit-text',
+        '/_api/edit-attr',
+        // Phase 27 (E2) — every /_api/git/* route is MAIN-ORIGIN ONLY: absent from
+        // CANVAS_SAFE_API + startCanvasServer's `routes` map. A GET from the
+        // canvas origin must 403 at the gate (not 405 from a reached handler),
+        // proving the route is unreachable on this origin. Guards the dual-
+        // allowlist invariant for the token-bearing publish/get-latest endpoints.
+        '/_api/git/status',
+        '/_api/git/log',
+        '/_api/git/diff',
+        '/_api/git/commit',
+        '/_api/git/discard',
+        '/_api/git/push',
+        '/_api/git/pull',
+        '/_api/git/resolve',
+        // Phase 29 (E4) — drafts: list + create + switch + fold are MAIN-ORIGIN ONLY.
+        '/_api/git/branches',
+        '/_api/git/branch',
+        '/_api/git/checkout',
+        '/_api/git/fold',
+        // Phase 28 (E3) — every /_api/github/* route is MAIN-ORIGIN ONLY (absent
+        // from CANVAS_SAFE_API + startCanvasServer's `routes` map) and token-bearing.
+        // The untrusted canvas iframe origin must never reach identity/create-repo/
+        // invite/repos — a request from this origin 403s at the gate. This is also
+        // the guard that the GitHub token (server-held, keychain) can never be
+        // exfiltrated to the canvas realm.
+        '/_api/github/identity',
+        '/_api/github/repos',
+        '/_api/github/create-repo',
+        '/_api/github/invite',
+        '/_api/github/clone',
+        '/_api/github/create-project',
+        '/_api/design/init',
+        // Phase 29 (E4) Door C — the hub-link credential write is MAIN-ORIGIN ONLY;
+        // the untrusted canvas origin must never reach it (it writes the global
+        // ~/.config/maude/hubs.json token store).
+        '/_api/hub/link',
         '/package.json',
       ]) {
         expect(await code(p)).toBe(403);

package/apps/studio/test/chat-markdown.test.tsx

@@ -0,0 +1,58 @@
+// chat-markdown — Phase 31. The ACP chat feed's compact, XSS-safe markdown
+// renderer. Builds React nodes (never innerHTML), so we assert the rendered
+// markup + that unsafe link schemes are dropped.
+
+import { describe, expect, test } from 'bun:test';
+import { renderToStaticMarkup } from 'react-dom/server';
+
+import { Markdown } from '../client/panels/chat-markdown.jsx';
+
+const html = (text: string) => renderToStaticMarkup(<Markdown text={text} />);
+
+describe('chat-markdown', () => {
+  test('inline bold / italic / code', () => {
+    const out = html('Use **bold**, *italic* and `code` here.');
+    expect(out).toContain('<strong>bold</strong>');
+    expect(out).toContain('<em>italic</em>');
+    expect(out).toContain('<code>code</code>');
+  });
+
+  test('fenced code block', () => {
+    const out = html('text\n```\nconst x = 1;\n```\nmore');
+    expect(out).toContain('class="chat-code"');
+    expect(out).toContain('const x = 1;');
+  });
+
+  test('bullet + numbered lists', () => {
+    const bullet = html('- one\n- two');
+    expect(bullet).toContain('<ul class="chat-md-list">');
+    expect(bullet).toContain('<li>one</li>');
+    const ordered = html('1. first\n2. second');
+    expect(ordered).toContain('<ol class="chat-md-list">');
+    expect(ordered).toContain('<li>first</li>');
+  });
+
+  test('headings render as styled paragraphs (no giant h1)', () => {
+    const out = html('## Section');
+    expect(out).toContain('class="chat-md-h"');
+    expect(out).toContain('Section');
+    expect(out).not.toContain('<h1');
+  });
+
+  test('http(s) links are kept, unsafe schemes are dropped to text', () => {
+    const safe = html('see [Anthropic](https://anthropic.com)');
+    expect(safe).toContain('href="https://anthropic.com"');
+    expect(safe).toContain('rel="noreferrer noopener"');
+
+    const unsafe = html('[click](javascript:alert(1))');
+    expect(unsafe).not.toContain('javascript:');
+    expect(unsafe).not.toContain('<a ');
+    expect(unsafe).toContain('click'); // falls back to plain text
+  });
+
+  test('plain text passes through as a paragraph', () => {
+    const out = html('just a line');
+    expect(out).toContain('class="chat-md-p"');
+    expect(out).toContain('just a line');
+  });
+});

package/apps/studio/test/collab-bridge.test.ts

@@ -4,8 +4,6 @@
 
 import { describe, expect, test } from 'bun:test';
 
-import * as Y from 'yjs';
-
 import { Y_TYPES } from '../collab/persistence.ts';
 import { createRegistry } from '../collab/registry.ts';
 import type { RoomCallbacks } from '../collab/room.ts';

package/apps/studio/test/collab-room.test.ts

@@ -1,17 +1,12 @@
 // Unit: Room behavior — two in-memory peers see each other, debounced flush
 // fires, flush is idempotent, room teardown is clean.
 
-import { afterEach, beforeEach, describe, expect, test } from 'bun:test';
+import { describe, expect, test } from 'bun:test';
 
 import { Awareness } from 'y-protocols/awareness';
 import * as Y from 'yjs';
 
-import {
-  encodeAwarenessFrame,
-  encodeHandshake,
-  encodeSyncUpdate,
-  handleMessage,
-} from '../collab/protocol.ts';
+import { encodeAwarenessFrame, handleMessage } from '../collab/protocol.ts';
 import { createRoom, type RoomCallbacks, type RoomConn } from '../collab/room.ts';
 
 function makeConn(id: string): RoomConn & { recv: Uint8Array[] } {

package/apps/studio/test/collab-session-survival.test.tsx

@@ -0,0 +1,176 @@
+// Collab session survives a canvas hot-swap remount — F4 regression.
+//
+// RCA: `.ai/logs/rca/issue-collab-observer-tsx-reload-flicker.md`. A cross-peer
+// synced edit hot-swaps the canvas module in place, which REMOUNTS the whole
+// canvas subtree — including <CollabProvider>. If the Y.Doc + Awareness + socket
+// were per-component, that remount would close + re-handshake the awareness
+// socket and every peer's cursor/avatar would blink. The fix makes the session
+// a module-level, refcounted singleton keyed by slug, so a same-slug remount
+// reuses the SAME live socket + Awareness (stable clientID → the server never
+// sees the peer leave + rejoin → no blink).
+//
+// We register happy-dom (error boundaries / real createRoot need a live DOM,
+// like canvas-hmr-runtime.test.tsx) and stub WebSocket + fetch.
+
+import { afterAll, afterEach, beforeAll, describe, expect, test } from 'bun:test';
+import { GlobalRegistrator } from '@happy-dom/global-registrator';
+
+beforeAll(() => {
+  GlobalRegistrator.register();
+  (globalThis as unknown as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
+});
+afterAll(() => {
+  GlobalRegistrator.unregister();
+});
+
+import { act, createElement, useEffect } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import type * as Y from 'yjs';
+
+import { CollabProvider, useCollab } from '../use-collab.tsx';
+
+// ── Fake WebSocket: count constructions + closes; never touches the network ──
+let wsConstructed = 0;
+let wsClosed = 0;
+class FakeWS {
+  static OPEN = 1;
+  static CLOSING = 2;
+  static CLOSED = 3;
+  readyState = 1; // OPEN immediately — the provider only broadcasts when OPEN
+  url: string;
+  private handlers: Record<string, Array<(e: unknown) => void>> = {};
+  constructor(url: string) {
+    this.url = url;
+    wsConstructed++;
+    // Fire `open` on the next microtask so the provider's open handler runs.
+    queueMicrotask(() => this.dispatch('open', {}));
+  }
+  addEventListener(type: string, fn: (e: unknown) => void) {
+    const bucket = this.handlers[type] ?? [];
+    bucket.push(fn);
+    this.handlers[type] = bucket;
+  }
+  removeEventListener() {}
+  send() {}
+  close() {
+    if (this.readyState === FakeWS.CLOSED) return;
+    this.readyState = FakeWS.CLOSED;
+    wsClosed++;
+    this.dispatch('close', {});
+  }
+  private dispatch(type: string, e: unknown) {
+    for (const fn of this.handlers[type] ?? []) fn(e);
+  }
+}
+
+const realWebSocket = globalThis.WebSocket;
+const realFetch = globalThis.fetch;
+
+beforeAll(() => {
+  (globalThis as unknown as { WebSocket: unknown }).WebSocket = FakeWS;
+  (globalThis as unknown as { fetch: unknown }).fetch = () =>
+    Promise.resolve({ json: () => Promise.resolve({ name: 'Tester' }) });
+});
+afterAll(() => {
+  (globalThis as unknown as { WebSocket: unknown }).WebSocket = realWebSocket;
+  (globalThis as unknown as { fetch: unknown }).fetch = realFetch;
+});
+
+afterEach(() => {
+  wsConstructed = 0;
+  wsClosed = 0;
+});
+
+// Captures the live doc + awareness clientID for the mounted provider.
+let captured: { doc: Y.Doc; clientID: number } | null = null;
+function Probe() {
+  const collab = useCollab();
+  useEffect(() => {
+    if (collab) captured = { doc: collab.doc, clientID: collab.awareness.clientID };
+  });
+  return null;
+}
+
+function mount(el: HTMLElement): Root {
+  let root!: Root;
+  act(() => {
+    root = createRoot(el);
+  });
+  return root;
+}
+
+function renderProvider(root: Root, slug: string) {
+  act(() => {
+    root.render(createElement(CollabProvider, { slug }, createElement(Probe)));
+  });
+}
+
+describe('collab session survival across a hot-swap remount', () => {
+  test('a same-slug remount reuses the live socket + Awareness (no reconnect)', () => {
+    captured = null;
+    const host = document.createElement('div');
+    const root = mount(host);
+
+    renderProvider(root, 'survival-slug');
+    expect(wsConstructed).toBe(1);
+    const first = captured;
+    expect(first).not.toBeNull();
+
+    // Hot-swap = unmount the canvas subtree, then immediately remount the SAME
+    // slug (what CanvasHmrRuntime's key=attempt does on a synced module swap).
+    act(() => {
+      root.render(createElement('div', null));
+    });
+    renderProvider(root, 'survival-slug');
+
+    // The session was reused within the grace window — NO second socket, and the
+    // SAME doc + Awareness clientID (the server never saw a leave/rejoin).
+    expect(wsConstructed).toBe(1);
+    expect(wsClosed).toBe(0);
+    expect(captured?.doc).toBe(first?.doc);
+    expect(captured?.clientID).toBe(first?.clientID);
+
+    act(() => root.unmount());
+  });
+
+  test('the session registry is anchored on window under a non-enumerable Symbol', () => {
+    // A hot-swap re-imports the canvas bundle with a `?v=` cache-buster, and
+    // use-collab is INLINED into that bundle — so a module-scoped `const
+    // SESSIONS = new Map()` would be FRESH (empty) on every hot-swap and spin a
+    // new clientID each time (phantom self-avatars pile up). Anchoring the map
+    // on `window` (under a global Symbol so the re-imported module resolves the
+    // same key) is what makes the session survive the swap. This pins that
+    // invariant — the registry holds the slug — AND the security posture: the
+    // key is a NON-ENUMERABLE Symbol so untrusted same-realm canvas script can't
+    // harvest the live network handles via a for-in / Object.keys sweep.
+    captured = null;
+    const host = document.createElement('div');
+    const root = mount(host);
+    renderProvider(root, 'window-anchored-slug');
+    const w = window as unknown as Record<symbol, Map<string, unknown> | undefined>;
+    const reg = w[Symbol.for('maude.collab.sessions.v1')];
+    expect(reg).toBeInstanceOf(Map);
+    expect(reg?.has('window-anchored-slug')).toBe(true);
+    // Not reachable via string-key enumeration (defense in depth).
+    expect(Object.keys(window)).not.toContain('__maudeCollabSessions');
+    act(() => root.unmount());
+  });
+
+  test('a different slug opens its own session (no cross-slug sharing)', () => {
+    captured = null;
+    const host = document.createElement('div');
+    const root = mount(host);
+
+    renderProvider(root, 'slug-a');
+    const a = captured;
+    renderProvider(root, 'slug-b');
+    const b = captured;
+
+    // slug-b reuses slug-a's <CollabProvider> instance but a NEW session →
+    // a second socket + a distinct doc.
+    expect(wsConstructed).toBe(2);
+    expect(b?.doc).not.toBe(a?.doc);
+
+    act(() => root.unmount());
+  });
+});

package/apps/studio/test/csp-canvas-shell.test.ts

@@ -39,6 +39,11 @@ describe('cspForCanvasShell — A6 hardening', () => {
     expect(csp).toContain("frame-ancestors 'self' http://localhost:4399");
   });
 
+  test('frame-ancestors carries every advertised loopback spelling (localhost + 127.0.0.1)', () => {
+    const csp = cspForCanvasShell(SHELL, 'http://localhost:4399 http://127.0.0.1:4399');
+    expect(csp).toContain("frame-ancestors 'self' http://localhost:4399 http://127.0.0.1:4399");
+  });
+
   test('frame-ancestors is OMITTED when the main origin is unknown (would block the legit embed)', () => {
     const csp = cspForCanvasShell(SHELL);
     expect(csp).not.toContain('frame-ancestors');