@bendyline/squisq-editor-react 2.0.1 → 2.2.0

package/src/__tests__/layersPanel.test.tsx

@@ -1,167 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-import { describe, it, expect, vi } from 'vitest';
-import { fireEvent, render, screen } from '@testing-library/react';
-import type { ImageEditDoc } from '@bendyline/squisq/schemas';
-import { LayersPanel } from '../imageEditor/LayersPanel.js';
-import type { ImageEditorAction } from '../imageEditor/state.js';
-
-const ignoreAddLayer = () => {};
-
-function buildDoc(): ImageEditDoc {
-  return {
-    version: 1,
-    canvas: { width: 100, height: 100 },
-    layers: [
-      {
-        id: 'a',
-        type: 'shape',
-        name: 'Bottom',
-        position: { x: 0, y: 0, width: 10, height: 10 },
-        content: { shape: 'rect' },
-      },
-      {
-        id: 'b',
-        type: 'text',
-        name: 'Middle',
-        position: { x: 0, y: 0, width: 50, height: 20 },
-        content: { text: 'Hi', style: { fontSize: 16, color: '#000' } },
-      },
-      {
-        id: 'c',
-        type: 'shape',
-        name: 'Top',
-        visible: false,
-        position: { x: 0, y: 0, width: 10, height: 10 },
-        content: { shape: 'rect' },
-      },
-    ],
-  };
-}
-
-describe('LayersPanel', () => {
-  it('renders layers with the top of the SVG stack first', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    const items = screen.getAllByText(/Bottom|Middle|Top/);
-    expect(items[0]?.textContent).toContain('Top');
-    expect(items[items.length - 1]?.textContent).toContain('Bottom');
-  });
-
-  it('clicking the layer name dispatches a select action', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    fireEvent.click(screen.getByText('Middle'));
-    expect(dispatch).toHaveBeenCalledWith({ type: 'select', layerId: 'b' });
-  });
-
-  it('exposes the full layer name as a tooltip when the row is truncated', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    expect(screen.getByTitle('Middle').textContent).toContain('Middle');
-  });
-
-  it('opens the add-layer menu and reports the selected layer kind', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    const onAddLayer = vi.fn();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={onAddLayer}
-      />,
-    );
-
-    fireEvent.click(screen.getByRole('button', { name: 'Add layer' }));
-    expect(screen.getByRole('menu')).toBeTruthy();
-    fireEvent.click(screen.getByRole('menuitem', { name: 'Text layer' }));
-    expect(onAddLayer).toHaveBeenCalledWith('text');
-    expect(screen.queryByRole('menu')).toBeNull();
-  });
-
-  it('toggling visibility dispatches an update-layer action', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    // The "Hide layer" buttons exist for visible layers.
-    const hideButtons = screen.getAllByRole('button', { name: 'Hide layer' });
-    fireEvent.click(hideButtons[0]!); // top-most visible layer is 'b'
-    expect(dispatch).toHaveBeenCalledWith({
-      type: 'update-layer',
-      layerId: 'b',
-      patch: { visible: false },
-    });
-  });
-
-  it('move-up button is disabled at the top of the stack', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    const upButtons = screen.getAllByRole('button', { name: 'Move layer up' });
-    // Visual order is c, b, a; layer 'c' is at the top of the stack and cannot move up.
-    expect((upButtons[0] as HTMLButtonElement).disabled).toBe(true);
-  });
-
-  it('delete button dispatches a remove-layer action', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={buildDoc()}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    const delButtons = screen.getAllByRole('button', { name: 'Delete layer' });
-    fireEvent.click(delButtons[0]!); // top of stack ('c')
-    expect(dispatch).toHaveBeenCalledWith({ type: 'remove-layer', layerId: 'c' });
-  });
-
-  it('shows an empty-state message when there are no layers', () => {
-    const dispatch = vi.fn<(a: ImageEditorAction) => void>();
-    render(
-      <LayersPanel
-        doc={{ version: 1, canvas: { width: 1, height: 1 }, layers: [] }}
-        selectedLayerId={null}
-        dispatch={dispatch}
-        onAddLayer={ignoreAddLayer}
-      />,
-    );
-    expect(screen.getByText(/no layers yet/i)).toBeTruthy();
-  });
-});

