@1agh/maude 0.22.2 → 0.24.0

package/plugins/design/dev-server/test/annotations-roundtrip.test.ts

@@ -0,0 +1,276 @@
+// annotations round-trip — Phase 21. The PARSE side of the schema (svgToStrokes)
+// needs a DOMParser, which bun:test does not expose natively. We register
+// happy-dom for THIS file only (beforeAll/afterAll) so the rest of the suite
+// keeps running DOM-free; the existing annotations-layer.test.ts covers the
+// write side (strokesToSvg) without a DOM.
+//
+// The load-bearing test here is the back-compat canary (Task 10): a hand-frozen
+// pre-Phase-21 fixture must survive parse → re-serialize BYTE-IDENTICAL. Any
+// "phantom default" (e.g. always emitting data-end-head="triangle") would bloat
+// every legacy SVG on the first load→save cycle and this test would catch it.
+
+import { afterAll, beforeAll, describe, expect, test } from 'bun:test';
+import { GlobalRegistrator } from '@happy-dom/global-registrator';
+
+import {
+  type ArrowStroke,
+  type RectStroke,
+  type StickyStroke,
+  type Stroke,
+  type TextStroke,
+  strokesToSvg,
+  svgToStrokes,
+} from '../annotations-layer.tsx';
+import { sanitizeAnnotationSvg } from '../api.ts';
+
+beforeAll(() => {
+  GlobalRegistrator.register();
+});
+afterAll(async () => {
+  await GlobalRegistrator.unregister();
+});
+
+/** Re-serialize a freshly-parsed SVG. Round-trip helper. */
+function reparse(svg: string): string {
+  return strokesToSvg(svgToStrokes(svg));
+}
+
+describe('annotations round-trip / back-compat canary (Task 10)', () => {
+  test('a frozen pre-Phase-21 SVG round-trips BYTE-IDENTICAL', async () => {
+    const fixture = await Bun.file(
+      new URL('./fixtures/phase-20-annotations.svg', import.meta.url)
+    ).text();
+    // No trailing newline in the fixture; svgToStrokes trims its input but the
+    // serializer never emits trailing whitespace, so raw === raw must hold.
+    expect(fixture.endsWith('</svg>')).toBe(true);
+    const roundTripped = reparse(fixture);
+    expect(roundTripped).toBe(fixture);
+  });
+
+  test('parsing the fixture yields exactly the five legacy strokes', async () => {
+    const fixture = await Bun.file(
+      new URL('./fixtures/phase-20-annotations.svg', import.meta.url)
+    ).text();
+    const strokes = svgToStrokes(fixture);
+    expect(strokes.map((s) => s.tool)).toEqual(['pen', 'rect', 'ellipse', 'arrow', 'text']);
+    // The legacy rect must NOT pick up a phantom non-zero radius.
+    const rect = strokes.find((s) => s.tool === 'rect') as RectStroke;
+    expect(rect.cornerRadius ?? 0).toBe(0);
+    // The legacy arrow must NOT pick up phantom head/dash overrides.
+    const arrow = strokes.find((s) => s.tool === 'arrow') as ArrowStroke;
+    expect(arrow.startHead).toBeUndefined();
+    expect(arrow.endHead).toBeUndefined();
+    expect(arrow.dashed).toBeUndefined();
+    // The legacy text keeps its anchor.
+    const text = strokes.find((s) => s.tool === 'text') as TextStroke;
+    expect(text.anchorId).toBe('r1');
+  });
+});
+
+describe('annotations round-trip / sticky', () => {
+  const sticky: StickyStroke = {
+    id: 'st1',
+    tool: 'sticky',
+    color: '#ffe27a',
+    x: 40,
+    y: 50,
+    w: 200,
+    h: 160,
+    text: 'approve copy?',
+    fontSize: 14,
+    cornerRadius: 8,
+  };
+
+  test('sticky survives serialize → parse with all fields intact', () => {
+    const [parsed] = svgToStrokes(strokesToSvg([sticky])) as StickyStroke[];
+    expect(parsed).toEqual(sticky);
+  });
+
+  test('sticky with multi-line text round-trips the newline', () => {
+    const multi: StickyStroke = { ...sticky, text: 'line one\nline two' };
+    const [parsed] = svgToStrokes(strokesToSvg([multi])) as StickyStroke[];
+    expect(parsed?.text).toBe('line one\nline two');
+  });
+
+  test('sticky serialize→parse is idempotent', () => {
+    const once = strokesToSvg([sticky]);
+    expect(reparse(once)).toBe(once);
+  });
+
+  test('sticky never persists a foreignObject (sanitizer would strip it)', () => {
+    expect(strokesToSvg([sticky])).not.toContain('foreignObject');
+  });
+
+  test('sticky SVG survives sanitizeAnnotationSvg byte-intact (PUT-path)', () => {
+    // The persisted form passes through the DDR-060 F1 sanitizer on every PUT.
+    // It uses only allowlisted elements (g/rect/text) and no denied attrs, so
+    // it must come back unchanged — otherwise sticky text wouldn't persist.
+    const svg = strokesToSvg([sticky]);
+    expect(sanitizeAnnotationSvg(svg)).toBe(svg);
+  });
+
+  test('sticky body text still parses after a sanitize pass', () => {
+    const svg = strokesToSvg([{ ...sticky, text: 'survive me' }]);
+    const cleaned = sanitizeAnnotationSvg(svg);
+    const [parsed] = svgToStrokes(cleaned) as StickyStroke[];
+    expect(parsed?.text).toBe('survive me');
+  });
+});
+
+describe('annotations round-trip / rect corner radius', () => {
+  const base: RectStroke = {
+    id: 'r',
+    tool: 'rect',
+    color: '#1d6cf0',
+    width: 2,
+    x: 0,
+    y: 0,
+    w: 50,
+    h: 50,
+    fill: null,
+  };
+
+  for (const r of [0, 8, 999]) {
+    test(`cornerRadius ${r} round-trips`, () => {
+      const [parsed] = svgToStrokes(strokesToSvg([{ ...base, cornerRadius: r }])) as RectStroke[];
+      expect(parsed?.cornerRadius ?? 0).toBe(r);
+    });
+  }
+});
+
+describe('annotations round-trip / arrow heads + dash (4 dirs × 2 dash)', () => {
+  const base: ArrowStroke = {
+    id: 'a',
+    tool: 'arrow',
+    color: '#1a8f3e',
+    width: 2,
+    x1: 0,
+    y1: 0,
+    x2: 100,
+    y2: 0,
+  };
+
+  // The four FigJam direction presets, expressed as (startHead, endHead) pairs.
+  const dirs: Array<{
+    name: string;
+    startHead: 'none' | 'triangle';
+    endHead: 'none' | 'triangle';
+  }> = [
+    { name: 'none (line)', startHead: 'none', endHead: 'none' },
+    { name: 'start', startHead: 'triangle', endHead: 'none' },
+    { name: 'end (default)', startHead: 'none', endHead: 'triangle' },
+    { name: 'both', startHead: 'triangle', endHead: 'triangle' },
+  ];
+
+  for (const d of dirs) {
+    for (const dashed of [false, true]) {
+      test(`${d.name} + ${dashed ? 'dashed' : 'solid'} round-trips`, () => {
+        const arrow: ArrowStroke = {
+          ...base,
+          startHead: d.startHead,
+          endHead: d.endHead,
+          dashed,
+        };
+        const svg = strokesToSvg([arrow]);
+        const [parsed] = svgToStrokes(svg) as ArrowStroke[];
+        // Normalize defaults: the parser leaves default values undefined.
+        expect(parsed?.startHead ?? 'none').toBe(d.startHead);
+        expect(parsed?.endHead ?? 'triangle').toBe(d.endHead);
+        expect(parsed?.dashed ?? false).toBe(dashed);
+        // And it is idempotent at the byte level.
+        expect(reparse(svg)).toBe(svg);
+      });
+    }
+  }
+});
+
+describe('annotations round-trip / standalone vs anchored text', () => {
+  test('standalone text round-trips its world (x, y) and stays unanchored', () => {
+    const t: TextStroke = {
+      id: 't-std',
+      tool: 'text',
+      color: '#1a1a1a',
+      fontSize: 20,
+      text: 'side note',
+      x: 120,
+      y: 80,
+    };
+    const [parsed] = svgToStrokes(strokesToSvg([t])) as TextStroke[];
+    expect(parsed?.anchorId).toBeUndefined();
+    expect(parsed?.x).toBe(120);
+    expect(parsed?.y).toBe(80);
+    expect(parsed?.text).toBe('side note');
+    expect(parsed?.fontSize).toBe(20);
+  });
+
+  test('anchored text round-trips its host id (back-compat)', () => {
+    const t: TextStroke = {
+      id: 't-anc',
+      tool: 'text',
+      color: '#1a1a1a',
+      fontSize: 14,
+      text: 'label',
+      anchorId: 'r-host',
+    };
+    const [parsed] = svgToStrokes(strokesToSvg([t])) as TextStroke[];
+    expect(parsed?.anchorId).toBe('r-host');
+    expect(parsed?.x).toBeUndefined();
+  });
+});
+
+describe('annotations round-trip / mixed scene idempotency', () => {
+  test('a scene mixing every Phase 21 shape re-serializes identically', () => {
+    const scene: Stroke[] = [
+      {
+        id: 'p',
+        tool: 'pen',
+        color: '#000',
+        width: 3,
+        points: [
+          [0, 0],
+          [5, 5],
+        ],
+      },
+      {
+        id: 'r',
+        tool: 'rect',
+        color: '#222',
+        width: 2,
+        x: 0,
+        y: 0,
+        w: 40,
+        h: 40,
+        fill: null,
+        cornerRadius: 999,
+      },
+      {
+        id: 'a',
+        tool: 'arrow',
+        color: '#111',
+        width: 2,
+        x1: 0,
+        y1: 0,
+        x2: 50,
+        y2: 50,
+        startHead: 'triangle',
+        endHead: 'triangle',
+        dashed: true,
+      },
+      {
+        id: 'st',
+        tool: 'sticky',
+        color: '#ffd6e7',
+        x: 10,
+        y: 10,
+        w: 200,
+        h: 160,
+        text: 'hi',
+        fontSize: 14,
+        cornerRadius: 8,
+      },
+      { id: 'tx', tool: 'text', color: '#000', fontSize: 14, text: 'free', x: 5, y: 6 },
+    ];
+    const svg = strokesToSvg(scene);
+    expect(reparse(svg)).toBe(svg);
+  });
+});

