@hajimism/dek 0.3.3 → 0.5.0

package/src/core/mv.ts

@@ -1,10 +1,18 @@
-import { existsSync, readFileSync, renameSync, unlinkSync, writeFileSync } from "node:fs";
+// biome-ignore lint/style/noRestrictedImports: renameSync and unlinkSync, for mv's steps, each undone on failure; safe-fs does not rename.
+import { existsSync, renameSync, unlinkSync } from "node:fs";
 import { basename } from "node:path";
 import { deckPaths } from "./deck-paths.ts";
 import { DekError } from "./error.ts";
-import { escapeRegExp } from "./escape.ts";
+import { escapeRegExp, isPlainWord, shellName } from "./escape.ts";
 import { joinLines, sectionChunks, splitLines } from "./lines.ts";
-import { asResolvedDeck, type ResolvedDeck, requireSection, SLIDE_SIDECARS } from "./resolve.ts";
+import {
+  asResolvedDeck,
+  type ResolvedDeck,
+  readDeckFile,
+  requireSection,
+  SLIDE_SIDECARS,
+} from "./resolve.ts";
+import { writeInside } from "./safe-fs.ts";
 import { Id } from "./schema.ts";
 import { deckLayouts, skeletonHtml } from "./skeleton.ts";
 import { skeletonRecord } from "./skeleton-record.ts";