package/src/__tests__/layoutChildRoundTrip.test.ts

@@ -1,71 +0,0 @@
-/**
- * Layout child sub-blocks round-trip through the markdown ↔ Tiptap bridge.
- *
- * Layouts now persist each layer as a readable `### {#id} {[type …]}` child
- * heading (no base64 `layers=` blob); a text layer's content is the child's
- * markdown body. These tests pin that serialization seam — the same
- * `data-template` / `data-template-params` / `data-block-attrs` attributes the
- * LayoutAdapter reads back — without standing up a full editor.
- */
-
-import { describe, it, expect } from 'vitest';
-import { markdownToTiptap, tiptapToMarkdown } from '../tiptapBridge';
-
-// Parent title "Pricing" (not "Layout") avoids the bridge's template-label
-// de-dup heuristic, which would strip a title equal to the template's label.
-const LAYOUT = [
-  '## Pricing {[layout]}',
-  '',
-  '### {#text-1} {[text x=360 y=380 width=1200 height=320 align=center]}',
-  '',
-  'Welcome to the **bold** layout',
-  '',
-  '- first point',
-  '- second point',
-  '',
-  '### {#box-1} {[rectangle x=760 y=390 width=400 height=300 fill="#e0e7ff"]}',
-  '',
-  '### {#pic-1} {[image x=40 y=40 width=320 height=240 src=cover.png alt="Cover"]}',
-].join('\n');
-
-describe('Layout child sub-block round-trip', () => {
-  it('extracts a text layer annotation into the template + block-attr attributes', () => {
-    const html = markdownToTiptap('### {#text-1} {[text x=360 y=380 width=1200 height=320]}');
-    expect(html).toContain('data-template="text"');
-    expect(html).toContain('data-template-params="x=360 y=380 width=1200 height=320"');
-    expect(html).toContain('data-block-attrs="#text-1"');
-    expect(html).not.toContain('{[text'); // raw annotation text stripped
-  });
-
-  it('keeps a text layer body (marks + list) as sibling blocks, not in the heading', () => {
-    const html = markdownToTiptap(
-      ['### {#text-1} {[text x=0 y=0]}', '', 'Hello **world**', '', '- a', '- b'].join('\n'),
-    );
-    // Heading is empty; the body is its own paragraph + list.
-    expect(html).toContain('<strong>world</strong>');
-    expect(html).toContain('<ul>');
-    expect(html).toContain('<li>');
-  });
-
-  it('round-trips a full layout (text + box + image) losslessly and idempotently', () => {
-    const back = tiptapToMarkdown(markdownToTiptap(LAYOUT));
-    expect(back).toContain('## Pricing {[layout]}');
-    // Child sub-blocks keep their id + annotation (empty-text headings get an
-    // extra space after `###`, which re-parses identically — assert spacing-free).
-    expect(back).toContain('{#text-1} {[text x=360 y=380 width=1200 height=320 align=center]}');
-    expect(back).toContain(
-      '{#box-1} {[rectangle x=760 y=390 width=400 height=300 fill="#e0e7ff"]}',
-    );
-    expect(back).toContain(
-      '{#pic-1} {[image x=40 y=40 width=320 height=240 src=cover.png alt="Cover"]}',
-    );
-    // The text layer's body markdown survives as readable content.
-    expect(back).toContain('Welcome to the **bold** layout');
-    expect(back).toContain('- first point');
-    expect(back).toContain('- second point');
-    // No base64 layers blob anywhere — the whole point of the change.
-    expect(back).not.toContain('layers=');
-    // Stable: a second pass reproduces the first exactly.
-    expect(tiptapToMarkdown(markdownToTiptap(back))).toBe(back);
-  });
-});

package/src/__tests__/linkDialogDocPicker.test.tsx

