@elabs-ai/components-viewer 4.0.0

package/src/adapters/pptx/pptx-model.test.ts

@@ -0,0 +1,219 @@
+import { describe, expect, it } from "vitest";
+
+import {
+  notesTarget,
+  orderSlidePaths,
+  parseNotes,
+  parseSlide,
+  resolveRelative,
+  slideNumber,
+  slidesToText,
+  slidesToTextWithMap,
+  PPTX_NOTES_LINE,
+  PPTX_TITLE_LINE,
+} from "./pptx-model";
+
+const parse = (xml: string) => new DOMParser().parseFromString(xml, "application/xml");
+
+const P = "http://schemas.openxmlformats.org/presentationml/2006/main";
+const A = "http://schemas.openxmlformats.org/drawingml/2006/main";
+
+/** A slide document, written the way PowerPoint writes one. */
+const slideXml = (body: string) => `<p:sld xmlns:p="${P}" xmlns:a="${A}">
+  <p:cSld><p:spTree>${body}</p:spTree></p:cSld></p:sld>`;
+
+const shape = (placeholder: string | undefined, paragraphs: string) => `<p:sp>
+  <p:nvSpPr><p:nvPr>${placeholder ? `<p:ph type="${placeholder}"/>` : ""}</p:nvPr></p:nvSpPr>
+  <p:txBody>${paragraphs}</p:txBody></p:sp>`;
+
+const paragraph = (text: string, level?: number) =>
+  `<a:p>${level ? `<a:pPr lvl="${String(level)}"/>` : ""}<a:r><a:t>${text}</a:t></a:r></a:p>`;
+
+describe("orderSlidePaths", () => {
+  it("orders slides numerically, not the way a zip lists them", () => {
+    // "slide10" sorts before "slide2" as a string — the deck would read wrong.
+    expect(
+      orderSlidePaths(["ppt/slides/slide10.xml", "ppt/slides/slide2.xml", "ppt/slides/slide1.xml"]),
+    ).toEqual(["ppt/slides/slide1.xml", "ppt/slides/slide2.xml", "ppt/slides/slide10.xml"]);
+  });
+
+  it("ignores every other part of the package", () => {
+    expect(
+      orderSlidePaths([
+        "ppt/slides/slide1.xml",
+        "ppt/slides/_rels/slide1.xml.rels",
+        "ppt/slideLayouts/slideLayout1.xml",
+        "ppt/notesSlides/notesSlide1.xml",
+        "[Content_Types].xml",
+      ]),
+    ).toEqual(["ppt/slides/slide1.xml"]);
+  });
+
+  it("reads the slide number out of the part name", () => {
+    expect(slideNumber("ppt/slides/slide7.xml")).toBe(7);
+    expect(slideNumber("ppt/presentation.xml")).toBe(0);
+  });
+});
+
+describe("resolveRelative", () => {
+  it("walks `..` the way the package expects", () => {
+    expect(resolveRelative("ppt/slides/slide1.xml", "../notesSlides/notesSlide1.xml")).toBe(
+      "ppt/notesSlides/notesSlide1.xml",
+    );
+  });
+
+  it("resolves a sibling part and an absolute one", () => {
+    expect(resolveRelative("ppt/slides/slide1.xml", "slide2.xml")).toBe("ppt/slides/slide2.xml");
+    expect(resolveRelative("ppt/slides/slide1.xml", "/ppt/presentation.xml")).toBe(
+      "ppt/presentation.xml",
+    );
+  });
+});
+
+describe("notesTarget", () => {
+  const rels = (body: string) =>
+    parse(
+      `<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">${body}</Relationships>`,
+    );
+  const type = (name: string) =>
+    `http://schemas.openxmlformats.org/officeDocument/2006/relationships/${name}`;
+
+  it("follows the slide's own relationship rather than matching slide numbers", () => {
+    // Slide 1 pointing at notesSlide4 is what a deck looks like after slides
+    // have been deleted — matching by number would attach the wrong notes.
+    const document = rels(
+      `<Relationship Id="rId1" Type="${type("slideLayout")}" Target="../slideLayouts/slideLayout1.xml"/>
+       <Relationship Id="rId2" Type="${type("notesSlide")}" Target="../notesSlides/notesSlide4.xml"/>`,
+    );
+    expect(notesTarget(document, "ppt/slides/slide1.xml")).toBe("ppt/notesSlides/notesSlide4.xml");
+  });
+
+  it("returns nothing for a slide with no notes", () => {
+    const document = rels(
+      `<Relationship Id="rId1" Type="${type("slideLayout")}" Target="../slideLayouts/slideLayout1.xml"/>`,
+    );
+    expect(notesTarget(document, "ppt/slides/slide1.xml")).toBeUndefined();
+  });
+});
+
+describe("parseSlide", () => {
+  it("separates the title placeholder from the body text", () => {
+    const slide = parseSlide(
+      parse(
+        slideXml(
+          shape("title", paragraph("Quarterly review")) +
+            shape("body", paragraph("Revenue grew 18%") + paragraph("EMEA beat plan", 1)),
+        ),
+      ),
+      1,
+    );
+    expect(slide.title).toBe("Quarterly review");
+    expect(slide.lines).toEqual([
+      { text: "Revenue grew 18%", level: 0 },
+      { text: "EMEA beat plan", level: 1 },
+    ]);
+  });
+
+  it("treats a centred title as a title", () => {
+    const slide = parseSlide(parse(slideXml(shape("ctrTitle", paragraph("Cover")))), 1);
+    expect(slide.title).toBe("Cover");
+  });
+
+  it("keeps a shape with no placeholder as body text", () => {
+    const slide = parseSlide(parse(slideXml(shape(undefined, paragraph("A loose text box")))), 1);
+    expect(slide.title).toBeUndefined();
+    expect(slide.lines).toEqual([{ text: "A loose text box", level: 0 }]);
+  });
+
+  it("reads a table on the slide, one row per line", () => {
+    const table = `<p:graphicFrame><a:graphic><a:graphicData><a:tbl>
+      <a:tr><a:tc><a:txBody><a:p><a:r><a:t>Region</a:t></a:r></a:p></a:txBody></a:tc>
+            <a:tc><a:txBody><a:p><a:r><a:t>Revenue</a:t></a:r></a:p></a:txBody></a:tc></a:tr>
+    </a:tbl></a:graphicData></a:graphic></p:graphicFrame>`;
+    const slide = parseSlide(parse(slideXml(table)), 2);
+    expect(slide.lines).toEqual([{ text: "Region\tRevenue", level: 0 }]);
+  });
+
+  it("drops empty paragraphs — a blank placeholder is not a bullet", () => {
+    const slide = parseSlide(parse(slideXml(shape("body", "<a:p/>" + paragraph("Real")))), 1);
+    expect(slide.lines).toEqual([{ text: "Real", level: 0 }]);
+  });
+
+  it("returns an empty slide rather than throwing when there is no shape tree", () => {
+    expect(parseSlide(parse(`<p:sld xmlns:p="${P}"/>`), 3)).toEqual({ index: 3, lines: [] });
+  });
+});
+
+describe("parseNotes", () => {
+  it("reads only the notes placeholder, not the copy of the slide beside it", () => {
+    const notes = parseNotes(
+      parse(
+        `<p:notes xmlns:p="${P}" xmlns:a="${A}"><p:cSld><p:spTree>` +
+          shape("sldImg", paragraph("Quarterly review")) +
+          shape("body", paragraph("Open with the revenue number.")) +
+          `</p:spTree></p:cSld></p:notes>`,
+      ),
+    );
+    expect(notes).toBe("Open with the revenue number.");
+  });
+
+  it("returns nothing when the notes part holds no notes", () => {
+    expect(parseNotes(parse(`<p:notes xmlns:p="${P}"/>`))).toBeUndefined();
+  });
+});
+
+describe("slidesToText", () => {
+  it("projects titles, lines and notes into one searchable string", () => {
+    expect(
+      slidesToText([
+        { index: 1, title: "Quarterly review", lines: [{ text: "Revenue grew 18%", level: 0 }] },
+        { index: 2, title: "Regions", lines: [], notes: "Hand over to Sam." },
+      ]),
+    ).toBe("Quarterly review\nRevenue grew 18%\n\nRegions\nHand over to Sam.");
+  });
+});
+
+describe("slidesToTextWithMap", () => {
+  it("maps every chunk back to the slide and line it came from", () => {
+    const { text, spans } = slidesToTextWithMap([
+      {
+        index: 1,
+        title: "Quarterly review",
+        lines: [
+          { text: "Revenue grew 18%", level: 0 },
+          { text: "EMEA beat plan", level: 1 },
+        ],
+        notes: "Hand over to Sam.",
+      },
+      { index: 2, title: "Regions", lines: [] },
+    ]);
+
+    expect(spans.map((span) => [text.slice(span.start, span.end), span.ref])).toEqual([
+      ["Quarterly review", { slide: 1, line: PPTX_TITLE_LINE }],
+      ["Revenue grew 18%", { slide: 1, line: 0 }],
+      ["EMEA beat plan", { slide: 1, line: 1 }],
+      ["Hand over to Sam.", { slide: 1, line: PPTX_NOTES_LINE }],
+      ["Regions", { slide: 2, line: PPTX_TITLE_LINE }],
+    ]);
+  });
+
+  it("refs the slide's own number, not its position, so a gap cannot misattribute", () => {
+    const { spans } = slidesToTextWithMap([{ index: 7, lines: [{ text: "Only line", level: 0 }] }]);
+    expect(spans[0]?.ref).toEqual({ slide: 7, line: 0 });
+  });
+
+  it("is the one definition of the projection", () => {
+    const slides = [{ index: 1, title: "A", lines: [], notes: "B" }];
+    expect(slidesToText(slides)).toBe(slidesToTextWithMap(slides).text);
+  });
+
+  it("contributes nothing for a slide with no text at all", () => {
+    const { text, spans } = slidesToTextWithMap([
+      { index: 1, title: "A", lines: [] },
+      { index: 2, lines: [] },
+      { index: 3, title: "C", lines: [] },
+    ]);
+    expect(text).toBe("A\n\nC");
+    expect(spans.map((span) => span.ref.slide)).toEqual([1, 3]);
+  });
+});

