@1agh/maude 0.39.1 → 0.40.0

package/apps/studio/input-router.tsx

@@ -345,7 +345,13 @@ export function isEditableTarget(t: EventTarget | null): boolean {
  */
 export function isOverlayTarget(t: EventTarget | null): boolean {
   if (!t || !(t as Element).closest) return false;
-  return !!(t as Element).closest('.cm-composer, .cm-thread, .cm-mention-popup, .cm-pin');
+  // [data-mediaref-player] — the inline <video>/<audio controls> on a media
+  // reference chip (DDR-150 dogfood #8). The router must never claim (and
+  // preventDefault) pointerdowns over the player, or its native controls
+  // (play button, scrubber drag, volume) die under the move tool.
+  return !!(t as Element).closest(
+    '.cm-composer, .cm-thread, .cm-mention-popup, .cm-pin, [data-mediaref-player]'
+  );
 }
 
 export function useInputRouter(opts: UseInputRouterOptions): void {

package/apps/studio/runtime-bundle.ts

@@ -79,6 +79,36 @@ export const RUNTIME_PACKAGES = [
   // every real canvas) returned HTTP 500 "Bundle failed".
   'lib0/decoding',
   'lib0/encoding',
+  // DDR-148 — Remotion video-comp authoring. `remotion` carries the React
+  // context stack (RemotionEnvironment / Sequence / Timeline) that a video-comp
+  // canvas AND the `<Player>` preview BOTH consume — so it MUST be a single
+  // externalised bundle (importmap-shared), exactly like React itself, or the
+  // Player's provider and the composition's `useCurrentFrame()` bind to
+  // different context instances and the comp renders frozen at frame 0 (the
+  // dual-package hazard). `@remotion/player` + `@remotion/transitions` each
+  // externalise `remotion` (→ the one bundle) and INLINE their own stateless
+  // helpers — `remotion/no-react` (interpolate/random/validators/NoReactInternals,
+  // all pure), plus `@remotion/paths`/`@remotion/shapes` for transitions — which
+  // hold no cross-package state, so a per-bundle copy is harmless. NOT shipping
+  // `@remotion/renderer`/`@remotion/web-renderer` (export goes through the
+  // capture spine). Pre-built into dist/runtime + floored in .min-sizes.json.
+  'remotion',
+  '@remotion/player',
+  '@remotion/media',
+  '@remotion/transitions',
+  // Transition presentations are separate subpath modules by design (Remotion
+  // tree-shakes to what you import). But a canvas import specifier that isn't
+  // in RUNTIME_PACKAGES tries to resolve against the USER's node_modules at
+  // request-time Bun.build — which doesn't exist on an npm/marketplace install
+  // — so EVERY presentation the skill teaches must be pre-bundled + importmap-
+  // routed. v1 ships the six core wipes ("join 4 clips + crossfade" vocabulary);
+  // exotic presentations (dreamy-zoom, film-burn, …) are a documented follow-up.
+  '@remotion/transitions/fade',
+  '@remotion/transitions/slide',
+  '@remotion/transitions/wipe',
+  '@remotion/transitions/flip',
+  '@remotion/transitions/clock-wipe',
+  '@remotion/transitions/none',
 ] as const;
 
 export type RuntimePackage = (typeof RUNTIME_PACKAGES)[number];

package/apps/studio/server.ts

@@ -18,13 +18,13 @@ import { spawn } from 'node:child_process';
 
 import { createAcp } from './acp/index.ts';
 import { createActivity } from './activity.ts';
-import { createApi } from './api.ts';
+import { ASSET_MAX_VIDEO_BYTES, createApi } from './api.ts';
 import { bootSelfHeal } from './boot-self-heal.ts';
 import { createCanvasListWatch } from './canvas-list-watch.ts';
 import { type AiActivityEntry, createAiActivity } from './collab/ai-activity.ts';
 import { createGitLifecycle } from './collab/git-lifecycle.ts';
 import { createCollab } from './collab/index.ts';
-import { createContext } from './context.ts';
+import { createContext, reloadConfig } from './context.ts';
 import { createFsWatch } from './fs-watch.ts';
 import { createGitWatch } from './git/watch.ts';
 import { createHttp } from './http.ts';
@@ -124,13 +124,16 @@ const { port: BASE_PORT, explicit: PORT_EXPLICIT } = resolvePort();
 
 type BunServer = ReturnType<typeof Bun.serve<WsData, never>>;
 
-// Phase 23 security review (DDR-088 follow-up) — hard ceiling on a buffered
-// request body. Without it Bun's 128 MB default applies, so `POST /_api/asset`
-// would buffer up to 128 MB into RAM BEFORE api.saveAsset's 10 MB check runs
-// (memory amplification from the untrusted canvas origin). 16 MB covers every
-// legit body (10 MB asset + 1 MB annotation SVG + small JSON) with headroom and
-// bounds the pre-handler buffer; the authoritative per-route caps still apply.
-const MAX_REQUEST_BODY = 16 * 1024 * 1024;
+// Phase 23 security review (DDR-088) + DDR-148 — hard ceiling on a request
+// body. Bun's 128 MB default would let the untrusted canvas origin send huge
+// bodies to any route. DDR-088 pinned this at 16 MB. DDR-148 raises it to the
+// video cap + 8 MB headroom so `POST /_api/asset` can accept a 100 MB clip —
+// but that route now STREAMS the body to disk (saveAssetFromStream), so a big
+// upload never lands as one ArrayBuffer in RAM. Other routes keep their small
+// LOGICAL caps (annotation 1 MB, JSON) — a body over those still rejects; the
+// only change is Bun accepts more bytes pre-handler (a bandwidth-bounded
+// transient-buffer tradeoff on the buffering routes, noted in DDR-148).
+const MAX_REQUEST_BODY = ASSET_MAX_VIDEO_BYTES + 8 * 1024 * 1024;
 
 function startServer(port: number): BunServer {
   return Bun.serve<WsData, never>({
@@ -401,6 +404,28 @@ const gitWatch = createGitWatch(ctx);
 // `.ai/logs/rca/issue-acp-new-canvas-not-in-filetree.md`.
 const canvasListWatch = createCanvasListWatch(ctx);
 
+// Config hot-reload — `/design:setup-ds` (or a hand edit) rewrites
+// `.design/config.json` mid-session; without a re-read the server keeps
+// serving the boot snapshot and a newly added canvas group (`system`) never
+// reaches /_index-data, so scaffolded DS files stay invisible even on a
+// manual tree reload. On change: swap ctx.cfg in place (reloadConfig), let
+// canvasListWatch's set-diff emit `canvas-list-update` for canvases the new
+// groups uncover, and tell shells to refetch /_config.
+// RCA: .ai/logs/rca/issue-ds-scaffold-files-not-in-filetree-stale-config.md
+const CONFIG_RELOAD_DEBOUNCE_MS = 150;
+let configReloadTimer: ReturnType<typeof setTimeout> | null = null;
+ctx.bus.on('fs:json', (rel: string) => {
+  if (rel.replace(/\\/g, '/').replace(/^\/+/, '') !== 'config.json') return;
+  if (configReloadTimer) clearTimeout(configReloadTimer);
+  configReloadTimer = setTimeout(() => {
+    configReloadTimer = null;
+    if (!reloadConfig(ctx)) return;
+    console.log('  config.json changed — reloaded live.');
+    void canvasListWatch.refresh();
+    ctx.bus.emit('config-updated');
+  }, CONFIG_RELOAD_DEBOUNCE_MS);
+});
+
 // Phase 9 Task 4 — bidirectional sync agent. No-op when the project isn't
 // linked to a hub (`.design/config.json` has no `linkedHub` field). Kicked
 // off after fsWatch so the agent's bus subscription receives every fs event.

package/apps/studio/test/annotations-roundtrip.test.ts

@@ -16,6 +16,7 @@ import {
   type ArrowStroke,
   type ImageStroke,
   type LinkStroke,
+  type MediaRefStroke,
   type RectStroke,
   type StickyStroke,
   type Stroke,
@@ -314,6 +315,52 @@ describe('annotations round-trip / link chip (Phase 23)', () => {
   });
 });
 
+describe('annotations round-trip / media-reference chip (DDR-150 P4)', () => {
+  const ref: MediaRefStroke = {
+    id: 'mr1',
+    tool: 'mediaref',
+    x: 120,
+    y: 90,
+    w: 240,
+    h: 72,
+    src: 'assets/9f8e7d6c.mp4',
+    mediaKind: 'video',
+    title: 'b-roll-sunset.mp4',
+  };
+
+  test('mediaref survives serialize → parse with all fields intact', () => {
+    const [parsed] = svgToStrokes(strokesToSvg([ref])) as MediaRefStroke[];
+    expect(parsed).toEqual(ref);
+  });
+
+  test('mediaref persists data-src (the agent enumerates refs off it), never a <Video>', () => {
+    const svg = strokesToSvg([ref]);
+    expect(svg).toContain('data-src="assets/9f8e7d6c.mp4"');
+    expect(svg).toContain('data-media-kind="video"');
+    expect(svg).not.toContain('<Video');
+    expect(svg).not.toContain('<video');
+  });
+
+  test('mediaref serialize → parse is idempotent', () => {
+    const once = strokesToSvg([{ ...ref, mediaKind: 'audio', src: 'assets/track.mp3' }]);
+    expect(reparse(once)).toBe(once);
+  });
+
+  test('mediaref SVG survives sanitizeAnnotationSvg byte-intact (PUT-path)', () => {
+    const svg = strokesToSvg([ref]);
+    expect(sanitizeAnnotationSvg(svg)).toBe(svg);
+  });
+
+  test('a data-src with a traversal/scheme is dropped to an inert empty ref', () => {
+    const svg =
+      '<svg xmlns="http://www.w3.org/2000/svg" data-mdcc-annotations="1">' +
+      '<g data-id="mr2" data-tool="mediaref" data-src="../../etc/passwd" data-media-kind="video" data-title="x">' +
+      '<rect x="0" y="0" width="240" height="72" rx="8" ry="8"/></g></svg>';
+    const [parsed] = svgToStrokes(svg) as MediaRefStroke[];
+    expect(parsed?.src).toBe('');
+  });
+});
+
 describe('annotations round-trip / standalone vs anchored text', () => {
   test('standalone text round-trips its world (x, y) and stays unanchored', () => {
     const t: TextStroke = {

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

@@ -122,6 +122,82 @@ describe('/_api/canvas — POST round-trip', () => {
     }
   });
 
+  test('assembles a video-comp (kind: video-comp) from dropped clips (DDR-150 P4 Task 12)', async () => {
+    const { root, designRoot } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      const r = await fetch(`http://localhost:${port}/_api/canvas`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          name: 'My Reel',
+          kind: 'video-comp',
+          fps: 30,
+          clips: [
+            { src: 'assets/a.mp4', mediaKind: 'video', durationInFrames: 60 },
+            { src: 'assets/b.mp4', mediaKind: 'video' },
+            { src: 'assets/music.mp3', mediaKind: 'audio' },
+          ],
+        }),
+      });
+      expect(r.status).toBe(201);
+      const j = (await r.json()) as { ok: boolean; rel: string };
+      expect(j.ok).toBe(true);
+      const tsx = readFileSync(join(designRoot, 'ui', 'My Reel.tsx'), 'utf8');
+      expect(tsx).toContain('<VideoComp component={Comp}');
+      expect(tsx).toContain('<OffthreadVideo src="assets/a.mp4" />');
+      expect(tsx).toContain('<Audio src="assets/music.mp3" />');
+      expect(tsx).toContain('name="clip-1"');
+      const m = JSON.parse(readFileSync(join(designRoot, 'ui', 'My Reel.meta.json'), 'utf8'));
+      expect(m.kind).toBe('video-comp');
+    } finally {
+      await killProc(proc);
+    }
+  });
+
+  test('rejects a video-comp with an empty clips[] (400) and a traversal src (400)', async () => {
+    const { root } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      const empty = await fetch(`http://localhost:${port}/_api/canvas`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ name: 'Empty', kind: 'video-comp', clips: [] }),
+      });
+      expect(empty.status).toBe(400);
+      const bad = await fetch(`http://localhost:${port}/_api/canvas`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          name: 'Bad',
+          kind: 'video-comp',
+          clips: [{ src: '../../etc/passwd', mediaKind: 'video' }],
+        }),
+      });
+      expect(bad.status).toBe(400);
+    } finally {
+      await killProc(proc);
+    }
+  });
+
+  test('rejects a cross-origin create (CSRF guard on /_api/canvas — DDR-150 P4)', async () => {
+    const { root } = makeSandbox();
+    const port = nextPort();
+    const proc = await bootServer(root, port);
+    try {
+      const r = await fetch(`http://localhost:${port}/_api/canvas`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json', Origin: 'http://evil.example' },
+        body: JSON.stringify({ name: 'Forged', kind: 'brief-board' }),
+      });
+      expect(r.status).toBe(403);
+    } finally {
+      await killProc(proc);
+    }
+  });
+
   test('create + delete emit canvas-list-update over the inspector WS (Phase 30)', async () => {
     const { root } = makeSandbox();
     const port = nextPort();

package/apps/studio/test/canvas-edit.test.ts

@@ -123,6 +123,59 @@ describe('canvas-edit / applyEdit', () => {
     expect(out.source).toContain('<div style={{ padding: 14 }}>x</div>');
   });
 
+  test('retime: bumps a referenced const so a derived total moves in lock-step (DDR-148)', async () => {
+    const { applyRetimeSequence } = await import('../canvas-edit.ts');
+    const src = [
+      'const A = 66;',
+      'const B = 62;',
+      'const XF = 16;',
+      'const TOTAL = A + B - XF;',
+      'function Movie(){ return (<TransitionSeries>',
+      '  <TransitionSeries.Sequence durationInFrames={A}><Intro/></TransitionSeries.Sequence>',
+      '  <TransitionSeries.Transition timing={linearTiming({ durationInFrames: XF })} />',
+      '  <TransitionSeries.Sequence durationInFrames={B}><Payoff/></TransitionSeries.Sequence>',
+      '</TransitionSeries>); }',
+    ].join('\n');
+    const r0 = applyRetimeSequence(CANVAS, src, 0, { durationInFrames: 80 });
+    expect(r0.source).toContain('const A = 80'); // const edited, not the literal
+    expect(r0.source).toContain('const TOTAL = A + B - XF'); // derived total intact → auto-updates
+    const r1 = applyRetimeSequence(CANVAS, r0.source, 1, { durationInFrames: 90 });
+    expect(r1.source).toContain('const B = 90');
+  });
+
+  test('retime: edits a literal in place + supports from', async () => {
+    const { applyRetimeSequence } = await import('../canvas-edit.ts');
+    const src =
+      'function C(){ return <Sequence from={10} durationInFrames={40}><Foo/></Sequence>; }';
+    const r = applyRetimeSequence(CANVAS, src, 0, { from: 20, durationInFrames: 55 });
+    expect(r.source).toContain('from={20}');
+    expect(r.source).toContain('durationInFrames={55}');
+  });
+
+  test('retime: an out-of-range sequence index throws', async () => {
+    const { applyRetimeSequence, CanvasEditError } = await import('../canvas-edit.ts');
+    const src = 'function C(){ return <Sequence durationInFrames={40}><Foo/></Sequence>; }';
+    expect(() => applyRetimeSequence(CANVAS, src, 5, { durationInFrames: 10 })).toThrow(
+      CanvasEditError
+    );
+  });
+
+  test('inserts into a style object with a TRAILING comma without a double comma (DDR-148 #4)', () => {
+    // A frame-driven inline style commonly ends the last property with a
+    // trailing comma. Appending must NOT produce `opacity: o, , color: …`
+    // (a syntax error that made the canvas render the OLD source on replay).
+    const src =
+      'function Demo() {\n  const o = 1;\n  return <div style={{ fontSize: 12, opacity: o, }}>x</div>;\n}';
+    const ids = idsOf(src);
+    const id = ids.div as string;
+    const out = applyEdit(CANVAS, src, id, 'style.color', "'#d48917'");
+    expect(out.source).toContain("color: '#d48917'");
+    expect(out.source).not.toMatch(/,\s*,/); // no double comma
+    // And it must still parse.
+    const reparse = applyEdit(CANVAS, out.source, id, 'style.fontSize', '13');
+    expect(reparse.source).toContain('fontSize: 13');
+  });
+
   test('throws CanvasEditError when id is not found', () => {
     const src = 'function Demo() { return <div>x</div>; }';
     expect(() => applyEdit(CANVAS, src, 'deadbeef', 'className', 'x')).toThrow(CanvasEditError);
@@ -290,6 +343,30 @@ describe('canvas-edit / applyTextEdit', () => {
     const src = `function Demo() { return <button>Save</button>; }`;
     expect(() => applyTextEdit(CANVAS, src, 'deadbeef', 'x')).toThrow(CanvasEditError);
   });
+
+  // DDR-150 P1 — widen the editable set to a single `{'string literal'}` child.
+  test('edits a single string-literal expression child', () => {
+    const src = `function Demo() { return <h1>{'Old Title'}</h1>; }`;
+    const id = idsOf(src).h1 as string;
+    const out = applyTextEdit(CANVAS, src, id, 'New Title');
+    expect(out.source).toBe(`function Demo() { return <h1>{"New Title"}</h1>; }`);
+  });
+
+  test('string-literal rewrite is inert — quotes / braces / markup cannot escape the JS string', () => {
+    const src = `function Demo() { return <h1>{"x"}</h1>; }`;
+    const id = idsOf(src).h1 as string;
+    const out = applyTextEdit(CANVAS, src, id, 'say "hi" {expr} <b>');
+    // JSON.stringify escapes the double-quotes; {expr} / <b> stay INSIDE the JS
+    // string literal, so they never become a JSX expression or markup.
+    expect(out.source).toContain('say \\"hi\\"');
+    expect(() => transpileCanvasSource(CANVAS, out.source)).not.toThrow();
+  });
+
+  test('still refuses a dynamic {identifier} child (routes to /design:edit)', () => {
+    const src = 'function Demo() { const title = "x"; return <h1>{title}</h1>; }';
+    const id = idsOf(src).h1 as string;
+    expect(() => applyTextEdit(CANVAS, src, id, 'x')).toThrow(CanvasEditError);
+  });
 });
 
 // Phase 12 (DDR-103) — the `style.<prop>` write path the CSS knobs ride
@@ -316,4 +393,17 @@ describe('canvas-edit / applyEdit style.<prop> (CSS-knob path)', () => {
     const out = applyEdit(CANVAS, src, id, 'style.padding', '"var(--space-3)"');
     expect(out.source).toContain('style={{ padding: "var(--space-3)" }}');
   });
+
+  // DDR-150 P1 — the exact video-comp shape: a var-valued prop ending in a
+  // trailing comma. Unconditionally prepending ", " produced `opacity: o, ,
+  // color` — a syntax error that left the Player rendering stale source (the
+  // "my CSS edit resets on replay" bug). Guarded by editStyleProp's between-scan.
+  test('appends onto a frame-driven inline style ending in a trailing comma (no double comma)', () => {
+    const src = `function Demo() { const o = 1; return <div style={{ opacity: o, }}>x</div>; }`;
+    const id = idsOf(src).div as string;
+    const out = applyEdit(CANVAS, src, id, 'style.color', '"var(--fg-0)"');
+    expect(out.source).not.toContain(', ,');
+    expect(out.source).toContain('color: "var(--fg-0)"');
+    expect(() => transpileCanvasSource(CANVAS, out.source)).not.toThrow();
+  });
 });