@@ -1,137 +0,0 @@
-/**
- * Covers the LinkDialog's "Browse documents" picker added behind the
- * `documentLinkProvider` prop. The picker is purely additive — when
- * the prop is absent the dialog renders its original URL-only layout.
- */
-
-import { describe, expect, it, vi } from 'vitest';
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { LinkDialog } from '../LinkDialog';
-import type { DocumentLinkProvider } from '../EditorContext';
-
-const NEIGHBORS = [
-  { path: 'resume.md', label: 'Resume', description: 'My CV' },
-  { path: 'projects.md', label: 'Projects' },
-  { path: 'misc/notes.md', label: 'Notes', description: 'Scratchpad' },
-];
-
-const provider: DocumentLinkProvider = async (q) => {
-  const query = q.trim().toLowerCase();
-  if (!query) return NEIGHBORS;
-  return NEIGHBORS.filter(
-    (n) => n.label.toLowerCase().includes(query) || n.path.toLowerCase().includes(query),
-  );
-};
-
-describe('LinkDialog — document picker', () => {
-  it('hides the documents tab when no provider is supplied', () => {
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText=""
-        initialUrl=""
-        onConfirm={() => {}}
-        onClose={() => {}}
-      />,
-    );
-    expect(screen.queryByRole('tab', { name: /browse documents/i })).toBeNull();
-  });
-
-  it('shows both tabs when the provider is supplied', () => {
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText=""
-        initialUrl=""
-        onConfirm={() => {}}
-        onClose={() => {}}
-        documentLinkProvider={provider}
-      />,
-    );
-    expect(screen.getByRole('tab', { name: 'URL' })).toBeTruthy();
-    expect(screen.getByRole('tab', { name: 'Browse documents' })).toBeTruthy();
-  });
-
-  it('lists initial candidates when the documents tab opens', async () => {
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText=""
-        initialUrl=""
-        onConfirm={() => {}}
-        onClose={() => {}}
-        documentLinkProvider={provider}
-      />,
-    );
-    fireEvent.click(screen.getByRole('tab', { name: 'Browse documents' }));
-    await waitFor(() => {
-      expect(screen.getByText('Resume')).toBeTruthy();
-      expect(screen.getByText('Projects')).toBeTruthy();
-      expect(screen.getByText('Notes')).toBeTruthy();
-    });
-  });
-
-  it('filters candidates as the user types', async () => {
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText=""
-        initialUrl=""
-        onConfirm={() => {}}
-        onClose={() => {}}
-        documentLinkProvider={provider}
-      />,
-    );
-    fireEvent.click(screen.getByRole('tab', { name: 'Browse documents' }));
-    await waitFor(() => screen.getByText('Resume'));
-    const search = screen.getByLabelText('Search') as HTMLInputElement;
-    fireEvent.change(search, { target: { value: 'proj' } });
-    await waitFor(() => {
-      expect(screen.getByText('Projects')).toBeTruthy();
-      expect(screen.queryByText('Resume')).toBeNull();
-    });
-  });
-
-  it('picking a document fills the URL and auto-fills the caption when empty', async () => {
-    const onConfirm = vi.fn();
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText=""
-        initialUrl=""
-        onConfirm={onConfirm}
-        onClose={() => {}}
-        documentLinkProvider={provider}
-      />,
-    );
-    fireEvent.click(screen.getByRole('tab', { name: 'Browse documents' }));
-    await waitFor(() => screen.getByText('Resume'));
-    fireEvent.click(screen.getByRole('option', { name: /Resume/i }));
-    // After picking, the dialog jumps back to the URL tab so Enter submits.
-    const urlInput = screen.getByLabelText('URL') as HTMLInputElement;
-    expect(urlInput.value).toBe('resume.md');
-    const textInput = screen.getByLabelText('Text') as HTMLInputElement;
-    expect(textInput.value).toBe('Resume');
-    // Submit
-    fireEvent.submit(urlInput.closest('form')!);
-    expect(onConfirm).toHaveBeenCalledWith('Resume', 'resume.md');
-  });
-
-  it('preserves a caption the user already typed when picking a document', async () => {
-    render(
-      <LinkDialog
-        mode="insert"
-        initialText="Read my work"
-        initialUrl=""
-        onConfirm={() => {}}
-        onClose={() => {}}
-        documentLinkProvider={provider}
-      />,
-    );
-    fireEvent.click(screen.getByRole('tab', { name: 'Browse documents' }));
-    await waitFor(() => screen.getByText('Resume'));
-    fireEvent.click(screen.getByRole('option', { name: /Resume/i }));
-    const textInput = screen.getByLabelText('Text') as HTMLInputElement;
-    expect(textInput.value).toBe('Read my work');
-  });
-});

package/src/__tests__/majorApiTypes.test.ts