package/plugins/design/dev-server/test/canvas-cursors.test.ts

@@ -0,0 +1,73 @@
+// canvas-cursors — Phase 21 custom tool cursors. Validates the data-URI CSS
+// cursor shape so a malformed string (which silently disables the cursor in the
+// browser) can't ship undetected.
+
+import { describe, expect, test } from 'bun:test';
+
+import { TOOL_CURSORS } from '../canvas-cursors.ts';
+
+const ALL_TOOLS = [
+  'move',
+  'hand',
+  'comment',
+  'pen',
+  'rect',
+  'ellipse',
+  'sticky',
+  'arrow',
+  'text',
+  'eraser',
+] as const;
+
+describe('canvas-cursors / TOOL_CURSORS', () => {
+  test('covers every tool', () => {
+    for (const t of ALL_TOOLS) {
+      expect(typeof TOOL_CURSORS[t]).toBe('string');
+      expect(TOOL_CURSORS[t].length).toBeGreaterThan(0);
+    }
+  });
+
+  test('move keeps the system arrow', () => {
+    expect(TOOL_CURSORS.move).toBe('default');
+  });
+
+  test('custom cursors are well-formed data-URI CSS values with hotspot + fallback', () => {
+    const fallback: Record<string, string> = {
+      hand: 'grab',
+      comment: 'crosshair',
+      pen: 'crosshair',
+      rect: 'crosshair',
+      ellipse: 'crosshair',
+      sticky: 'crosshair',
+      arrow: 'crosshair',
+      text: 'text',
+      eraser: 'cell',
+    };
+    for (const [tool, fb] of Object.entries(fallback)) {
+      const v = TOOL_CURSORS[tool as keyof typeof TOOL_CURSORS];
+      // url("data:image/svg+xml,<encoded>") <hx> <hy>, <fallback>
+      expect(v).toMatch(
+        new RegExp(`^url\\("data:image/svg\\+xml,%3Csvg[^"]+"\\) \\d+ \\d+, ${fb}$`)
+      );
+      // The SVG must declare a 32×32 box and be valid encoded markup.
+      const decoded = decodeURIComponent(v.slice(v.indexOf(',') + 1, v.indexOf('")')));
+      expect(decoded).toContain("width='32'");
+      expect(decoded).toContain("height='32'");
+      expect(decoded).toContain('</svg>');
+    }
+  });
+
+  test('hotspots are within the 0..31 image bounds', () => {
+    for (const t of ALL_TOOLS) {
+      if (TOOL_CURSORS[t] === 'default') continue;
+      const m = TOOL_CURSORS[t].match(/"\) (\d+) (\d+),/);
+      expect(m).not.toBeNull();
+      const hx = Number(m?.[1]);
+      const hy = Number(m?.[2]);
+      expect(hx).toBeGreaterThanOrEqual(0);
+      expect(hx).toBeLessThanOrEqual(31);
+      expect(hy).toBeGreaterThanOrEqual(0);
+      expect(hy).toBeLessThanOrEqual(31);
+    }
+  });
+});

package/plugins/design/dev-server/test/canvas-origin-gate.test.ts

@@ -0,0 +1,76 @@
+// Canvas-origin route gate — A1/A2 (DDR-060 F1 re-audit). Boots a real server
+// with MAUDE_CANVAS_ORIGIN_SPLIT=1 and probes the segregated canvas origin to
+// prove: (1) the %2f-encoded path-traversal that previously leaked repo files
+// outside designRoot is now 403'd; (2) privileged routes stay 403; (3) legit
+// designRoot assets + the shell still serve; (4) the shell carries the hardened
+// CSP. See .ai/logs/security-reviews/phase-9.1-t2-f1-cross-origin-reaudit.md.
+
+import { mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { join } from 'node:path';
+
+import { describe, expect, test } from 'bun:test';
+
+import { bootServer, killProc, makeSandbox, nextPort } from './_helpers.ts';
+
+async function readCanvasOrigin(designRoot: string): Promise<string> {
+  // server.ts writes _server.json under the designRoot once both listeners bind.
+  for (let i = 0; i < 40; i++) {
+    try {
+      const info = JSON.parse(readFileSync(join(designRoot, '_server.json'), 'utf8'));
+      if (info.canvasOrigin) return info.canvasOrigin as string;
+    } catch {
+      /* not written yet */
+    }
+    await Bun.sleep(50);
+  }
+  throw new Error('canvasOrigin never appeared in _server.json');
+}
+
+describe('canvas-origin gate — A1/A2 traversal + privilege containment', () => {
+  test('%2f traversal out of designRoot is 403; privileged 403; legit 200; CSP hardened', async () => {
+    const { root, designRoot } = makeSandbox();
+    // A real asset OUTSIDE .design/ but INSIDE repoRoot — the traversal target.
+    writeFileSync(join(root, 'secret-outside.css'), '.leak{content:"SECRET"}');
+    // A legit canvas asset under designRoot (the allowed case).
+    mkdirSync(join(designRoot, 'ui'), { recursive: true });
+    writeFileSync(
+      join(designRoot, 'ui', 'Gate.tsx'),
+      'export default function G(){return <main/>}\n'
+    );
+
+    const port = nextPort();
+    const proc = await bootServer(root, port, { MAUDE_CANVAS_ORIGIN_SPLIT: '1' });
+    try {
+      const canvas = await readCanvasOrigin(designRoot);
+      const code = async (p: string) =>
+        (await fetch(canvas + p, { signal: AbortSignal.timeout(2000) })).status;
+
+      // (1) The confirmed bypass — must now be 403, not 200.
+      expect(await code('/.design/..%2fsecret-outside.css')).toBe(403);
+      expect(await code('/.design/ui/..%2f..%2fsecret-outside.css')).toBe(403);
+      // Double-encoded + mixed-case variants stay closed.
+      expect(await code('/.design/%2e%2e%2fsecret-outside.css')).toBe(403);
+
+      // (2) Privileged / out-of-scope routes stay 403 on the canvas origin.
+      for (const p of ['/_config', '/_sync-status', '/_api/export', '/package.json']) {
+        expect(await code(p)).toBe(403);
+      }
+
+      // (3) Legit surfaces still serve.
+      expect(await code('/_health')).toBe(200);
+      expect(await code('/_canvas-shell.html')).toBe(200);
+      // A real .tsx canvas under designRoot transpiles + serves (200).
+      expect(await code('/.design/ui/Gate.tsx')).toBe(200);
+
+      // (4) The shell carries the hardened CSP (A6).
+      const shell = await fetch(`${canvas}/_canvas-shell.html`);
+      const csp = shell.headers.get('content-security-policy') ?? '';
+      expect(csp).toContain("connect-src 'self'");
+      expect(csp).toContain("webrtc 'block'");
+      expect(csp).toContain('frame-ancestors');
+      expect(csp).toContain(`http://localhost:${port}`);
+    } finally {
+      await killProc(proc);
+    }
+  });
+});

package/plugins/design/dev-server/test/collab-awareness-bridge.test.ts

@@ -0,0 +1,223 @@
+// Phase 9 Task 5 — awareness over WSS.
+//
+// Unit-tests the in-process Awareness bridge (collab Room ↔ sync provider) and
+// the registry wiring that owns its lifecycle, plus an end-to-end cross-peer
+// cursor relay through a simulated hub.
+
+import { describe, expect, test } from 'bun:test';
+
+import { Awareness, applyAwarenessUpdate, encodeAwarenessUpdate } from 'y-protocols/awareness';
+import * as Y from 'yjs';
+
+import { bridgeAwareness } from '../collab/awareness-bridge.ts';
+import { createRegistry } from '../collab/registry.ts';
+import type { RoomCallbacks } from '../collab/room.ts';
+
+function noopCallbacks(): RoomCallbacks {
+  return {
+    async seed() {},
+    async persistJson() {},
+    async persistBinary() {},
+  };
+}
+
+function mkAwareness(): Awareness {
+  return new Awareness(new Y.Doc());
+}
+
+// Simulate the Hocuspocus hub relay: two Awareness instances cross-linked so a
+// change on one appears on the other (keyed by the originating clientID).
+function linkAwareness(x: Awareness, y: Awareness): () => void {
+  const T = { transport: true };
+  function fwd(from: Awareness, to: Awareness) {
+    return (
+      { added, updated, removed }: { added: number[]; updated: number[]; removed: number[] },
+      origin: unknown
+    ) => {
+      if (origin === T) return;
+      const changed = added.concat(updated, removed);
+      if (changed.length === 0) return;
+      applyAwarenessUpdate(to, encodeAwarenessUpdate(from, changed), T);
+    };
+  }
+  const xy = fwd(x, y);
+  const yx = fwd(y, x);
+  x.on('update', xy);
+  y.on('update', yx);
+  return () => {
+    x.off('update', xy);
+    y.off('update', yx);
+  };
+}
+
+describe('bridgeAwareness', () => {
+  test('relays a local state set on a → b', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    bridgeAwareness(a, b);
+
+    a.setLocalState({ name: 'Alice', color: '#f00', cursor: { x: 1, y: 2 } });
+
+    const seen = b.getStates().get(a.clientID) as { name?: string; color?: string } | undefined;
+    expect(seen?.name).toBe('Alice');
+    expect(seen?.color).toBe('#f00');
+  });
+
+  test('relays both directions', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    bridgeAwareness(a, b);
+
+    b.setLocalState({ name: 'Bob' });
+    expect((a.getStates().get(b.clientID) as { name?: string } | undefined)?.name).toBe('Bob');
+  });
+
+  test('propagates removal when the source clears its state', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    bridgeAwareness(a, b);
+
+    a.setLocalState({ name: 'Alice' });
+    expect(b.getStates().has(a.clientID)).toBe(true);
+
+    a.setLocalState(null);
+    expect(b.getStates().has(a.clientID)).toBe(false);
+  });
+
+  test('exchanges pre-existing states at wire time', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    a.setLocalState({ name: 'Alice' });
+    b.setLocalState({ name: 'Bob' });
+
+    bridgeAwareness(a, b);
+
+    expect((b.getStates().get(a.clientID) as { name?: string } | undefined)?.name).toBe('Alice');
+    expect((a.getStates().get(b.clientID) as { name?: string } | undefined)?.name).toBe('Bob');
+  });
+
+  test('does not echo — a single update yields a single foreign state, no storm', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    bridgeAwareness(a, b);
+
+    let bUpdates = 0;
+    b.on('update', () => {
+      bUpdates++;
+    });
+
+    a.setLocalState({ name: 'Alice' });
+
+    // Exactly one relayed update; a's own state count stays 1 (no bounce-back
+    // creating phantom clients).
+    expect(bUpdates).toBe(1);
+    expect(a.getStates().size).toBe(1);
+    expect(b.getStates().size).toBe(2); // a (relayed) + b's own
+  });
+
+  test('detach stops further relay', () => {
+    const a = mkAwareness();
+    const b = mkAwareness();
+    const detach = bridgeAwareness(a, b);
+
+    detach();
+    a.setLocalState({ name: 'Alice' });
+    expect(b.getStates().has(a.clientID)).toBe(false);
+  });
+});
+
+describe('Registry.attachHubAwareness', () => {
+  test('attach-then-create wires the bridge so room state reaches the hub', () => {
+    const r = createRegistry(noopCallbacks());
+    const hub = mkAwareness();
+    r.attachHubAwareness('s', hub);
+
+    const room = r.get('s');
+    room.awareness.setLocalState({ name: 'Alice' });
+
+    expect((hub.getStates().get(room.awareness.clientID) as { name?: string })?.name).toBe('Alice');
+  });
+
+  test('create-then-attach wires immediately', () => {
+    const r = createRegistry(noopCallbacks());
+    const room = r.get('s');
+    room.awareness.setLocalState({ name: 'Alice' });
+
+    const hub = mkAwareness();
+    r.attachHubAwareness('s', hub);
+
+    // Pre-existing room state is exchanged at wire time.
+    expect((hub.getStates().get(room.awareness.clientID) as { name?: string })?.name).toBe('Alice');
+  });
+
+  test('detach stops relaying and prevents re-wire on a fresh room', async () => {
+    const r = createRegistry(noopCallbacks());
+    const hub = mkAwareness();
+    const detach = r.attachHubAwareness('s', hub);
+    r.get('s');
+
+    detach();
+    await r.drop('s'); // room had no conns → destroyed
+
+    const room2 = r.get('s');
+    room2.awareness.setLocalState({ name: 'Alice' });
+    expect(hub.getStates().has(room2.awareness.clientID)).toBe(false);
+  });
+
+  test('room churn re-wires the bridge (hub awareness persists)', async () => {
+    const r = createRegistry(noopCallbacks());
+    const hub = mkAwareness();
+    r.attachHubAwareness('s', hub);
+
+    const room1 = r.get('s');
+    room1.awareness.setLocalState({ name: 'Alice' });
+    expect(hub.getStates().has(room1.awareness.clientID)).toBe(true);
+
+    await r.drop('s'); // last browser left
+
+    const room2 = r.get('s'); // browser reconnects
+    room2.awareness.setLocalState({ name: 'Alice2' });
+    expect((hub.getStates().get(room2.awareness.clientID) as { name?: string })?.name).toBe(
+      'Alice2'
+    );
+  });
+
+  test('destroyAll tears down bridges without throwing', async () => {
+    const r = createRegistry(noopCallbacks());
+    const hub = mkAwareness();
+    r.attachHubAwareness('s', hub);
+    r.get('s').awareness.setLocalState({ name: 'Alice' });
+
+    await r.destroyAll();
+    // Hub Awareness is no longer relayed-to; setting a fresh room would not
+    // re-wire because destroyAll cleared the attachment.
+    const room = r.get('s');
+    room.awareness.setLocalState({ name: 'Bob' });
+    expect(hub.getStates().has(room.awareness.clientID)).toBe(false);
+  });
+});
+
+describe('cross-peer cursor relay (Room A → hub → Room B)', () => {
+  test('a cursor published in one peer reaches the other peer', () => {
+    // Peer A: room A ↔ hubA. Peer B: room B ↔ hubB. hubA ↔ hubB is the
+    // Hocuspocus relay (simulated by linkAwareness).
+    const regA = createRegistry(noopCallbacks());
+    const regB = createRegistry(noopCallbacks());
+    const hubA = mkAwareness();
+    const hubB = mkAwareness();
+    linkAwareness(hubA, hubB);
+    regA.attachHubAwareness('canvas', hubA);
+    regB.attachHubAwareness('canvas', hubB);
+
+    const roomA = regA.get('canvas');
+    const roomB = regB.get('canvas');
+
+    roomA.awareness.setLocalState({ name: 'Alice', cursor: { x: 10, y: 20 } });
+
+    const onB = roomB.awareness.getStates().get(roomA.awareness.clientID) as
+      | { name?: string; cursor?: { x: number; y: number } }
+      | undefined;
+    expect(onB?.name).toBe('Alice');
+    expect(onB?.cursor).toEqual({ x: 10, y: 20 });
+  });
+});