package/src/adapters/pptx/pptx-model.ts

@@ -0,0 +1,248 @@
+/**
+ * PowerPoint XML → a slide outline.
+ *
+ * ## What a deck preview honestly is
+ *
+ * A `.pptx` slide is absolutely-positioned drawing: shapes at EMU coordinates,
+ * theme-driven fills, transitions, embedded media. Reproducing that faithfully
+ * is a rendering engine, not a preview — and a half-faithful reproduction is
+ * worse than none, because it looks like the deck while quietly lying about it.
+ *
+ * So this reads the deck as an OUTLINE: per slide, the title, the text in
+ * document order (with its indent level), and the speaker notes. That is the
+ * content a reader is looking for when they open a deck in a file browser, it
+ * renders in this system's typography, and it is honest about what it is.
+ * Anything positional — layout, images, charts, transitions — is deliberately
+ * absent; the toolbar's download is the answer for the real thing.
+ *
+ * Parsing goes through namespace URIs rather than `a:t` / `p:sp` tag names,
+ * because the prefix is only a convention: a generator is free to bind the same
+ * namespace to a different prefix, and tag-name matching would silently return
+ * an empty deck.
+ */
+
+import { createTextIndexBuilder, type TextIndex } from "../../core/text-index";
+
+/** The DrawingML namespace — text, paragraphs, tables. */
+export const DRAWING_NS = "http://schemas.openxmlformats.org/drawingml/2006/main";
+/** The PresentationML namespace — shapes, placeholders, the shape tree. */
+export const PRESENTATION_NS = "http://schemas.openxmlformats.org/presentationml/2006/main";
+
+/** One line of slide text, with the indent level PowerPoint gave it. */
+export interface PptxLine {
+  text: string;
+  /** Outline depth, `0` for a top-level bullet. */
+  level: number;
+}
+
+export interface PptxSlide {
+  /** 1-based position in the deck. */
+  index: number;
+  /** The title placeholder's text, when the slide has one. */
+  title?: string;
+  /** Every other line, in document order. */
+  lines: PptxLine[];
+  /** The slide's speaker notes, when it has any. */
+  notes?: string;
+}
+
+/**
+ * Order slide parts the way the deck does.
+ *
+ * A zip lists its entries in whatever order they were written, and
+ * `slide10.xml` sorts before `slide2.xml` as a string — so the number is pulled
+ * out and compared as a number.
+ */
+export function orderSlidePaths(paths: string[]): string[] {
+  return paths
+    .filter((path) => /^ppt\/slides\/slide\d+\.xml$/.test(path))
+    .sort((left, right) => slideNumber(left) - slideNumber(right));
+}
+
+/** The `N` in `…/slideN.xml`, or `0` when there is none. */
+export function slideNumber(path: string): number {
+  const match = /(\d+)\.xml$/.exec(path);
+  return match?.[1] ? Number(match[1]) : 0;
+}
+
+/** All text under a node, in document order, as one string. */
+function textOf(node: Element): string {
+  const runs = node.getElementsByTagNameNS(DRAWING_NS, "t");
+  let text = "";
+  for (const run of Array.from(runs)) text += run.textContent ?? "";
+  return text.trim();
+}
+
+/** The paragraphs directly under a shape, as lines. Empty paragraphs are dropped. */
+function linesOf(shape: Element): PptxLine[] {
+  const lines: PptxLine[] = [];
+  for (const paragraph of Array.from(shape.getElementsByTagNameNS(DRAWING_NS, "p"))) {
+    const text = textOf(paragraph);
+    if (!text) continue;
+    // `lvl` is absent for a top-level bullet, which is the common case.
+    const properties = paragraph.getElementsByTagNameNS(DRAWING_NS, "pPr")[0];
+    const level = Number(properties?.getAttribute("lvl") ?? 0);
+    lines.push({ text, level: Number.isFinite(level) ? level : 0 });
+  }
+  return lines;
+}
+
+/** The placeholder type a shape declares (`title`, `ctrTitle`, `body`, …), if any. */
+function placeholderType(shape: Element): string | undefined {
+  const placeholder = shape.getElementsByTagNameNS(PRESENTATION_NS, "ph")[0];
+  return placeholder?.getAttribute("type") ?? undefined;
+}
+
+/** Table text, row by row, tab-separated — a table on a slide is usually the point of it. */
+function tableLines(frame: Element): PptxLine[] {
+  const lines: PptxLine[] = [];
+  for (const row of Array.from(frame.getElementsByTagNameNS(DRAWING_NS, "tr"))) {
+    const cells = Array.from(row.getElementsByTagNameNS(DRAWING_NS, "tc")).map(textOf);
+    const text = cells.join("\t").trim();
+    if (text) lines.push({ text, level: 0 });
+  }
+  return lines;
+}
+
+/**
+ * Parse one `ppt/slides/slideN.xml` document into a slide.
+ *
+ * The shape tree is walked in document order, so the outline reads in the order
+ * the shapes were authored rather than in the order the file happens to store
+ * them. A shape kind this does not name contributes nothing — the same
+ * allowlist-by-parse the Word adapter uses.
+ */
+export function parseSlide(document: Document, index: number): PptxSlide {
+  const tree = document.getElementsByTagNameNS(PRESENTATION_NS, "spTree")[0];
+  const slide: PptxSlide = { index, lines: [] };
+  if (!tree) return slide;
+
+  for (const node of Array.from(tree.children)) {
+    if (node.namespaceURI !== PRESENTATION_NS) continue;
+    if (node.localName === "sp") {
+      const type = placeholderType(node);
+      const lines = linesOf(node);
+      if ((type === "title" || type === "ctrTitle") && !slide.title) {
+        // A title placeholder can hold several paragraphs; they are one heading.
+        const title = lines.map((line) => line.text).join(" ");
+        if (title) slide.title = title;
+        continue;
+      }
+      slide.lines.push(...lines);
+      continue;
+    }
+    if (node.localName === "graphicFrame") slide.lines.push(...tableLines(node));
+  }
+  return slide;
+}
+
+/** Parse a `ppt/notesSlides/notesSlideN.xml` document into its notes text. */
+export function parseNotes(document: Document): string | undefined {
+  const tree = document.getElementsByTagNameNS(PRESENTATION_NS, "spTree")[0];
+  if (!tree) return undefined;
+
+  const lines: string[] = [];
+  for (const shape of Array.from(tree.getElementsByTagNameNS(PRESENTATION_NS, "sp"))) {
+    // The notes part repeats the slide's own body as a non-editable copy; only
+    // the notes placeholder holds what the presenter actually wrote.
+    if (placeholderType(shape) !== "body") continue;
+    for (const line of linesOf(shape)) lines.push(line.text);
+  }
+  const notes = lines.join("\n").trim();
+  return notes || undefined;
+}
+
+/** The OPC relationships namespace — how a part points at another part. */
+export const RELATIONSHIP_NS = "http://schemas.openxmlformats.org/package/2006/relationships";
+
+/**
+ * Resolve a relationship target (`../notesSlides/notesSlide1.xml`) against the
+ * part that declared it (`ppt/slides/slide1.xml`).
+ *
+ * Zip entry names are plain strings, not URLs, so `..` has to be walked by hand.
+ */
+export function resolveRelative(fromPart: string, target: string): string {
+  if (target.startsWith("/")) return target.slice(1);
+  const segments = fromPart.split("/").slice(0, -1);
+  for (const segment of target.split("/")) {
+    if (segment === "." || segment === "") continue;
+    if (segment === "..") segments.pop();
+    else segments.push(segment);
+  }
+  return segments.join("/");
+}
+
+/**
+ * The notes part a slide points at, if any.
+ *
+ * Read from the slide's own `_rels`, not by matching `slideN` to `notesSlideN`:
+ * the numbers agree in decks PowerPoint wrote from scratch and drift in decks
+ * that have had slides deleted, which would attach the wrong presenter notes to
+ * the wrong slide — a quiet, plausible-looking error.
+ */
+export function notesTarget(rels: Document, slidePath: string): string | undefined {
+  for (const relationship of Array.from(
+    rels.getElementsByTagNameNS(RELATIONSHIP_NS, "Relationship"),
+  )) {
+    if (!relationship.getAttribute("Type")?.endsWith("/notesSlide")) continue;
+    const target = relationship.getAttribute("Target");
+    if (target) return resolveRelative(slidePath, target);
+  }
+  return undefined;
+}
+
+/** Between two lines of the same slide. */
+export const PPTX_LINE_SEPARATOR = "\n";
+/** Between two slides. */
+export const PPTX_SLIDE_SEPARATOR = "\n\n";
+
+/** The `line` of a slide's title. */
+export const PPTX_TITLE_LINE = -1;
+/** The `line` of a slide's speaker notes. */
+export const PPTX_NOTES_LINE = -2;
+
+/** Where a stretch of the projection came from in the outline. */
+export interface PptxRef {
+  /** 1-based slide position, the same number {@link PptxSlide.index} carries. */
+  slide: number;
+  /** Body-line index, or {@link PPTX_TITLE_LINE} / {@link PPTX_NOTES_LINE}. */
+  line: number;
+}
+
+/**
+ * Plain-text projection of a deck, plus the map back into the outline.
+ *
+ * A slide's title, its lines and its notes are each their own chunk, so a
+ * citation resolves to the exact line the renderer draws rather than to "slide
+ * 4". The blank line between slides is written before whichever chunk turns out
+ * to be the next slide's first — a slide with no text at all contributes
+ * nothing, instead of a run of empty lines that would shift every offset after
+ * it.
+ */
+export function slidesToTextWithMap(slides: PptxSlide[]): TextIndex<PptxRef> {
+  const builder = createTextIndexBuilder<PptxRef>({ separator: PPTX_LINE_SEPARATOR });
+  slides.forEach((slide, index) => {
+    let separator = index === 0 ? undefined : PPTX_SLIDE_SEPARATOR;
+    const push = (chunk: string | undefined, line: number) => {
+      if (!chunk) return;
+      builder.push(chunk, { slide: slide.index, line }, separator);
+      separator = undefined;
+    };
+
+    push(slide.title, PPTX_TITLE_LINE);
+    slide.lines.forEach((line, lineIndex) => {
+      push(line.text, lineIndex);
+    });
+    push(slide.notes, PPTX_NOTES_LINE);
+  });
+  return builder.build();
+}
+
+/**
+ * Plain-text projection of a deck — powers search, copy and the raw view. A thin
+ * wrapper so the projection has exactly one definition: it is the index's own
+ * text, never a second assembly that could drift from it.
+ */
+export function slidesToText(slides: PptxSlide[]): string {
+  return slidesToTextWithMap(slides).text;
+}