@@ -1,26 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import type { DiagramEdge, DiagramNode, EditorShellProps } from '../index';
-
-// @ts-expect-error React Flow-prefixed types were removed in the major API cleanup.
-import type { DiagramRFNode } from '../index';
-
-describe('major-version editor API types', () => {
-  it('uses implementation-neutral diagram names', () => {
-    const node: DiagramNode = { id: 'a', position: { x: 0, y: 0 }, data: { label: 'A' } };
-    const edge: DiagramEdge = { id: 'a-b', source: 'a', target: 'b' };
-    expect([node.id, edge.id]).toEqual(['a', 'a-b']);
-  });
-
-  it('does not accept the removed EditorShell container prop', () => {
-    const props: EditorShellProps = {
-      // @ts-expect-error Use workspaceContainer; container was removed.
-      container: null,
-    };
-    expect(props).toHaveProperty('container');
-  });
-
-  it('keeps the old type import absent', () => {
-    const legacy: DiagramRFNode | null = null;
-    expect(legacy).toBeNull();
-  });
-});

package/src/__tests__/mediaAttachmentFlow.test.ts

@@ -1,110 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import type { MediaProvider } from '@bendyline/squisq/schemas';
-import { markdownToTiptap, tiptapToMarkdown } from '../tiptapBridge';
-
-/**
- * Attachment-flow regression: earlier versions of MediaBin dropped
- * uploaded files into the bin without inserting a markdown ref into
- * the editor body. A user would upload an image, hit Send in the
- * downstream chat composer, and the outgoing markdown would have no
- * image reference — the downstream consumer would reply "nothing came through."
- *
- * The fix: after `mediaProvider.addMedia(...)` succeeds, MediaBin
- * fires `onMediaUploaded(relativePath, name, mimeType)`. The
- * EditorShell wires this to an `insertAtCursor` that emits
- * `![alt](attachments/<filename>)` so the file actually participates
- * in the outgoing markdown.
- *
- * These tests exercise the contract directly: the markdown snippet
- * produced by the upload callback, once round-tripped through the
- * editor's markdown↔HTML bridge, must round-trip back to a form
- * the downstream service's image-extraction regex can see.
- */
-
-function fakeMediaProvider(records: string[]): MediaProvider {
-  let counter = 0;
-  return {
-    async addMedia(name: string, _data: ArrayBuffer | Blob | Uint8Array, _mime: string) {
-      counter += 1;
-      const relative = `attachments/${counter}-${name}`;
-      records.push(relative);
-      return relative;
-    },
-    async resolveUrl(relPath: string) {
-      return relPath;
-    },
-    async listMedia() {
-      return [];
-    },
-    async removeMedia(_relPath: string) {
-      /* no-op */
-    },
-    dispose() {
-      /* no-op */
-    },
-  };
-}
-
-/**
- * Re-implements the exact snippet EditorShell's `insertMediaRef`
- * builds. Keeping this aligned with the real impl would ordinarily
- * rely on directly importing the helper; since it's currently inline
- * in EditorShell, mirror the logic here and lean on the test to
- * alert us if we drift apart.
- */
-function buildAttachmentSnippet(relativePath: string, name: string, mimeType: string): string {
-  const alt = name.replace(/\.[^.]+$/, '').replace(/[-_]/g, ' ');
-  return mimeType.startsWith('image/') ? `![${alt}](${relativePath})` : `[${alt}](${relativePath})`;
-}
-
-describe('media attachment flow', () => {
-  it('addMedia → buildAttachmentSnippet → markdown round-trip keeps the ref', async () => {
-    const records: string[] = [];
-    const provider = fakeMediaProvider(records);
-
-    // Simulate MediaBin.handleFileChange for a single PNG drop.
-    const pngBytes = new Uint8Array([0x89, 0x50, 0x4e, 0x47]);
-    const relative = await provider.addMedia('my_screenshot.png', pngBytes, 'image/png');
-
-    expect(records).toEqual([relative]);
-    const snippet = buildAttachmentSnippet(relative, 'my_screenshot.png', 'image/png');
-    expect(snippet).toBe(`![my screenshot](${relative})`);
-
-    // Insert snippet into the editor: markdown → HTML → markdown.
-    // This is the path a real insertAtCursor + tiptap onUpdate goes
-    // through. The outbound markdown must still contain the ref.
-    const html = markdownToTiptap(snippet);
-    expect(html).toMatch(/<img\b/);
-    expect(html).toContain(`src="${relative}"`);
-
-    const back = tiptapToMarkdown(html);
-    expect(back).toContain(`![my screenshot](${relative})`);
-  });
-
-  it('handles empty-alt (most common pasted-image shape)', async () => {
-    const records: string[] = [];
-    const provider = fakeMediaProvider(records);
-    const relative = await provider.addMedia('pasted.png', new Uint8Array([0]), 'image/png');
-
-    // Simulate what happens when alt is empty — common for bare pastes
-    // where the user hasn't typed a caption.
-    const snippet = `![](${relative})`;
-    const html = markdownToTiptap(snippet);
-    expect(html).toMatch(/<img\b/);
-    expect(html).toContain(`src="${relative}"`);
-    const back = tiptapToMarkdown(html);
-    expect(back).toContain(`![](${relative})`);
-  });
-
-  it('non-image files fall back to a plain link, still preserving the ref', async () => {
-    const records: string[] = [];
-    const provider = fakeMediaProvider(records);
-    const relative = await provider.addMedia('design.pdf', new Uint8Array([0]), 'application/pdf');
-    const snippet = buildAttachmentSnippet(relative, 'design.pdf', 'application/pdf');
-    expect(snippet).toBe(`[design](${relative})`);
-    // Non-images don't go through the `<img>` regex — they stay as
-    // plain markdown links, which the service-side extractor ignores
-    // but the UI renders as normal hyperlinks.
-    expect(snippet).not.toContain('!');
-  });
-});