package/apps/studio/test/canvas-list-watch.test.ts

@@ -320,3 +320,52 @@ describe('canvas-list-watch / real fs-watch end-to-end', () => {
     }
   }, 10_000);
 });
+
+describe('canvas-list-watch / config hot-reload (stale-config RCA)', () => {
+  // /design:setup-ds adds the `system` group to config.json mid-session;
+  // reloadConfig (context.ts) swaps ctx.cfg in place. The watcher must read
+  // groups at USE time — a boot-captured groupPaths list would keep gating
+  // the new group's files out forever.
+  // RCA: .ai/logs/rca/issue-ds-scaffold-files-not-in-filetree-stale-config.md
+  test('a group added by an in-place cfg swap uncovers its canvases', async () => {
+    const { root, designRoot } = sandbox();
+    mkdirSync(join(designRoot, 'system', 'kanban-glass', 'preview'), { recursive: true });
+    const ctx = mkCtx(designRoot);
+    // Pre-scaffold fixture shape: UI-only group.
+    ctx.cfg.canvasGroups = [{ label: 'UI', path: 'ui' }];
+    const got = collect(ctx);
+    const w = createCanvasListWatch(ctx, { debounceMs: 10 });
+    await w.ready;
+    try {
+      // Scaffold writes specimens while the group is still absent — no emit.
+      writeFileSync(join(designRoot, 'system', 'kanban-glass', 'preview', 'colors.tsx'), TSX);
+      ctx.bus.emit('fs:any', 'system/kanban-glass/preview/colors.tsx');
+      await new Promise((r) => setTimeout(r, 10 + 40));
+      await w.refresh();
+      expect(got).toHaveLength(0);
+
+      // Hot reload: new array on the SAME cfg object (what reloadConfig does),
+      // then the server.ts subscriber calls refresh() — the diff must surface
+      // the pre-existing specimen.
+      ctx.cfg.canvasGroups = [
+        { label: 'Design system', path: 'system' },
+        { label: 'UI', path: 'ui' },
+      ];
+      await w.refresh();
+      expect(got).toHaveLength(1);
+      expect(got[0]?.action).toBe('added');
+      expect(got[0]?.rel).toBe('system/kanban-glass/preview/colors.tsx');
+
+      // And FUTURE writes under the new group pass the live fs:any gate.
+      got.length = 0;
+      writeFileSync(join(designRoot, 'system', 'kanban-glass', 'preview', 'type.tsx'), TSX);
+      ctx.bus.emit('fs:any', 'system/kanban-glass/preview/type.tsx');
+      await new Promise((r) => setTimeout(r, 10 + 40));
+      await w.refresh();
+      expect(got.some((m) => m.action === 'added' && m.rel?.endsWith('type.tsx'))).toBe(true);
+    } finally {
+      w.stop();
+      rmSync(root, { recursive: true, force: true });
+    }
+  });
+});