package/src/adapters/text/text-adapter.test.tsx

@@ -0,0 +1,125 @@
+import { normalizeFileSource } from "@elabs-ai/components-ui";
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+
+import type { ResolvedHighlight } from "../../core/highlight";
+import textModule, { TEXT_CHARACTER_LIMIT, type TextDocument } from "./text-adapter";
+
+const cite = (id: string, range: [number, number], active = false): ResolvedHighlight => ({
+  id,
+  source: "citation",
+  status: "resolved",
+  address: { kind: "range", start: range[0], end: range[1] },
+  active,
+  range,
+});
+
+const load = (text: string, name = "notes.txt") =>
+  textModule
+    .create()
+    .load(normalizeFileSource({ kind: "text", text, name }), {}) as Promise<TextDocument>;
+
+const source = normalizeFileSource({ kind: "text", text: "", name: "notes.txt" });
+
+describe("text adapter — loading", () => {
+  it("keeps a small file whole and claims no truncation", async () => {
+    const doc = await load("line one\nline two");
+    expect(doc.text).toBe("line one\nline two");
+    expect(doc.totalCharacters).toBeUndefined();
+  });
+
+  it("truncates at load, not at render — a huge file must not reach the DOM", async () => {
+    const doc = await load("x".repeat(TEXT_CHARACTER_LIMIT + 500));
+    expect(doc.text).toHaveLength(TEXT_CHARACTER_LIMIT);
+    expect(doc.totalCharacters).toBe(TEXT_CHARACTER_LIMIT + 500);
+  });
+
+  it("does not truncate a file exactly at the limit", async () => {
+    const doc = await load("x".repeat(TEXT_CHARACTER_LIMIT));
+    expect(doc.totalCharacters).toBeUndefined();
+  });
+});
+
+describe("text adapter — rendering", () => {
+  it("preserves whitespace so indentation survives", async () => {
+    const doc = await load("  indented\n\n  again");
+    const { container } = render(<textModule.Renderer document={doc} source={source} />);
+    expect(container.querySelector("pre")?.textContent).toBe("  indented\n\n  again");
+  });
+
+  it("announces truncation as a status, never an error", async () => {
+    const doc = await load("x".repeat(TEXT_CHARACTER_LIMIT + 1));
+    render(<textModule.Renderer document={doc} source={source} />);
+    expect(screen.getByRole("status")).toHaveTextContent(/Showing the first/);
+    expect(screen.queryByRole("alert")).not.toBeInTheDocument();
+  });
+
+  it("says nothing when the whole file is shown", async () => {
+    const doc = await load("short");
+    render(<textModule.Renderer document={doc} source={source} />);
+    expect(screen.queryByRole("status")).not.toBeInTheDocument();
+  });
+});
+
+describe("text adapter — highlighting", () => {
+  it("declares the address kinds it can actually honour, and no others", () => {
+    // `rect` is missing on purpose: plain text has no geometry.
+    expect(textModule.manifest.capabilities?.highlight).toEqual(["quote", "range"]);
+  });
+
+  it("reports a capped file as truncated, so a miss can say WHY", async () => {
+    expect((await load("x".repeat(TEXT_CHARACTER_LIMIT + 1))).textTruncated).toBe(true);
+    expect((await load("short")).textTruncated).toBeUndefined();
+  });
+
+  it("marks a located range and leaves the rest of the file intact", async () => {
+    const doc = await load("the delay was escalated");
+    const { container } = render(
+      <textModule.Renderer document={doc} source={source} highlights={[cite("a", [4, 9])]} />,
+    );
+    const marks = container.querySelectorAll("mark");
+    expect(marks).toHaveLength(1);
+    expect(marks[0]).toHaveTextContent("delay");
+    // Nothing is dropped — a screen reader still reads the file continuously.
+    expect(container.querySelector("pre")?.textContent).toBe("the delay was escalated");
+  });
+
+  it("distinguishes the current highlight from the rest", async () => {
+    const doc = await load("delay delay delay");
+    const { container } = render(
+      <textModule.Renderer
+        document={doc}
+        source={source}
+        highlights={[cite("a", [0, 5]), cite("b", [6, 11], true), cite("c", [12, 17])]}
+        activeHighlightId="b"
+      />,
+    );
+    expect(container.querySelectorAll("mark")).toHaveLength(3);
+    const active = container.querySelectorAll("mark[data-active]");
+    expect(active).toHaveLength(1);
+    expect(active[0]?.getAttribute("aria-current")).toBe("true");
+    expect(container.querySelectorAll("mark")[1]).toBe(active[0]);
+  });
+
+  it("renders the plain string when nothing located — no empty mark layer", async () => {
+    const doc = await load("nothing to point at");
+    const { container } = render(
+      <textModule.Renderer
+        document={doc}
+        source={source}
+        highlights={[
+          {
+            id: "a",
+            source: "citation",
+            status: "not-found",
+            reason: "absent",
+            address: { kind: "quote", text: "missing" },
+            active: false,
+          },
+        ]}
+      />,
+    );
+    expect(container.querySelectorAll("mark")).toHaveLength(0);
+    expect(container.querySelector("pre")?.textContent).toBe("nothing to point at");
+  });
+});