package/src/__tests__/mediaBinDrop.test.tsx

@@ -1,90 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-import { describe, expect, it, vi } from 'vitest';
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import type { MediaEntry, MediaProvider } from '@bendyline/squisq/schemas';
-import { MediaBin } from '../MediaBin.js';
-
-function createProvider(): { provider: MediaProvider; added: string[] } {
-  const entries: MediaEntry[] = [];
-  const added: string[] = [];
-  return {
-    added,
-    provider: {
-      async addMedia(name, data, mimeType) {
-        const relativePath = `attachments/${name}`;
-        added.push(relativePath);
-        entries.push({
-          name: relativePath,
-          mimeType,
-          size: data instanceof Blob ? data.size : data.byteLength,
-        });
-        return relativePath;
-      },
-      async resolveUrl(path) {
-        return `blob:${path}`;
-      },
-      async listMedia() {
-        return [...entries];
-      },
-      async removeMedia() {},
-      dispose() {},
-    },
-  };
-}
-
-function dataTransfer(files: File[], itemTypes: string[]) {
-  return {
-    files,
-    items: itemTypes.map((type) => ({ kind: 'file', type })),
-    types: ['Files'],
-    dropEffect: 'none',
-  };
-}
-
-describe('MediaBin image drop target', () => {
-  it('shows a drop affordance and uploads a dropped image through the normal callback', async () => {
-    const { provider, added } = createProvider();
-    const onMediaUploaded = vi.fn();
-    const image = new File([new Uint8Array([1, 2, 3])], 'photo.png', { type: 'image/png' });
-    Object.defineProperty(image, 'arrayBuffer', {
-      configurable: true,
-      value: async () => new Uint8Array([1, 2, 3]).buffer,
-    });
-
-    const { container } = render(
-      <MediaBin mediaProvider={provider} isDark onMediaUploaded={onMediaUploaded} />,
-    );
-    const bin = container.querySelector('.squisq-media-bin') as HTMLElement;
-    const transfer = dataTransfer([image], ['image/png']);
-    await screen.findByText('No files yet.');
-
-    fireEvent.dragEnter(bin, { dataTransfer: transfer });
-    expect(bin.classList.contains('squisq-media-bin--drop-active')).toBe(true);
-    expect(screen.getByText('Drop images here')).toBeTruthy();
-
-    fireEvent.drop(bin, { dataTransfer: transfer });
-
-    await waitFor(() => expect(added).toEqual(['attachments/photo.png']));
-    expect(onMediaUploaded).toHaveBeenCalledWith('attachments/photo.png', 'photo.png', 'image/png');
-    expect(await screen.findByText('photo.png')).toBeTruthy();
-    expect(screen.queryByText('Drop images here')).toBeNull();
-  });
-
-  it('does not activate or upload for a non-image file', async () => {
-    const { provider, added } = createProvider();
-    const text = new File(['notes'], 'notes.txt', { type: 'text/plain' });
-    const { container } = render(<MediaBin mediaProvider={provider} isDark={false} />);
-    const bin = container.querySelector('.squisq-media-bin') as HTMLElement;
-    const transfer = dataTransfer([text], ['text/plain']);
-    await screen.findByText('No files yet.');
-
-    fireEvent.dragEnter(bin, { dataTransfer: transfer });
-    fireEvent.drop(bin, { dataTransfer: transfer });
-
-    expect(bin.classList.contains('squisq-media-bin--drop-active')).toBe(false);
-    expect(screen.queryByText('Drop images here')).toBeNull();
-    await waitFor(() => expect(added).toEqual([]));
-  });
-});