package/apps/studio/test/canvas-media-drop.test.ts

@@ -13,6 +13,7 @@ import {
   isHttpUrl,
   linkDomain,
   type MediaPayload,
+  mediaSnippet,
   normalizeUrl,
   prettifyUrl,
 } from '../use-canvas-media-drop.tsx';
@@ -116,10 +117,38 @@ describe('use-canvas-media-drop / classifyMediaPayload (dispatch matrix)', () =>
     expect(intent?.kind).toBe('image');
   });
 
-  test('a non-image file is ignored', () => {
+  test('a non-image, non-media file is ignored', () => {
     expect(classifyMediaPayload({ ...empty, files: [fakeFile('application/pdf')] })).toBeNull();
   });
 
+  test('a video file → a media intent (DDR-148)', () => {
+    const intent = classifyMediaPayload({ ...empty, files: [fakeFile('video/mp4')] });
+    expect(intent).toEqual({ kind: 'media', file: expect.anything(), mediaKind: 'video' });
+  });
+
+  test('an audio file → a media intent', () => {
+    const intent = classifyMediaPayload({ ...empty, files: [fakeFile('audio/mpeg')] });
+    expect(intent?.kind).toBe('media');
+    expect(intent && intent.kind === 'media' && intent.mediaKind).toBe('audio');
+  });
+
+  test('an image still wins over a co-dropped video', () => {
+    const intent = classifyMediaPayload({
+      ...empty,
+      files: [fakeFile('image/png'), fakeFile('video/mp4')],
+    });
+    expect(intent?.kind).toBe('image');
+  });
+
+  test('mediaSnippet emits the right Remotion element', () => {
+    expect(mediaSnippet('video', 'assets/ab12cd34.mp4')).toBe(
+      '<Video src="assets/ab12cd34.mp4" />'
+    );
+    expect(mediaSnippet('audio', 'assets/ff00aa11.mp3')).toBe(
+      '<Audio src="assets/ff00aa11.mp3" />'
+    );
+  });
+
   test('a URL drop becomes a link with the anchor text as the title', () => {
     const intent = classifyMediaPayload({
       ...empty,

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

@@ -67,6 +67,25 @@ describe('canvas-origin gate — A1/A2 traversal + privilege containment', () =>
         '/_api/edit-css',
         '/_api/edit-text',
         '/_api/edit-attr',
+        // DDR-148 — raw canvas source for the Timeline parser is MAIN-ORIGIN
+        // ONLY (the untrusted canvas iframe must never read project source).
+        '/_api/canvas-source',
+        // DDR-148 — Timeline drag-to-retime is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/retime-sequence',
+        // DDR-150 P2 — the clip enumerator reads project source structure, so it
+        // is MAIN-ORIGIN ONLY (same boundary as /_api/canvas-source): the
+        // untrusted canvas iframe must never enumerate the comp it renders.
+        '/_api/comp-clips',
+        // DDR-150 P3 — clip removal is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/remove-sequence',
+        // DDR-150 P4 — clip insert is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/insert-sequence',
+        // DDR-150 P5 — z-order reorder is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/reorder-sequence',
+        // DDR-150 dogfood — array-src replace is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/edit-array-src',
+        // DDR-150 dogfood — clip hide/show is a source-write, MAIN-ORIGIN ONLY.
+        '/_api/toggle-hide',
         // Phase 12.1 (DDR-138) — node-move reorder is a source-write, MAIN-ORIGIN
         // ONLY. The canvas iframe requests a reorder over the dgn:* bus; the shell
         // performs the write. A GET here 403s at the gate (route unreachable on
@@ -141,9 +160,26 @@ describe('canvas-origin gate — A1/A2 traversal + privilege containment', () =>
       const shell = await fetch(`${canvas}/_canvas-shell.html`);
       const csp = shell.headers.get('content-security-policy') ?? '';
       expect(csp).toContain("connect-src 'self'");
+      // DDR-148 — media-src must be present so a video-comp's <Video>/<Audio>
+      // isn't blocked by default-src 'none' (black video / silent audio).
+      expect(csp).toContain("media-src 'self'");
       expect(csp).toContain("webrtc 'block'");
       expect(csp).toContain('frame-ancestors');
       expect(csp).toContain(`http://localhost:${port}`);
+
+      // (5) DDR-148 attacker F1 — the EXPORT/CAPTURE render (?hide-chrome=1) on
+      // the MAIN origin (where the normal shell CSP is off) MUST carry the
+      // network-locked capture CSP, else a canvas <Video src="http://internal">
+      // or comp fetch() turns ⌘E into read-SSRF + exfil-via-artifact.
+      const capMain = await fetch(`http://localhost:${port}/_canvas-shell.html?hide-chrome=1`);
+      const capCsp = capMain.headers.get('content-security-policy') ?? '';
+      expect(capCsp).toContain("media-src 'self'"); // <Video src=external> blocked
+      expect(capCsp).toContain("connect-src 'self'"); // comp fetch(external) blocked
+      expect(capCsp).toContain("img-src 'self'");
+      expect(capCsp).toContain("object-src 'none'");
+      // A normal main-origin shell (no capture flag) stays CSP-off (back-compat).
+      const plainMain = await fetch(`http://localhost:${port}/_canvas-shell.html`);
+      expect(plainMain.headers.get('content-security-policy')).toBeNull();
     } finally {
       await killProc(proc);
     }