@caelo-cms/shared 0.10.22 → 0.10.23

package/src/fonts.ts

@@ -0,0 +1,296 @@
+// SPDX-License-Identifier: MPL-2.0
+
+/**
+ * issue #150 — web-font resolution primitives.
+ *
+ * Theme typography tokens name font families (`--font-heading:
+ * "Poppins"`), but until #150 nothing delivered the font files to
+ * rendered pages — every site silently fell back to system fonts, the
+ * exact silent-degradation CLAUDE.md §2 forbids. These pure helpers are
+ * the shared half of the fix: extract the families a theme actually
+ * uses, classify system stacks (nothing to deliver) vs web fonts
+ * (self-hosted at deploy — hotlinking fonts.googleapis.com is both a
+ * GDPR liability, LG München I 3 O 17493/20, and a third-party request
+ * on the critical path), and build/parse the CSS involved.
+ *
+ * Network + disk live in `@caelo-cms/admin-core`'s font resolver; the
+ * static generator and the preview op share that resolver so preview
+ * and production render the same `@font-face` set (parity contract,
+ * apps/static-generator/src/generate.ts).
+ */
+
+import type { ThemeDocument } from "./themes.js";
+
+/** One family the theme needs delivered, with the weights it uses. */
+export interface FontRequest {
+  /** Primary family name, unquoted (`Poppins`), first entry of the stack. */
+  readonly family: string;
+  /** Distinct numeric weights, ascending. Always non-empty. */
+  readonly weights: readonly number[];
+  /** Typography token names that reference the family (`body`, `heading`). */
+  readonly roles: readonly string[];
+}
+
+/** A single @font-face declaration parsed from a fonts-CSS payload. */
+export interface ParsedFontFace {
+  readonly family: string;
+  readonly style: string;
+  readonly weight: string;
+  readonly unicodeRange: string | null;
+  /** Remote woff2 URL as served by the fonts source. */
+  readonly srcUrl: string;
+}
+
+/** A parsed face whose bytes now live at a self-hosted public URL. */
+export interface ResolvedFontFace extends Omit<ParsedFontFace, "srcUrl"> {
+  readonly publicUrl: string;
+}
+
+/**
+ * Families that ship with operating systems — nothing to download, no
+ * @font-face to emit. Generic CSS keywords included. Lowercased for
+ * case-insensitive membership tests.
+ */
+const SYSTEM_FONT_FAMILIES: ReadonlySet<string> = new Set(
+  [
+    // Generic keywords + UI stacks
+    "serif",
+    "sans-serif",
+    "monospace",
+    "cursive",
+    "fantasy",
+    "system-ui",
+    "ui-sans-serif",
+    "ui-serif",
+    "ui-monospace",
+    "ui-rounded",
+    "-apple-system",
+    "blinkmacsystemfont",
+    // Cross-platform classics
+    "arial",
+    "arial black",
+    "helvetica",
+    "helvetica neue",
+    "georgia",
+    "times",
+    "times new roman",
+    "courier",
+    "courier new",
+    "verdana",
+    "tahoma",
+    "trebuchet ms",
+    "impact",
+    "palatino",
+    "garamond",
+    // Platform UI/mono staples browsers resolve locally
+    "segoe ui",
+    "sf pro",
+    "sf pro text",
+    "sf pro display",
+    "sf mono",
+    "sfmono-regular",
+    "menlo",
+    "monaco",
+    "consolas",
+    "lucida console",
+    "lucida sans",
+  ].map((f) => f.toLowerCase()),
+);
+
+/** True when the family resolves locally on visitors' machines. */
+export function isSystemFontFamily(family: string): boolean {
+  return SYSTEM_FONT_FAMILIES.has(family.trim().toLowerCase());
+}
+
+/** Strip quotes + whitespace from one family in a font stack. */
+function cleanFamilyName(raw: string): string {
+  return raw
+    .trim()
+    .replace(/^["']|["']$/g, "")
+    .trim();
+}
+
+const KEYWORD_WEIGHTS: Record<string, number> = {
+  normal: 400,
+  bold: 700,
+  // Relative keywords have no absolute value; anchor to the common pair
+  // so the request still covers a usable range.
+  lighter: 300,
+  bolder: 700,
+};
+
+const DEFAULT_WEIGHTS = [400, 700] as const;
+
+/**
+ * Walk `typography.*` composites and collect every non-system family
+ * with the weights the theme declares for it. Alias entries (`$value`
+ * as `{other.token}` string) are skipped — they point at a concrete
+ * composite that is collected on its own.
+ *
+ * Only the FIRST family of a declared stack is requested: the rest of
+ * the stack is the author's fallback chain, which by definition is not
+ * delivered.
+ */
+export function extractThemeFontRequests(tokens: ThemeDocument): FontRequest[] {
+  const typography = (tokens as Record<string, unknown>).typography;
+  if (typography === undefined || typography === null || typeof typography !== "object") {
+    return [];
+  }
+  const byFamily = new Map<string, { weights: Set<number>; roles: string[] }>();
+  for (const [role, entry] of Object.entries(typography as Record<string, unknown>)) {
+    if (entry === null || typeof entry !== "object") continue;
+    const value = (entry as { $value?: unknown }).$value;
+    if (value === null || typeof value !== "object") continue; // alias or malformed
+    const composite = value as { fontFamily?: unknown; fontWeight?: unknown };
+    if (typeof composite.fontFamily !== "string") continue;
+    const primary = cleanFamilyName(composite.fontFamily.split(",")[0] ?? "");
+    if (primary === "" || isSystemFontFamily(primary)) continue;
+
+    const bucket = byFamily.get(primary) ?? { weights: new Set<number>(), roles: [] };
+    if (typeof composite.fontWeight === "number") {
+      bucket.weights.add(composite.fontWeight);
+    } else if (typeof composite.fontWeight === "string") {
+      const mapped = KEYWORD_WEIGHTS[composite.fontWeight];
+      if (mapped !== undefined) bucket.weights.add(mapped);
+    }
+    bucket.roles.push(role);
+    byFamily.set(primary, bucket);
+  }
+  return [...byFamily.entries()].map(([family, b]) => ({
+    family,
+    weights:
+      b.weights.size > 0
+        ? [...b.weights].sort((a, z) => a - z)
+        : ([...DEFAULT_WEIGHTS] as number[]),
+    roles: b.roles,
+  }));
+}
+
+/** css2 request URL for one family (woff2 negotiated via the UA header). */
+export function googleFontsCssUrl(request: FontRequest): string {
+  const family = encodeURIComponent(request.family).replace(/%20/g, "+");
+  const weights = request.weights.join(";");
+  return `https://fonts.googleapis.com/css2?family=${family}:wght@${weights}&display=swap`;
+}
+
+/**
+ * `[^{}]*` (not `[^}]*`): the char class excluding BOTH braces makes the
+ * pattern unambiguous — on adversarial payloads full of unclosed
+ * `@font-face{` starts, a failed match aborts at the next `{` instead of
+ * rescanning to end-of-input per start position (the polynomial-ReDoS
+ * shape CodeQL flags; this file parses remotely-served CSS).
+ */
+const FONT_FACE_BLOCK_RE = /@font-face\s*\{([^{}]*)\}/g;
+
+/** css2 responses are ~10–50 KB; anything past this is not a fonts CSS. */
+const MAX_FONTS_CSS_BYTES = 1_000_000;
+
+function declValue(block: string, prop: string): string | null {
+  const m = new RegExp(`${prop}\\s*:\\s*([^;]+);`, "i").exec(block);
+  return m ? (m[1] ?? "").trim() : null;
+}
+
+/**
+ * Parse a fonts-CSS payload (css2 response shape) into face records.
+ * Faces without a woff2/woff URL are dropped; a payload yielding zero
+ * faces is the caller's loud-failure signal, not a silent empty set.
+ * Oversized payloads short-circuit to [] for the same loud path —
+ * a legitimate css2 response is orders of magnitude smaller.
+ */
+export function parseFontsCss(cssText: string): ParsedFontFace[] {
+  if (cssText.length > MAX_FONTS_CSS_BYTES) return [];
+  const faces: ParsedFontFace[] = [];
+  for (const m of cssText.matchAll(FONT_FACE_BLOCK_RE)) {
+    const block = m[1] ?? "";
+    const familyRaw = declValue(block, "font-family");
+    const src = declValue(block, "src");
+    if (familyRaw === null || src === null) continue;
+    // Capture the whole url(...) argument with an unambiguous class,
+    // then check the extension in code — `[^)]+\.woff2?` is the classic
+    // ambiguous-suffix polynomial pattern.
+    const urlMatch = /url\(([^()]*)\)/i.exec(src);
+    if (!urlMatch) continue;
+    const srcUrl = (urlMatch[1] ?? "").trim().replace(/^["']|["']$/g, "");
+    const lower = srcUrl.toLowerCase();
+    if (!(lower.endsWith(".woff2") || lower.endsWith(".woff"))) continue;
+    faces.push({
+      family: cleanFamilyName(familyRaw),
+      style: declValue(block, "font-style") ?? "normal",
+      weight: declValue(block, "font-weight") ?? "400",
+      unicodeRange: declValue(block, "unicode-range"),
+      srcUrl,
+    });
+  }
+  return faces;
+}
+
+/**
+ * Emit self-hosted @font-face CSS. `font-display: swap` always — text
+ * must render in the fallback while the woff2 loads.
+ */
+export function buildFontFaceCss(faces: readonly ResolvedFontFace[]): string {
+  return faces
+    .map((f) => {
+      const range = f.unicodeRange !== null ? `unicode-range:${f.unicodeRange};` : "";
+      return (
+        `@font-face{font-family:${JSON.stringify(f.family)};` +
+        `font-style:${f.style};font-weight:${f.weight};font-display:swap;` +
+        `src:url(${f.publicUrl}) format('woff2');${range}}`
+      );
+    })
+    .join("\n");
+}
+
+/** Latin-subset heuristic: css2 marks it with a range starting U+0000. */
+function isLatinFace(f: ResolvedFontFace): boolean {
+  return f.unicodeRange === null || f.unicodeRange.toLowerCase().includes("u+0000");
+}
+
+/**
+ * Pick the faces worth a `<link rel="preload">`: one per family — the
+ * latin, normal-style face at the lowest declared weight (the body-copy
+ * face; heavier display cuts arrive via normal loading). Capped at two
+ * families so the preload budget stays sane on multi-family themes.
+ */
+export function selectPreloadFaces(faces: readonly ResolvedFontFace[]): ResolvedFontFace[] {
+  const byFamily = new Map<string, ResolvedFontFace[]>();
+  for (const f of faces) {
+    if (f.style !== "normal" || !isLatinFace(f)) continue;
+    const list = byFamily.get(f.family) ?? [];
+    list.push(f);
+    byFamily.set(f.family, list);
+  }
+  const picks: ResolvedFontFace[] = [];
+  for (const list of byFamily.values()) {
+    list.sort((a, z) => Number.parseInt(a.weight, 10) - Number.parseInt(z.weight, 10));
+    const first = list[0];
+    if (first !== undefined) picks.push(first);
+  }
+  return picks.slice(0, 2);
+}
+
+/**
+ * Structured marker for a family that could not be resolved. Lands in
+ * `missingSlots` (preview, soft) or a thrown deploy error (hard) — the
+ * same loud-signal convention as `theme-asset-unbound:<slot>`.
+ */
+export function fontUnresolvableMarker(family: string): string {
+  return `theme-font-unresolvable:${family}`;
+}
+
+/**
+ * Filesystem/URL-safe slug for a family name. Shared between the font
+ * resolver (writes `<cacheDir>/<slug>/…`) and the admin serve route
+ * (reads the same path from the URL) so the two can't drift.
+ */
+export function fontFamilySlug(family: string): string {
+  // After the collapse pass, dash RUNS no longer exist — at most one
+  // leading + one trailing dash remain, so the trim pattern needs no
+  // quantifier (a `-+$` here is the polynomial-ReDoS shape on
+  // adversarial all-dash input; this runs on library-supplied strings).
+  return family
+    .trim()
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, "-")
+    .replace(/^-|-$/g, "");
+}

package/src/genesis-inventory.test.ts

@@ -0,0 +1,86 @@
+// SPDX-License-Identifier: MPL-2.0
+
+/**
+ * issue #164 — inventory stage unit coverage: style extraction, color
+ * usage attribution (including gradient stops), typography + spacing
+ * histograms, outline scan, formatting, and the linear-parse budget on
+ * adversarial input (ReDoS discipline, issue #113).
+ */
+
+import { describe, expect, it } from "bun:test";
+import {
+  extractDraftCss,
+  formatGenesisInventory,
+  inventoryGenesisDraft,
+} from "./genesis-inventory.js";
+
+const DRAFT = `<!doctype html><html><head><style>
+  body { font-family: "Inter", sans-serif; color: #0f172a; background: #ffffff; margin: 0; }
+  h1, h2 { font-family: "Playfair Display", serif; }
+  h1 { font-size: clamp(2.5rem, 6vw, 4rem); }
+  .hero { background: linear-gradient(135deg, #4f46e5, #7c3aed); padding: 6rem 2rem; color: #ffffff; }
+  .card { background: #ffffff; border-radius: 12px; box-shadow: 0 4px 24px rgba(15,23,42,0.08); padding: 2rem; }
+  .cta { background: #4f46e5; color: #ffffff; padding: 0.75rem 1.5rem; border-radius: 9999px; }
+  .section-alt { background: #f5f3ff; padding: 6rem 2rem; }
+</style></head>
+<body>
+  <header><nav>Brand</nav></header>
+  <section class="hero"><h1>Bold headline for the brand</h1></section>
+  <section class="section-alt"><h2>What we do</h2></section>
+  <footer>© Brand</footer>
+</body></html>`;
+
+describe("inventoryGenesisDraft (issue #164)", () => {
+  const inv = inventoryGenesisDraft(DRAFT);
+
+  it("extracts style blocks linearly", () => {
+    expect(extractDraftCss(DRAFT)).toContain("linear-gradient");
+    expect(extractDraftCss("<p>no styles</p>")).toBe("");
+  });
+
+  it("attributes colors to properties with counts, including gradient stops", () => {
+    const primary = inv.colors.find((c) => c.value === "#4f46e5");
+    expect(primary).toBeDefined();
+    expect(primary?.count).toBe(2); // gradient stop + .cta background
+    expect(primary?.properties).toContain("background");
+    const white = inv.colors.find((c) => c.value === "#ffffff");
+    expect(white?.properties).toEqual(["background", "color"]);
+  });
+
+  it("collects gradients, fonts, sizes, spacing, radii, shadows", () => {
+    expect(inv.gradients[0]).toBe("linear-gradient(135deg, #4f46e5, #7c3aed)");
+    expect(inv.fontFamilies).toContain("Inter");
+    expect(inv.fontFamilies).toContain("Playfair Display");
+    expect(inv.fontSizes).toContain("clamp(2.5rem, 6vw, 4rem)");
+    expect(inv.spacingValues).toContain("6rem");
+    expect(inv.radiusValues).toContain("12px");
+    expect(inv.shadows[0]).toContain("0 4px 24px");
+  });
+
+  it("builds the section outline in document order", () => {
+    expect(inv.outline.map((o) => o.tag)).toEqual([
+      "header",
+      "nav",
+      "section",
+      "h1",
+      "section",
+      "h2",
+      "footer",
+    ]);
+    expect(inv.outline[3]?.text).toContain("Bold headline");
+  });
+
+  it("formats a compact prompt-friendly report", () => {
+    const report = formatGenesisInventory(inv);
+    expect(report).toContain("#4f46e5×2[background]");
+    expect(report).toContain("Font families: Inter, Playfair Display");
+    expect(report).toContain("Outline: <header>");
+  });
+
+  it("stays within budget on adversarial input (linear parse)", () => {
+    const evil = `<style>${"a{b:c;".repeat(30_000)}</style>${"<section>".repeat(5_000)}`;
+    const t0 = performance.now();
+    inventoryGenesisDraft(evil);
+    expect(performance.now() - t0).toBeLessThan(250);
+  });
+});

package/src/genesis-inventory.ts

@@ -0,0 +1,215 @@
+// SPDX-License-Identifier: MPL-2.0
+
+/**
+ * issue #164 — design-compiler stage 1: the deterministic INVENTORY.
+ *
+ * Compiler contract (epic #149): the AI decides, code executes and
+ * verifies. This module is the "code" half of the first stage — it
+ * parses a Genesis draft (complete single-file HTML) into a fact base
+ * of design values (colors with usage contexts, font families, size /
+ * spacing / radius histograms, gradients, shadows) plus a section
+ * outline. The AI reads the inventory and makes the DECISIONS (which
+ * literal becomes which token, what things are called); it never has
+ * to re-derive facts by eyeballing raw CSS, and the facts can't be
+ * hallucinated.
+ *
+ * Pure string analysis, linear scans, unambiguous regex classes
+ * (ReDoS-aware per issue #113 — drafts are AI-authored but the parser
+ * budget must hold on adversarial input too).
+ */
+
+import { scanCssGradients } from "./css-gradient-scan.js";
+
+/** One distinct color literal with where/how often the draft uses it. */
+export interface ColorUsage {
+  readonly value: string;
+  readonly count: number;
+  /** Distinct declaration properties using it (background, color, …). */
+  readonly properties: readonly string[];
+}
+
+export interface GenesisDraftInventory {
+  readonly colors: readonly ColorUsage[];
+  readonly gradients: readonly string[];
+  readonly fontFamilies: readonly string[];
+  readonly fontSizes: readonly string[];
+  readonly spacingValues: readonly string[];
+  readonly radiusValues: readonly string[];
+  readonly shadows: readonly string[];
+  /** Ordered structural outline of the body (tag + text snippet). */
+  readonly outline: readonly { tag: string; text: string }[];
+}
+
+/** Linear extraction of every <style> block's contents. */
+export function extractDraftCss(html: string): string {
+  const parts: string[] = [];
+  const lower = html.toLowerCase();
+  let from = 0;
+  while (true) {
+    const open = lower.indexOf("<style", from);
+    if (open === -1) break;
+    const openEnd = lower.indexOf(">", open);
+    if (openEnd === -1) break;
+    const close = lower.indexOf("</style", openEnd);
+    if (close === -1) break;
+    parts.push(html.slice(openEnd + 1, close));
+    from = close + 8;
+  }
+  return parts.join("\n");
+}
+
+const DECLARATION_RE = /([a-zA-Z-]+)\s*:\s*([^;{}]+)/g;
+const COLOR_LITERAL_RE = /#[0-9a-fA-F]{3,8}\b|(?:oklch|rgba?|hsla?|lab|lch|hwb)\([^()]*\)/g;
+const LENGTH_RE = /-?\d+(?:\.\d+)?(?:rem|em|px|vh|vw|ch|%)\b/g;
+
+const SPACING_PROPS = new Set([
+  "margin",
+  "margin-top",
+  "margin-bottom",
+  "margin-left",
+  "margin-right",
+  "margin-block",
+  "margin-inline",
+  "padding",
+  "padding-top",
+  "padding-bottom",
+  "padding-left",
+  "padding-right",
+  "padding-block",
+  "padding-inline",
+  "gap",
+  "row-gap",
+  "column-gap",
+]);
+
+const GENERIC_FONT_KEYWORDS: ReadonlySet<string> = new Set([
+  "serif",
+  "sans-serif",
+  "monospace",
+  "cursive",
+  "fantasy",
+  "system-ui",
+  "ui-sans-serif",
+  "ui-serif",
+  "ui-monospace",
+]);
+
+function pushCount(map: Map<string, number>, key: string): void {
+  map.set(key, (map.get(key) ?? 0) + 1);
+}
+
+function sortedByCount(map: Map<string, number>): string[] {
+  return [...map.entries()].sort((a, z) => z[1] - a[1]).map(([k]) => k);
+}
+
+const OUTLINE_TAG_RE = /<(section|header|footer|main|nav|h1|h2|h3)\b[^>]*>/gi;
+const TAG_STRIP_RE = /<[^>]*>/g;
+
+/**
+ * Build the inventory. Caps guard pathological drafts: the boundary
+ * already limits draft size (GENESIS_DRAFT_MAX_HTML_BYTES), and each
+ * result list is truncated to what a decision-maker can actually use.
+ */
+export function inventoryGenesisDraft(html: string): GenesisDraftInventory {
+  const css = extractDraftCss(html);
+
+  const colorMeta = new Map<string, { count: number; properties: Set<string> }>();
+  const gradients = new Map<string, number>();
+  const fontFamilies = new Map<string, number>();
+  const fontSizes = new Map<string, number>();
+  const spacing = new Map<string, number>();
+  const radii = new Map<string, number>();
+  const shadows = new Map<string, number>();
+
+  for (const decl of css.matchAll(DECLARATION_RE)) {
+    const prop = (decl[1] ?? "").toLowerCase();
+    const value = (decl[2] ?? "").trim();
+
+    for (const g of scanCssGradients(value)) {
+      pushCount(gradients, g.literal);
+    }
+    // Colors inside gradients still count — a gradient stop color is a
+    // palette member the token map must name.
+    for (const c of value.matchAll(COLOR_LITERAL_RE)) {
+      const key = c[0].toLowerCase();
+      const meta = colorMeta.get(key) ?? { count: 0, properties: new Set<string>() };
+      meta.count += 1;
+      meta.properties.add(prop);
+      colorMeta.set(key, meta);
+    }
+    if (prop === "font-family") {
+      for (const fam of value.split(",")) {
+        const clean = fam.trim().replace(/^["']|["']$/g, "");
+        // Generic keywords are fallback-chain noise, not palette
+        // members — the token map names real typefaces.
+        if (
+          clean.length > 0 &&
+          clean.length < 80 &&
+          !GENERIC_FONT_KEYWORDS.has(clean.toLowerCase())
+        ) {
+          pushCount(fontFamilies, clean);
+        }
+      }
+    } else if (prop === "font-size") {
+      pushCount(fontSizes, value);
+    } else if (SPACING_PROPS.has(prop)) {
+      for (const len of value.matchAll(LENGTH_RE)) pushCount(spacing, len[0]);
+    } else if (prop === "border-radius") {
+      pushCount(radii, value);
+    } else if (prop === "box-shadow" || prop === "text-shadow") {
+      pushCount(shadows, value);
+    }
+  }
+
+  const outline: { tag: string; text: string }[] = [];
+  for (const m of html.matchAll(OUTLINE_TAG_RE)) {
+    if (outline.length >= 60) break;
+    const tag = (m[1] ?? "").toLowerCase();
+    const start = (m.index ?? 0) + m[0].length;
+    const text = html
+      .slice(start, start + 400)
+      .replace(TAG_STRIP_RE, " ")
+      .replace(/\s+/g, " ")
+      .trim()
+      .slice(0, 80);
+    outline.push({ tag, text });
+  }
+
+  return {
+    colors: [...colorMeta.entries()]
+      .sort((a, z) => z[1].count - a[1].count)
+      .slice(0, 40)
+      .map(([value, meta]) => ({
+        value,
+        count: meta.count,
+        properties: [...meta.properties].sort(),
+      })),
+    gradients: sortedByCount(gradients).slice(0, 12),
+    fontFamilies: sortedByCount(fontFamilies).slice(0, 12),
+    fontSizes: sortedByCount(fontSizes).slice(0, 24),
+    spacingValues: sortedByCount(spacing).slice(0, 24),
+    radiusValues: sortedByCount(radii).slice(0, 12),
+    shadows: sortedByCount(shadows).slice(0, 12),
+    outline,
+  };
+}
+
+/** Compact, prompt-friendly rendering of the inventory. */
+export function formatGenesisInventory(inv: GenesisDraftInventory): string {
+  const lines: string[] = [];
+  lines.push(
+    `Colors (${inv.colors.length}): ${inv.colors
+      .map((c) => `${c.value}×${c.count}[${c.properties.join("/")}]`)
+      .join(", ")}`,
+  );
+  if (inv.gradients.length > 0) lines.push(`Gradients: ${inv.gradients.join(" | ")}`);
+  lines.push(`Font families: ${inv.fontFamilies.join(", ") || "(none declared)"}`);
+  lines.push(`Font sizes: ${inv.fontSizes.join(", ")}`);
+  lines.push(`Spacing values: ${inv.spacingValues.join(", ")}`);
+  if (inv.radiusValues.length > 0) lines.push(`Radii: ${inv.radiusValues.join(", ")}`);
+  if (inv.shadows.length > 0) lines.push(`Shadows: ${inv.shadows.join(" | ")}`);
+  lines.push(
+    `Outline: ${inv.outline.map((o) => `<${o.tag}>${o.text ? ` ${o.text}` : ""}`).join(" → ")}`,
+  );
+  return lines.join("\n");
+}

package/src/genesis-sanitize.test.ts

@@ -0,0 +1,35 @@
+// SPDX-License-Identifier: MPL-2.0
+
+/**
+ * issue #199 — sanitizeDraftHtml. Adversarial per CLAUDE.md §6:
+ * operator-provided HTML becomes a stored draft that flows into
+ * materialisation, so script removal must survive casing tricks,
+ * multiple blocks, and unterminated tags.
+ */
+
+import { describe, expect, it } from "bun:test";
+import { sanitizeDraftHtml } from "./genesis.js";
+
+describe("sanitizeDraftHtml (#199)", () => {
+  it("strips script blocks, keeps everything else byte-identical", () => {
+    const html = `<html><head><style>.a{color:red}</style><script>alert(1)</script></head><body><h1>Hi</h1></body></html>`;
+    expect(sanitizeDraftHtml(html)).toBe(
+      `<html><head><style>.a{color:red}</style></head><body><h1>Hi</h1></body></html>`,
+    );
+  });
+
+  it("survives casing + attributes + multiple blocks", () => {
+    const html = `<SCRIPT src="evil.js"></SCRIPT><p>a</p><ScRiPt type="module">fetch('/x')</ScRiPt><p>b</p>`;
+    expect(sanitizeDraftHtml(html)).toBe(`<p>a</p><p>b</p>`);
+  });
+
+  it("an unterminated script drops to EOF rather than leaking half a payload", () => {
+    const html = `<p>keep</p><script>document.cookie`;
+    expect(sanitizeDraftHtml(html)).toBe(`<p>keep</p>`);
+  });
+
+  it("leaves script-free documents untouched", () => {
+    const html = `<body><section class="description">javascript is a word, &lt;script&gt; is an entity</section></body>`;
+    expect(sanitizeDraftHtml(html)).toBe(html);
+  });
+});