package/src/__tests__/mediaReferences.test.ts

@@ -1,82 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import {
-  collectMediaReferencesFromMarkdown,
-  removeMediaReferencesFromMarkdown,
-} from '../mediaReferences';
-
-describe('collectMediaReferencesFromMarkdown', () => {
-  it('collects markdown image/link and html media references', () => {
-    const refs = collectMediaReferencesFromMarkdown(
-      [
-        '![One](attachments/one.png)',
-        '[Two](attachments/two.pdf)',
-        '<video src="video/clip.webm" poster="video/poster.png"></video>',
-        '<a href="attachments/three.txt">Three</a>',
-      ].join('\n'),
-    );
-
-    expect([...refs].sort()).toEqual([
-      'attachments/one.png',
-      'attachments/three.txt',
-      'attachments/two.pdf',
-      'video/clip.webm',
-      'video/poster.png',
-    ]);
-  });
-
-  it('collects media references from squiggly annotations', () => {
-    const refs = collectMediaReferencesFromMarkdown(
-      [
-        '## Intro {[audio=audio/take.mp3]}',
-        '{[video src="video/clip with spaces.webm"]}',
-        '### Image {#hero} {[image src=images/hero.png alt="Hero"]}',
-      ].join('\n'),
-    );
-
-    expect([...refs].sort()).toEqual([
-      'audio/take.mp3',
-      'images/hero.png',
-      'video/clip with spaces.webm',
-    ]);
-  });
-});
-
-describe('removeMediaReferencesFromMarkdown', () => {
-  it('removes standalone image references to the media path', () => {
-    const source = ['Before', '', '![Screenshot](attachments/pasted.png)', '', 'After'].join('\n');
-
-    expect(removeMediaReferencesFromMarkdown(source, 'attachments/pasted.png')).toBe(
-      ['Before', '', '', 'After'].join('\n'),
-    );
-  });
-
-  it('removes inline image and link references without touching similar paths', () => {
-    const source = [
-      'Keep ![Other](attachments/pasted.png.backup).',
-      'Drop ![Screenshot](attachments/pasted.png) and [file](attachments/pasted.png).',
-    ].join('\n');
-
-    expect(removeMediaReferencesFromMarkdown(source, 'attachments/pasted.png')).toBe(
-      ['Keep ![Other](attachments/pasted.png.backup).', 'Drop  and .'].join('\n'),
-    );
-  });
-
-  it('supports angle-wrapped destinations and markdown titles', () => {
-    const source =
-      'Drop ![A](<attachments/my pasted image.png>) and [A](attachments/simple.png "title").';
-
-    expect(removeMediaReferencesFromMarkdown(source, 'attachments/my pasted image.png')).toBe(
-      'Drop  and [A](attachments/simple.png "title").',
-    );
-    expect(removeMediaReferencesFromMarkdown(source, 'attachments/simple.png')).toBe(
-      'Drop ![A](<attachments/my pasted image.png>) and .',
-    );
-  });
-
-  it('removes resized raw HTML image tags and raw HTML anchors', () => {
-    const source =
-      '<img alt="Screenshot" src="attachments/pasted.png" width="320">\n<a href="attachments/pasted.png">Screenshot</a>';
-
-    expect(removeMediaReferencesFromMarkdown(source, 'attachments/pasted.png')).toBe('\n');
-  });
-});