@@ -16,11 +24,11 @@ export function renameSection(input: string | ResolvedDeck, from: string, to: st
   if (!Id.safeParse(to).success) {
     throw new DekError(`invalid id "${to}"`, { hint: "use [a-z0-9-] with at least one letter" });
   }
-  const { deck } = asResolvedDeck(input);
+  const { project, deck } = asResolvedDeck(input);
   const has = (slug: string): boolean => deck.deck.sections.some((entry) => entry.slug === slug);
   if (!has(from) && has(to)) {
     // script.md was edited first; only the files still carry the old id.
-    const steps = slideFileSteps(deck, from, to);
+    const steps = slideFileSteps(project.root, deck, from, to);
     if (steps.length === 0 && !existsSync(deckPaths(deck.dir).slide(to, ".html"))) {
       throw new DekError(`slide "${from}" not found`, {
         path: deckPaths(deck.dir).slide(from, ".html"),
@@ -38,7 +46,7 @@ export function renameSection(input: string | ResolvedDeck, from: string, to: st
     });
   }
 
-  const source = readFileSync(deck.scriptPath, "utf8");
+  const source = readDeckFile(deck.dir, deck.scriptPath) ?? "";
   const lines = splitLines(source);
   const headingIndex = section.line - 1;
   const heading = lines[headingIndex];
@@ -50,8 +58,8 @@ export function renameSection(input: string | ResolvedDeck, from: string, to: st
   }
   lines[headingIndex] = rewriteHeadingId(heading, from, to);
   applySteps([
-    writeStep(deck.scriptPath, source, joinLines(source, lines)),
-    ...slideFileSteps(deck, from, to),
+    writeStep(project.root, deck.scriptPath, source, joinLines(source, lines)),
+    ...slideFileSteps(project.root, deck, from, to),
   ]);
 }
 
@@ -63,16 +71,22 @@ export function renameSection(input: string | ResolvedDeck, from: string, to: st
  * the author wrote, one under each id, stop the rename; everything that could stop it is worked
  * out before any file changes.
  */
-function slideFileSteps(deck: ResolvedDeck["deck"], from: string, to: string): FileStep[] {
+function slideFileSteps(
+  root: string,
+  deck: ResolvedDeck["deck"],
+  from: string,
+  to: string,
+): FileStep[] {
   const paths = deckPaths(deck.dir);
   const layouts = deckLayouts(deck.dir);
   const record = skeletonRecord(deck.dir);
   const read = (slug: string): SlideFile | undefined => {
     const path = paths.slide(slug, ".html");
-    if (!existsSync(path)) {
+    // What is read here may be written under the other id: a link out of the project is refused.
+    const html = readDeckFile(deck.dir, path);
+    if (html === undefined) {
       return undefined;
     }
-    const html = readFileSync(path, "utf8");
     return { path, html, authored: !record.owns(html, skeletonHtml(deck.deck, slug, layouts)) };
   };
   const source = read(from);
@@ -93,16 +107,16 @@ function slideFileSteps(deck: ResolvedDeck["deck"], from: string, to: string): F
   const kept = source && (source.authored || !target) ? source : target;
   if (source && kept === source) {
     steps.push(
-      target ? writeStep(toPath, target.html, source.html) : renameStep(source.path, toPath),
+      target ? writeStep(root, toPath, target.html, source.html) : renameStep(source.path, toPath),
     );
   }
   if (source && target) {
-    steps.push(removeStep(source.path, source.html));
+    steps.push(removeStep(root, source.path, source.html));
   }
   if (kept) {
     const next = relabel(kept.html, from, to);
     if (next !== kept.html) {
-      steps.push(writeStep(toPath, kept.html, next));
+      steps.push(writeStep(root, toPath, kept.html, next));
     }
   }
   for (const ext of SLIDE_SIDECARS) {
@@ -112,7 +126,7 @@ function slideFileSteps(deck: ResolvedDeck["deck"], from: string, to: string): F
     }
   }
   if (voice) {
-    steps.push(writeStep(voice.path, voice.source, voice.next));
+    steps.push(writeStep(root, voice.path, voice.source, voice.next));
   }
   return steps;
 }
@@ -131,23 +145,39 @@ function bothHold(fromPath: string, toPath: string, from: string, to: string): D
   const what = fromPath.endsWith(".html") ? "hold a slide you wrote" : "exist";
   return new DekError(`${fromName} and ${toName} both ${what}`, {
     path: fromPath,
-    hint: `merge them into ${toName} and remove ${fromName}, then run \`dekc mv ${from} ${to}\` again`,
+    hint: `merge them into ${toName} and remove ${isPlainWord(from) ? fromName : "the other"}, then run ${again(from, to)}`,
   });
 }
 
-/** One file change `dekc mv` makes, with how to take it back. */
+/**
+ * The rename to run again: as a command when each name has a word every shell reads alike, after
+ * `--` when one starts with a dash; else as the one that was run.
+ */
+function again(from: string, to: string): string {
+  const [source, target] = [shellName(from), shellName(to)];
+  if (source === undefined || target === undefined) {
+    return "that `dekc mv` again";
+  }
+  const end = from.startsWith("-") || to.startsWith("-") ? "-- " : "";
+  return `\`dekc mv ${end}${source} ${target}\` again`;
+}
+
+/**
+ * One file change `dekc mv` makes, with how to take it back. A write goes to a new file renamed
+ * into place, so a crash part way leaves the old file or the new one, never half of one.
+ */
 type FileStep = { path: string; apply: () => void; undo: () => void };
 
-function writeStep(path: string, before: string, after: string): FileStep {
+function writeStep(root: string, path: string, before: string, after: string): FileStep {
   return {
     path,
-    apply: () => writeFileSync(path, after),
-    undo: () => writeFileSync(path, before),
+    apply: () => writeInside(path, after, root),
+    undo: () => writeInside(path, before, root),
   };
 }
 
-function removeStep(path: string, before: string): FileStep {
-  return { path, apply: () => unlinkSync(path), undo: () => writeFileSync(path, before) };
+function removeStep(root: string, path: string, before: string): FileStep {
+  return { path, apply: () => unlinkSync(path), undo: () => writeInside(path, before, root) };
 }
 
 function renameStep(from: string, to: string): FileStep {
@@ -192,10 +222,10 @@ function planVoiceBeatKeys(
   to: string,
 ): { path: string; source: string; next: string } | undefined {
   const path = deckPaths(deckDir).voiceToml;
-  if (!existsSync(path)) {
+  const source = readDeckFile(deckDir, path);
+  if (source === undefined) {
     return undefined;
   }
-  const source = readFileSync(path, "utf8");
   let parsed: Record<string, unknown>;
   try {
     parsed = Bun.TOML.parse(source) as Record<string, unknown>;
@@ -248,7 +278,7 @@ export function reorderSection(
   place: SectionPlace,
 ): void {
   const target = "before" in place ? place.before : place.after;
-  const { deck } = asResolvedDeck(input);
+  const { project, deck } = asResolvedDeck(input);
   const sections = deck.deck.sections;
   const fromIndex = sections.findIndex((entry) => entry.slug === slug);
   if (fromIndex < 0) {
@@ -259,7 +289,7 @@ export function reorderSection(
     requireSection(deck, target);
   }
 
-  const source = readFileSync(deck.scriptPath, "utf8");
+  const source = readDeckFile(deck.dir, deck.scriptPath) ?? "";
   const lines = splitLines(source);
   const firstLine = sections[0]?.line;
   if (firstLine === undefined) {
@@ -281,7 +311,7 @@ export function reorderSection(
   });
   const insertAt = "before" in place ? remainingTarget : remainingTarget + 1;
   chunks.splice(insertAt, 0, moved);
-  writeFileSync(deck.scriptPath, joinLines(source, [...head, ...chunks.flat()]));
+  writeInside(deck.scriptPath, joinLines(source, [...head, ...chunks.flat()]), project.root);
 }
 
 function rewriteHeadingId(heading: string, from: string, to: string): string {

package/src/core/order.ts

@@ -0,0 +1,14 @@
+/**
+ * Orders two strings by their UTF-16 code units, as `Array.prototype.sort` does with no
+ * comparator, so every list dek sorts comes out in one order, the same on every machine.
+ *
+ * `localeCompare` with no locale follows the machine's, so a teammate set to Swedish or Turkish
+ * would write dict.toml in another order. A fixed locale is no cure: its collation comes from
+ * the ICU the runtime has, which Bun takes from the system on macOS and bundles on Linux, and it
+ * counts a precomposed `ä` and an `a` with a combining mark as equal, leaving their order to
+ * whichever came first. Code units cost a dictionary's order: `B` comes before `a`, `ä` after
+ * `z`, and Japanese reads hiragana, then katakana, then kanji by code point.
+ */
+export function compareCodeUnits(a: string, b: string): number {
+  return a < b ? -1 : a > b ? 1 : 0;
+}

package/src/core/pack.ts

@@ -5,7 +5,7 @@ import { DekError } from "./error.ts";
 import { licenseText } from "./licenses.ts";
 import { type DistOptions, distFile } from "./path.ts";
 import { keepsInDeck, LICENSE_NAMES, MAX_SNAPSHOT_BYTES } from "./ref.ts";
-import { isRefDeckName } from "./ref-name.ts";
+import { isRefDeckName, REF_DECK_NAME_RULE } from "./ref-name.ts";
 import { followInside, requireInside, writeInside } from "./safe-fs.ts";
 
 /**
@@ -22,7 +22,7 @@ export async function packDeck(
   if (!isRefDeckName(deck.name)) {
     throw new DekError(`deck "${deck.name}" cannot be read as a ref by that name`, {
       path: deck.dir,
-      hint: "a ref names its deck with no space or @; rename the deck's folder, e.g. to 2026-10-talk, and pack it again",
+      hint: `${REF_DECK_NAME_RULE}; rename the deck's folder, e.g. to 2026-10-talk, and pack it again`,
     });
   }
   // Each file by its path in the pack and where it really is, measured before any is read.

package/src/core/path.ts

@@ -1,5 +1,6 @@
 import { isAbsolute, join, relative, resolve, sep } from "node:path";
 import { fileURLToPath } from "node:url";
+import { holdsHidden } from "./foreign-text.ts";
 
 export function moduleFilePath(url: string | URL): string {
   return fileURLToPath(url);
@@ -16,8 +17,12 @@ export function deckProjectRoot(deckDir: string): string {
 }
 
 export const DECK_NAME_HINT =
-  'use a plain name like 2026-10-talk: no "/" or "\\", no control characters, no leading "-"';
+  'use a plain name like 2026-10-talk: no "/" or "\\", no control character or one a person cannot see, no leading "-"';
 
+/**
+ * A name `dekc new` and `dekc init` may give a deck. A pack's ref takes its deck's name, so, as
+ * `dekc pack` does, these refuse a control character and one a person cannot see.
+ */
 export function isDeckName(name: string): boolean {
   return (
     name.length > 0 &&
@@ -28,7 +33,8 @@ export function isDeckName(name: string): boolean {
     // A leading "-" reads as a flag to every tool the name is passed to.
     !name.startsWith("-") &&
     // biome-ignore lint/suspicious/noControlCharactersInRegex: a control in a name is the problem.
-    !/[\x00-\x1f\x7f]/.test(name)
+    !/[\x00-\x1f\x7f-\x9f]/.test(name) &&
+    !holdsHidden(name)
   );
 }
 

package/src/core/playwright-module.d.ts

@@ -15,6 +15,7 @@ declare module "playwright" {
       clip?: { x: number; y: number; width: number; height: number };
       type?: "png" | "jpeg";
       quality?: number;
+      omitBackground?: boolean;
     }): Promise<Buffer>;
     addScriptTag(options: { content: string }): Promise<unknown>;
     pdf(options: {
@@ -26,6 +27,11 @@ declare module "playwright" {
     }): Promise<Buffer>;
     close(): Promise<void>;
     context(): BrowserContext;
+    mainFrame(): Frame;
+    frames(): Frame[];
+  };
+  export type Frame = {
+    url(): string;
   };
   /** A DevTools protocol session: Chromium's own answers, for what the page does not expose. */
   export type CDPSession = {
@@ -43,10 +49,16 @@ declare module "playwright" {
       viewport?: Viewport;
       deviceScaleFactor?: number;
       offline?: boolean;
+      httpCredentials?: { username: string; password: string };
     }): Promise<BrowserContext>;
+    newBrowserCDPSession(): Promise<CDPSession>;
     close(): Promise<void>;
   };
   export const chromium: {
-    launch(options?: { headless?: boolean; chromiumSandbox?: boolean }): Promise<Browser>;
+    launch(options?: {
+      headless?: boolean;
+      chromiumSandbox?: boolean;
+      executablePath?: string;
+    }): Promise<Browser>;
   };
 }

package/src/core/playwright-motion.ts

@@ -1,3 +1,4 @@
+// biome-ignore lint/style/noRestrictedImports: mkdirSync, in a worker, for the folder its parent chose in dek's cache, which Chromium writes into.
 import { mkdirSync } from "node:fs";
 import { join } from "node:path";
 import type { Page } from "playwright";

package/src/core/playwright-sheet.ts

@@ -1,3 +1,4 @@
+// biome-ignore lint/style/noRestrictedImports: mkdirSync, in a worker, for the folder its parent chose in dek's cache, which Chromium writes into.
 import { mkdirSync, readFileSync } from "node:fs";
 import { dirname } from "node:path";
 import type { Page } from "playwright";

package/src/core/playwright-visual.ts

@@ -1,7 +1,9 @@
 import type { Browser, BrowserContext, Page } from "playwright";
+import { findMisalignments } from "./alignment.ts";
 import { freezeTransition, loadVideoDoc } from "./capture-go.ts";
 import { measureFill } from "./fill.ts";
 import { finishBeat } from "./finish-beat.ts";
+import { findLineBreaks, measureTextFlowsInPage } from "./line-break.ts";
 import {
   crossesEdge,
   findClippedText,
@@ -31,6 +33,7 @@ import type {
   PagesRequest,
   PagesResponse,
   PdfRequest,
+  PptxPictureFile,
   PptxRequest,
   PptxResponse,
   ResponseTo,
@@ -39,8 +42,24 @@ import type {
 } from "./playwright.ts";
 import { captureMotion } from "./playwright-motion.ts";
 import { renderSheets } from "./playwright-sheet.ts";
+import { mapPictures } from "./pptx-package.ts";
+import {
+  describePptxPicturesInPage,
+  hidePptxLiftedInPage,
+  measurePptxPaintInPage,
+  measurePptxThemeInPage,
+  PPTX_PSEUDO_ATTR,
+  pptxFontProbesInPage,
+  pptxPictureEmptyInPage,
+  pptxSvgInPage,
+  SVG_CHECKED,
+  SVG_PAINT,
+  showOnlyPptxNodeInPage,
+} from "./pptx-paint.ts";
+import { planPptxLayers, pptxPageFacts } from "./pptx-plan.ts";
 import { measurePptxTextsInPage, PPTX_OWNER_ATTR } from "./pptx-text.ts";
-import { pseudoTextBoxes } from "./pseudo-text.ts";
+import type { PptxPageTheme } from "./pptx-theme.ts";
+import { pseudoElementBoxes, pseudoTextBoxes } from "./pseudo-text.ts";
 import { motionSheets } from "./sheet.ts";
 import {
   type Box,
@@ -133,7 +152,10 @@ async function printPdf(context: BrowserContext, request: PdfRequest): Promise<D
   return {};
 }
 
-/** Each slide's text measured and taken out, and the slide shot without it, page by page. */
+/**
+ * Each slide's text and paint measured; what is laid over the picture planned, each picture
+ * drawn alone, and the slide shot without what was laid over it, page by page.
+ */
 async function shootPptx(context: BrowserContext, request: PptxRequest): Promise<PptxResponse> {
   const slides = await visitInPages(
     request.pages,
@@ -141,19 +163,86 @@ async function shootPptx(context: BrowserContext, request: PptxRequest): Promise
     async (page, pageReq) => {
       await page.setContent(pageReq.html, { waitUntil: "load" });
       await page.evaluate(() => document.fonts.ready.then(() => undefined));
-      const measured = await page.evaluate(measurePptxTextsInPage);
+      const paint = {
+        ...(await page.evaluate(measurePptxPaintInPage)),
+        described: await page.evaluate(describePptxPicturesInPage),
+      };
+      const texts = await page.evaluate(measurePptxTextsInPage);
       const fonts = await platformFonts(page);
-      await page.screenshot({ path: pageReq.screenshotPath, fullPage: false });
+      const placed = await pseudoElementBoxes(page, PPTX_PSEUDO_ATTR, "border", [
+        "before",
+        "after",
+        "marker",
+      ]);
+      for (const run of [
+        ...texts.boxes.flatMap((box) => box.runs),
+        ...texts.blocks.flatMap((block) => block.runs),
+      ]) {
+        const font = fonts.get(run.owner);
+        if (font !== undefined) {
+          run.font = font;
+        }
+      }
+      const plan = planPptxLayers(pptxPageFacts(paint, texts, placed));
+
+      const files = new Map<number, PptxPictureFile>();
+      for (const [index, node] of plan.lifted.pictures.entries()) {
+        const measured = paint.nodes[node];
+        const rect =
+          (measured?.paint?.kind === "picture" ? measured.paint.extent : undefined) ??
+          measured?.rect;
+        if (!rect) {
+          continue;
+        }
+        const svg = await page.evaluate(pptxSvgInPage, {
+          node,
+          paint: SVG_PAINT,
+          checked: SVG_CHECKED,
+        });
+        const png = pageReq.screenshotPath.replace(/\.png$/, `-${index + 1}.png`);
+        await page.evaluate(showOnlyPptxNodeInPage, node);
+        await page.screenshot({
+          path: png,
+          omitBackground: true,
+          clip: {
+            x: paint.origin.left + rect.left,
+            y: paint.origin.top + rect.top,
+            width: rect.right - rect.left,
+            height: rect.bottom - rect.top,
+          },
+        });
+        await page.evaluate(showOnlyPptxNodeInPage, null);
+        files.set(node, svg === undefined ? { png } : { png, svg });
+      }
+      const layers = mapPictures(plan.layers, ({ node, ...picture }) => ({
+        ...picture,
+        ...(files.get(node) ?? { png: "" }),
+      }));
+      // With the background PowerPoint's, the slide is shot on nothing, and a picture with
+      // nothing left in it is no picture.
+      const { background } = plan;
+      await page.evaluate(hidePptxLiftedInPage, {
+        ...plan.lifted,
+        background: background !== undefined,
+      });
+      const shot = await page.screenshot({
+        path: pageReq.screenshotPath,
+        fullPage: false,
+        ...(background ? { omitBackground: true } : {}),
+      });
+      const empty =
+        background !== undefined &&
+        (await page.evaluate(
+          pptxPictureEmptyInPage,
+          `data:image/png;base64,${shot.toString("base64")}`,
+        ));
       return {
         slug: pageReq.slug,
-        description: measured.description,
-        boxes: measured.boxes.map((box) => ({
-          ...box,
-          runs: box.runs.map(({ owner, ...run }) => {
-            const font = fonts.get(owner);
-            return font === undefined ? run : { ...run, font };
-          }),
-        })),
+        description: plan.description,
+        layers,
+        picture: !empty,
+        ...(background ? { background } : {}),
+        theme: await pageTheme(page),
       };
     },
   );
@@ -161,12 +250,44 @@ async function shootPptx(context: BrowserContext, request: PptxRequest): Promise
 }
 
 /**
- * The font Chromium drew each marked element's text with, by the element's number: the one that
- * drew most of its glyphs, as the DevTools protocol reports it. A theme names a stack, or only
- * `sans-serif`; this is the face that was found.
+ * What the slide says of the deck's theme: its color tokens, and each font token as the
+ * `font-family` it is and the faces Chromium drew Latin and East Asian text in with it. Measured
+ * after the slide's last shot, since it puts text in the page to measure.
  */
+async function pageTheme(page: Page): Promise<PptxPageTheme> {
+  const { colors, families } = await page.evaluate(measurePptxThemeInPage);
+  await page.evaluate(pptxFontProbesInPage, true);
+  const faces = await platformFaces(page, "data-dek-pptx-probe");
+  await page.evaluate(pptxFontProbesInPage, false);
+  const fonts: PptxPageTheme["fonts"] = {};
+  for (const token of ["title", "body"] as const) {
+    const family = families[token];
+    const latin = faces.get(`${token}-latin`);
+    if (family !== undefined && latin !== undefined) {
+      fonts[token] = { family, latin, ea: faces.get(`${token}-ea`) ?? latin };
+    }
+  }
+  return { colors, fonts };
+}
+
+/** The font Chromium drew each marked element's text with, by the element's number. */
 async function platformFonts(page: Page): Promise<Map<number, string>> {
   const fonts = new Map<number, string>();
+  for (const [owner, face] of await platformFaces(page, PPTX_OWNER_ATTR)) {
+    if (Number.isInteger(Number(owner))) {
+      fonts.set(Number(owner), face);
+    }
+  }
+  return fonts;
+}
+
+/**
+ * The font Chromium drew each element marked with `attr` in, by the attribute's value: the one
+ * that drew most of its glyphs, as the DevTools protocol reports it. A theme names a stack, or
+ * only `sans-serif`; this is the face that was found.
+ */
+async function platformFaces(page: Page, attr: string): Promise<Map<string, string>> {
+  const fonts = new Map<string, string>();
   const cdp = await page.context().newCDPSession(page);
   try {
     await cdp.send("DOM.enable");
@@ -176,19 +297,19 @@ async function platformFonts(page: Page): Promise<Map<number, string>> {
     };
     const { nodeIds } = (await cdp.send("DOM.querySelectorAll", {
       nodeId: root.nodeId,
-      selector: `[${PPTX_OWNER_ATTR}]`,
+      selector: `[${attr}]`,
     })) as { nodeIds: number[] };
     for (const nodeId of nodeIds) {
       const { attributes } = (await cdp.send("DOM.getAttributes", { nodeId })) as {
         attributes: string[];
       };
-      const owner = Number(attributes[attributes.indexOf(PPTX_OWNER_ATTR) + 1]);
+      const value = attributes[attributes.indexOf(attr) + 1];
       const { fonts: used } = (await cdp.send("CSS.getPlatformFontsForNode", { nodeId })) as {
         fonts: Array<{ familyName: string; glyphCount: number }>;
       };
       const main = [...used].sort((a, b) => b.glyphCount - a.glyphCount)[0];
-      if (main && Number.isInteger(owner)) {
-        fonts.set(owner, main.familyName);
+      if (main && value !== undefined) {
+        fonts.set(value, main.familyName);
       }
     }
   } finally {
@@ -240,6 +361,8 @@ async function visitPages(context: BrowserContext, request: PagesRequest): Promi
     drawErrors: found.flatMap((page) => page.drawErrors ?? []),
     collisions: found.flatMap((page) => page.collisions ?? []),
     fills: found.flatMap((page) => page.fills ?? []),
+    lineBreaks: found.flatMap((page) => page.lineBreaks ?? []),
+    misalignments: found.flatMap((page) => page.misalignments ?? []),
   };
 }
 
@@ -343,7 +466,14 @@ async function visitPage(
   pageReq: VisualPage,
   { actions, viewport }: Pick<PagesRequest, "actions" | "viewport">,
 ): Promise<PagesResponse> {
-  const response: PagesResponse = { overflows: [], contrasts: [], collisions: [], fills: [] };
+  const response: PagesResponse = {
+    overflows: [],
+    contrasts: [],
+    collisions: [],
+    fills: [],
+    lineBreaks: [],
+    misalignments: [],
+  };
   const failing: Failing[] = [];
   const crossing: Crossing[] = [];
   await page.setContent(pageReq.html, { waitUntil: "load" });
@@ -362,6 +492,36 @@ async function visitPage(
     if (actions.includes("fill") && frame) {
       response.fills?.push({ slug, step, ...measureFill(frame, measured.elements) });
     }
+    if (actions.includes("alignment")) {
+      for (const { element, other, ...miss } of findMisalignments(measured.elements)) {
+        const [one, two] = [measured.elements[element], measured.elements[other]];
+        response.misalignments?.push({
+          slug,
+          step,
+          box: one?.box ?? "",
+          ...(one?.text ? { text: one.text } : {}),
+          other: two?.box ?? "",
+          ...(two?.text ? { otherText: two.text } : {}),
+          ...miss,
+        });
+      }
+    }
+    if (actions.includes("breaks")) {
+      const { wordBreak, flows } = await page.evaluate(measureTextFlowsInPage);
+      const textWraps = new Map(flows.map((flow) => [flow.element, flow.textWrap]));
+      for (const { element, ...found } of findLineBreaks(flows)) {
+        const el = measured.elements[element];
+        response.lineBreaks?.push({
+          slug,
+          step,
+          box: el?.box ?? "",
+          ...(el?.text ? { text: el.text } : {}),
+          ...found,
+          wordBreak,
+          textWrap: textWraps.get(element) ?? "wrap",
+        });
+      }
+    }
     if (actions.includes("overflow") && frame) {
       for (const { element, ...overflow } of [
         ...findOverflows(frame, measured.elements),
@@ -421,13 +581,18 @@ async function visitPage(
  * measuring again: first what the slide's script drew, then the slide's own CSS. A text that
  * clears its threshold, or an element that no longer crosses an edge, once a layer is gone is
  * that layer's to fix. With both gone, a text that still fails is the theme's, and an element that
- * still overflows is its content's: too much for the theme's sizes. The page is not put back.
+ * still overflows is its content's: too much for the theme's sizes. A text that shows no glyph
+ * once a layer is gone is no longer measured as the audience sees it: one the slide's CSS alone
+ * shows is marked so, and one the draw alone shows is no layer's unless it still fails with both
+ * gone. The page is not put back.
  */
 async function attributeFindings(
   page: Page,
   pending: { failing: Failing[]; crossing: Crossing[] },
 ): Promise<void> {
   let { failing, crossing } = pending;
+  // Texts that showed no glyph the last time they were measured.
+  const unseen = new Set<Failing>();
   for (const layer of LAYERS) {
     if (failing.length === 0 && crossing.length === 0) {
       return;
@@ -455,20 +620,32 @@ async function attributeFindings(
     const texts = await pageTexts(page, measured);
     const contrasts = await textContrasts(page, texts);
     const now = new Map(texts.map((text, at) => [text.key, { text, contrast: contrasts[at] }]));
-    failing = failing.filter(({ finding, key }) => {
-      const measuredText = now.get(key);
-      if (
-        measuredText?.contrast &&
-        measuredText.contrast.ratio >= contrastThreshold(measuredText.text)
-      ) {
-        finding.origin = layer.origin;
+    failing = failing.filter((entry) => {
+      const measuredText = now.get(entry.key);
+      const seen = !unseen.has(entry);
+      if (!measuredText?.contrast) {
+        if (layer.origin === "slide" && seen) {
+          entry.finding.onlyWithSlideCss = true;
+          return false;
+        }
+        unseen.add(entry);
+        return true;
+      }
+      if (measuredText.contrast.ratio >= contrastThreshold(measuredText.text)) {
+        // Hidden with the layer before gone, it may owe its low contrast to that layer as well.
+        if (seen) {
+          entry.finding.origin = layer.origin;
+        }
         return false;
       }
+      unseen.delete(entry);
       return true;
     });
   }
-  for (const { finding } of failing) {
-    finding.origin = "theme";
+  for (const entry of failing) {
+    if (!unseen.has(entry)) {
+      entry.finding.origin = "theme";
+    }
   }
   for (const { finding } of crossing) {
     finding.origin = "content";