@legionworks/facet 1.10.0 → 1.10.2

package/src/gallery-web/frame/renderers/registry.ts

@@ -1,6 +1,6 @@
 import type { ArtifactType } from "../../../shared/contracts/artifact-types";
 import { isRenderer, type Renderer as RendererKind } from "../../../shared/contracts/renderers";
-import { HTML_STRUCTURAL_GROUPS } from "../../../shared/html/policy";
+import { HTML_STRUCTURAL_GROUPS, isExternalHttpsImageSource } from "../../../shared/html/policy";
 import type { VerdictObserved } from "../../../shared/contracts/validation";
 import type { ObservedCountKey } from "../../../shared/contracts/observed-counts";
 import { isTsxExecutionMode, type TsxExecutionMode } from "../../../shared/tsx/execution";
@@ -140,9 +140,12 @@ export function countPageShim(): PageShimCounts {
   const graphRoots = roots.filter((root) => root.getAttribute(RENDERER_GRAPH_ATTRIBUTE) === "true");
   const allMarkedCandidates = safeSelectorElements(MARKED_ROOT_SELECTOR);
   const markedSet = new Set(allMarkedCandidates);
-  const htmlRoots = allMarkedCandidates.filter(
+  const contentRoots = allMarkedCandidates.filter(
     (root) => root.nodeName.toLowerCase() !== "svg" && !hasMarkedRootAncestor(root, markedSet),
   );
+  const htmlRoots = contentRoots.filter(
+    (root) => root.getAttribute("data-facet-renderer-kind") !== "markdown",
+  );
   const html =
     htmlRoots.length === 0
       ? undefined
@@ -170,13 +173,9 @@ export function countPageShim(): PageShimCounts {
     ).length;
     const images = safeSelectorElementsWithin(root, HTML_STRUCTURAL_GROUPS.images.join(","));
     html!.imageCount += images.length;
-    html!.externalImageCount += images.filter((image) => {
-      try {
-        return new URL(image.getAttribute("src") ?? "").protocol === "https:";
-      } catch {
-        return false;
-      }
-    }).length;
+    html!.externalImageCount += images.filter((image) =>
+      isExternalHttpsImageSource(image.getAttribute("src")),
+    ).length;
     html!.canvasCount += safeSelectorElementsWithin(
       root,
       HTML_STRUCTURAL_GROUPS.canvases.join(","),
@@ -192,13 +191,21 @@ export function countPageShim(): PageShimCounts {
   const opaqueRegionCount = safeSelectorElements("*").filter(
     (element) => element.nodeName.toLowerCase() === "canvas",
   ).length;
+  const externalImageCount = contentRoots.reduce(
+    (count, root) =>
+      count +
+      safeSelectorElementsWithin(root, HTML_STRUCTURAL_GROUPS.images.join(",")).filter((image) =>
+        isExternalHttpsImageSource(image.getAttribute("src")),
+      ).length,
+    0,
+  );
   return {
     rendererRootSvgCount: roots.length,
     graphCount: graphRoots.length,
     mermaidNodeCount,
     visibleSvgCount: roots.filter(nonDegenerateViewBox).length,
     opaqueRegionCount,
-    externalImageCount: html?.externalImageCount ?? 0,
+    externalImageCount,
     errorCount: safeSelectorElements("[data-facet-error]").length,
     ...(html === undefined ? {} : { html }),
   };

package/src/gallery-web/frame/runtime.ts

@@ -1,5 +1,5 @@
 import { isTsxExecutionMode, type TsxExecutionMode } from "../../shared/tsx/execution";
-import { isResolvedGalleryTheme } from "../theme";
+import { galleryDataTheme, isResolvedGalleryTheme, type ResolvedGalleryTheme } from "../theme";
 
 import { validateRenderer } from "./renderer-validation";
 import {
@@ -80,6 +80,7 @@ interface DiagramRegionGestures {
 
 export interface GalleryFrameApi {
   render(payload: FrameRenderPayload): Promise<RenderResult>;
+  setTheme(theme: ResolvedGalleryTheme): void;
 }
 
 declare global {
@@ -410,6 +411,11 @@ export function installGalleryFrameApi(registry: RendererRegistry): void {
   };
 
   const api: GalleryFrameApi = {
+    setTheme(theme) {
+      if (!isResolvedGalleryTheme(theme))
+        throw new FacetRenderError("frame theme is invalid", "invalid_request");
+      document.documentElement.dataset.theme = galleryDataTheme(theme);
+    },
     async render(payload: FrameRenderPayload): Promise<RenderResult> {
       if (rendered) throw new FacetRenderError("frame already rendered", "invalid_request");
       const validated = validatePayload(payload);

package/src/gallery-web/frame/styles/artifact.css

@@ -5256,6 +5256,9 @@
   .mx-16 {
     margin-inline: calc(var(--spacing) * 16);
   }
+  .mx-auto {
+    margin-inline: auto;
+  }
   .my-0 {
     margin-block: 0px;
   }

package/src/gallery-web/frame/styles/frame.css

@@ -78,26 +78,7 @@ body {
   padding-inline: max(16px, calc((100% - 92ch) / 2));
 }
 
-/*
- * Native dashboard artifacts (html, interactive tsx) read top-down
- * like markdown — vertical stays start-aligned — but unlike markdown
- * their width is whatever the fixture authored (often a fixed-width
- * `max-w-*` container), not a fluid readable column. Left unstyled,
- * that narrow content sits pinned to the container's left edge,
- * stranding most of a wide desktop stage as dead space.
- *
- * The centering has to land on the renderer-ROOT element
- * (`.facet-html-root` / `#facet-tsx-mount`), not `#artifact` itself:
- * `renderHtml`/`renderTsx` always mount a single full-width wrapper
- * as `#artifact`'s only child, and the fixture's own narrow content
- * (e.g. `<main class="max-w-2xl">`) is a GRANDCHILD of `#artifact`
- * inside that wrapper — centering `#artifact`'s single full-width
- * child does nothing. `safe center` on the horizontal axis only —
- * the same fallback-to-start mechanism the standalone-diagram rule
- * above uses — centers content that fits and never clips content
- * wider than the stage (it start-aligns and stays reachable by
- * scroll instead).
- */
+/* These selectors match usesArtifactStylesheet in frame-html.ts; CSS cannot import it. */
 #artifact[data-facet-artifact-type="html"],
 #artifact[data-facet-artifact-type="tsx"] {
   display: flex;
@@ -106,10 +87,9 @@ body {
 
 #artifact[data-facet-artifact-type="html"] > [data-facet-renderer-root],
 #artifact[data-facet-artifact-type="tsx"] > [data-facet-renderer-root] {
-  display: flex;
-  justify-content: safe center;
-  align-items: flex-start;
-  /* A full-height root plus a sibling runtime error makes capture bounds grow on every viewport resize. */
+  /* Block flow preserves authored sibling order while keeping the renderer root a flex item of the stage. */
+  display: block;
+  /* Filling the stage keeps a sibling runtime-error line outside capture bounds as the viewport resizes. */
   flex: 1 0 auto;
 }
 

package/src/gallery-web/frame-html.ts

@@ -31,6 +31,10 @@ export function buildFrameAttributes(src = "/gallery/frame"): FrameAttributes {
   };
 }
 
+export function usesArtifactStylesheet(artifactType: string): boolean {
+  return artifactType === "html" || artifactType === "tsx";
+}
+
 export function buildFrameDocument(options: {
   artifactType: string;
   runtimeUrl: string;
@@ -45,7 +49,7 @@ export function buildFrameDocument(options: {
   return (
     `<!doctype html><html data-theme="${galleryDataTheme(theme)}"><head>` +
     `<meta charset="utf-8"><link rel="stylesheet" href="/gallery/frame/frame.css">` +
-    (artifactType === "html" || artifactType === "tsx"
+    (usesArtifactStylesheet(artifactType)
       ? `<link rel="stylesheet" href="/gallery/frame/artifact.css">`
       : "") +
     "</head><body>" +

package/src/harness-adapters/mcp/server.ts

@@ -145,7 +145,7 @@ export function createFacetMcpServer(): Server {
     ),
     facet_publish: defineTool(
       PublishToolSchema,
-      "Publish exactly one sourceText or local file. Check envelope.ok separately from data.verdict.status: stored verdict status error is not a transport failure.",
+      'Publish exactly one sourceText or local file. Check envelope.ok separately from data.verdict.status: a stored verdict status of error is not a transport failure. Tier 0 parses and compiles structure but is not rendered; call facet_read_back with tier: "visual" before reporting a render.',
       async (input) => {
         const source = publishSource(input);
         return invoke(buildFacetArgs("publish", { ...input, ...source }), source);
@@ -153,7 +153,7 @@ export function createFacetMcpServer(): Server {
     ),
     facet_read_back: defineTool(
       ReadBackToolSchema,
-      "Read back the latest or revision-bound stored verdict at Tier 0, Tier 1, or visual. Tier 1 and visual need browser evidence; inspect envelope.ok before verdict status.",
+      "Read back a stored verdict at Tier 0, Tier 1, or visual. Tier 1 and visual need browser evidence from the pinned browser; inspect envelope.ok before verdict status. Visual covers the first rendered state; later interaction is not validated and does not change the stored verdict.",
       async (input) => invoke(buildFacetArgs("read_back", input)),
     ),
     facet_status: defineTool(

package/src/service/dispatcher.ts

@@ -526,6 +526,12 @@ export async function dispatch(
           ? deps.repository.getLatestRevision(command.artifactId)
           : deps.repository.getRevisionBySha(command.artifactId, command.revisionSha);
       if (revision === null) {
+        if (deps.repository.getArtifactById(command.artifactId) === null) {
+          throw new FacetError("artifact_not_found", "Artifact not found", {
+            retryable: false,
+            details: { artifactId: command.artifactId },
+          });
+        }
         throw new FacetError("revision_not_found", "Revision not found", {
           retryable: false,
           details: {
@@ -614,6 +620,12 @@ export async function dispatch(
           ? deps.repository.getLatestRevision(command.artifactId)
           : deps.repository.getRevisionBySha(command.artifactId, command.revisionSha);
       if (revision === null) {
+        if (deps.repository.getArtifactById(command.artifactId) === null) {
+          throw new FacetError("artifact_not_found", "Artifact not found", {
+            retryable: false,
+            details: { artifactId: command.artifactId },
+          });
+        }
         throw new FacetError("revision_not_found", "Revision not found", {
           retryable: false,
           details: {

package/src/shared/html/policy.ts

@@ -61,6 +61,15 @@ export function isHtmlInlineStyleAttribute(name: string): boolean {
   return name.toLowerCase() === "style";
 }
 
+export function isExternalHttpsImageSource(src: string | null | undefined): boolean {
+  if (typeof src !== "string") return false;
+  try {
+    return new URL(src).protocol === "https:";
+  } catch {
+    return false;
+  }
+}
+
 export function isAllowedHtmlUrl(
   elementName: string,
   attributeName: string,

package/src/shared/html/style-vocabulary.ts

@@ -28,6 +28,7 @@ export const HTML_TAILWIND_CLASSES = [
   "mt-4",
   "mb-2",
   "mb-4",
+  "mx-auto",
   "w-full",
   "max-w-prose",
   "max-w-2xl",

package/src/validation/tier0/html.ts

@@ -10,6 +10,7 @@ import {
   isHtmlInlineStyleAttribute,
   isHtmlUrlAttributeName,
   isHtmlUrlBearingAttribute,
+  isExternalHttpsImageSource,
 } from "../../shared/html/policy";
 
 export interface HtmlParseOk {
@@ -131,14 +132,6 @@ function templateContent(node: unknown): unknown | null {
   return isRecord(node) && isRecord(node.content) ? node.content : null;
 }
 
-function isHttpsUrl(value: string): boolean {
-  try {
-    return new URL(value.trim()).protocol.toLowerCase() === "https:";
-  } catch {
-    return false;
-  }
-}
-
 function isWhitespace(character: string): boolean {
   return (
     character === " " ||
@@ -190,7 +183,11 @@ function validateUrl(
       );
       continue;
     }
-    if (countStructure && (tagName === "img" || tagName === "source") && isHttpsUrl(candidate)) {
+    if (
+      countStructure &&
+      (tagName === "img" || tagName === "source") &&
+      isExternalHttpsImageSource(candidate)
+    ) {
       counts.externalImageCount += 1;
     }
   }

package/src/validation/tier0/markdown.ts

@@ -29,6 +29,7 @@
 import { Lexer, type Token, type Tokens } from "marked";
 
 import type { DiscriminativeError, VerdictObserved } from "../../shared/contracts/validation";
+import { isExternalHttpsImageSource } from "../../shared/html/policy";
 import { countMermaidNodeDeclarations } from "../../shared/util/mermaid-nodes";
 import { parseMermaidText } from "./mermaid";
 
@@ -58,17 +59,6 @@ interface MarkdownCounts {
   mermaidBodies: string[];
 }
 
-function isExternalHttpsUrl(value: string): boolean {
-  // The URL constructor canonicalizes the protocol; malformed URLs
-  // (e.g. `https://[`) return false here rather than throwing, so the
-  // token walk surfaces a typed zero instead of crashing Tier 0.
-  try {
-    return new URL(value.trim()).protocol.toLowerCase() === "https:";
-  } catch {
-    return false;
-  }
-}
-
 /**
  * Walk the marked token tree and tally the surfaces that matter for
  * the Tier 0 verdict: fenced blocks, mermaid blocks, raw HTML blocks,
@@ -122,7 +112,7 @@ function walkTokens(tokens: Token[], counts: MarkdownCounts): void {
       if (/\b(?:href|src)\s*=\s*["']https?:/i.test(raw)) counts.hasExternalRef = true;
     } else if (token.type === "image") {
       const image = token as Tokens.Image;
-      if (isExternalHttpsUrl(image.href ?? "")) counts.externalImageCount += 1;
+      if (isExternalHttpsImageSource(image.href)) counts.externalImageCount += 1;
     }
     // Recurse every container Marked actually emits with children.
     const recurseTokens = (sub: Token[] | undefined): void => {

package/src/validation/tier1/isolated-probe.ts

@@ -19,7 +19,7 @@
  */
 
 import type { ProtocolObservation } from "../../shared/contracts/validation";
-import { HTML_STRUCTURAL_GROUPS } from "../../shared/html/policy";
+import { HTML_STRUCTURAL_GROUPS, isExternalHttpsImageSource } from "../../shared/html/policy";
 
 import type { VerifierCdpSession } from "./browser-process";
 
@@ -32,27 +32,37 @@ export async function probeIsolatedCounts(
     const selectors = Object.fromEntries(
       Object.entries(HTML_STRUCTURAL_GROUPS).map(([group, names]) => [group, names.join(",")]),
     );
+    const externalHttpsImageSource = isExternalHttpsImageSource.toString();
     const result = (await session.send("Runtime.evaluate", {
       contextId: executionContextId,
       returnByValue: true,
       expression: [
         "(function(){",
         "  var candidates = Array.prototype.slice.call(document.querySelectorAll('[data-facet-renderer-root=\"true\"]'));",
-        "  var candidateSet = new Set(candidates);",
-        "  var roots = candidates.filter(function(root){",
-        "    for (var parent = root.parentElement; parent; parent = parent.parentElement) {",
-        "      if (candidateSet.has(parent)) return false;",
-        "    }",
+        "  var svgCandidates = candidates.filter(function(root){ return String(root.nodeName).toLowerCase() === 'svg'; });",
+        "  var svgCandidateSet = new Set(svgCandidates);",
+        "  var svgRoots = svgCandidates.filter(function(root){",
+        "    for (var parent = root.parentElement; parent; parent = parent.parentElement) if (svgCandidateSet.has(parent)) return false;",
         "    return true;",
         "  });",
-        "  var svgRoots = roots.filter(function(root){ return String(root.nodeName).toLowerCase() === 'svg'; });",
+        "  var contentCandidates = candidates.filter(function(root){ return String(root.nodeName).toLowerCase() !== 'svg'; });",
+        "  var contentCandidateSet = new Set(contentCandidates);",
+        "  var contentRoots = contentCandidates.filter(function(root){",
+        "    for (var parent = root.parentElement; parent; parent = parent.parentElement) if (contentCandidateSet.has(parent)) return false;",
+        "    return true;",
+        "  });",
+        "  var htmlRoots = contentRoots.filter(function(root){ return root.getAttribute('data-facet-renderer-kind') !== 'markdown'; });",
         "  var graphRoots = svgRoots.filter(function(root){ return root.getAttribute('data-facet-renderer-graph') === 'true'; });",
-        "  var htmlRoots = roots.filter(function(root){ return String(root.nodeName).toLowerCase() !== 'svg'; });",
         `  var observeContent = ${JSON.stringify(observeContent)};`,
-        "  var emptyRendererRoot = observeContent && htmlRoots.length === 1 ? Array.prototype.every.call(htmlRoots[0].childNodes, function(node){ return node.nodeType !== 1 && (node.nodeType !== 3 || !node.textContent.trim()); }) : undefined;",
+        `  var isExternalHttpsImageSource = (${externalHttpsImageSource});`,
+        "  var emptyRendererRoot = observeContent && contentRoots.length === 1 ? Array.prototype.every.call(contentRoots[0].childNodes, function(node){ return node.nodeType !== 1 && (node.nodeType !== 3 || !node.textContent.trim()); }) : undefined;",
         `  var selectors = ${JSON.stringify(selectors)};`,
         "  var html = htmlRoots.length === 0 ? null : {rendererRootCount:htmlRoots.length,headingCount:0,tableCount:0,listCount:0,imageCount:0,canvasCount:0,externalImageCount:0};",
         "  var externalImageCount = 0;",
+        "  for (var c = 0; c < contentRoots.length; c++) {",
+        "    var contentImages = Array.prototype.slice.call(contentRoots[c].querySelectorAll(selectors.images));",
+        "    externalImageCount += contentImages.filter(function(image){ return isExternalHttpsImageSource(image.getAttribute('src')); }).length;",
+        "  }",
         "  for (var h = 0; h < htmlRoots.length; h++) {",
         "    var htmlRoot = htmlRoots[h];",
         "    html.headingCount += htmlRoot.querySelectorAll(selectors.headings).length;",
@@ -60,9 +70,8 @@ export async function probeIsolatedCounts(
         "    html.listCount += htmlRoot.querySelectorAll(selectors.lists).length;",
         "    var images = Array.prototype.slice.call(htmlRoot.querySelectorAll(selectors.images));",
         "    html.imageCount += images.length;",
-        "    var rootExternal = images.filter(function(image){ try { return new URL(image.getAttribute('src') || '').protocol === 'https:'; } catch (_) { return false; } }).length;",
+        "    var rootExternal = images.filter(function(image){ return isExternalHttpsImageSource(image.getAttribute('src')); }).length;",
         "    html.externalImageCount += rootExternal;",
-        "    externalImageCount += rootExternal;",
         "    html.canvasCount += htmlRoot.querySelectorAll(selectors.canvases).length;",
         "  }",
         "  var nodeCount = 0;",

package/src/validation/tier1/limits.ts

@@ -1,13 +1,15 @@
 /**
  * Resource caps for the Tier 1 verifier.
  *
- * Each cap is named and exposed so the runner, the harness builder,
- * and the penetration test agree on a single value. A failing cap
- * produces a typed `FacetError` with the matching `tier1_*` code.
+ * Named limits keep the runner, harness builder, and penetration test
+ * aligned. Enforced caps produce typed `FacetError`s with matching
+ * `tier1_*` codes; TIER1_TIMEOUT_MS remains an intended total-budget
+ * target until outer enforcement lands.
  */
 
 /**
- * Wall-clock budget for one Tier 1 verifier invocation. The harness
+ * Intended total budget target for one Tier 1 verifier invocation; it
+ * is not enforced yet. The harness
  * bundles the REAL renderers (mermaid + marked + vega, ~8 MB inline);
  * parse + first render of a 40-node fixture needs real headroom.
  */
@@ -36,10 +38,13 @@ export const TIER1_USER_DATA_DIR_MODE = 0o700;
  */
 export const TIER1_RENDER_BARRIER_MS = 30_000;
 
+/** Keep tiled evidence within the intended total-budget target after render and stability windows. */
+export const TIER1_TILED_CAPTURE_DEADLINE_MS = 15_000;
+
 /**
  * Time between the first interactive TSX observation and its bounded
- * stability re-check. It stays below the headroom after the render barrier so
- * a typed `partial:unstable` verdict remains observable before Tier 1 times out.
+ * stability re-check. It stays below the intended total-budget target after
+ * the render barrier; that outer target is not enforced yet.
  */
 export const TSX_STABILITY_WINDOW_MS = 1_000;
 

package/src/validation/tier1/protocol-probe.ts

@@ -20,7 +20,7 @@
  */
 
 import type { HtmlStructureCounts, ProtocolObservation } from "../../shared/contracts/validation";
-import { HTML_STRUCTURAL_GROUPS } from "../../shared/html/policy";
+import { HTML_STRUCTURAL_GROUPS, isExternalHttpsImageSource } from "../../shared/html/policy";
 
 import type { VerifierCdpSession } from "./browser-process";
 import type { ResolvedChildFrame } from "./frame-target";
@@ -49,7 +49,7 @@ export interface SnapshotDocument {
 function snapshotRootEmpty(snapshot: SnapshotResponse, documentIndex: number): boolean | undefined {
   const document = snapshot.documents[documentIndex];
   if (document === undefined) return undefined;
-  const roots = htmlRootIndexes(snapshot, documentIndex);
+  const roots = contentRootIndexes(snapshot, documentIndex);
   if (roots.length !== 1) return undefined;
   const root = roots[0];
   if (root === undefined) return undefined;
@@ -166,6 +166,18 @@ function hasAncestorIn(
 }
 
 function htmlRootIndexes(snapshot: SnapshotResponse, documentIndex: number): number[] {
+  return contentRootIndexes(snapshot, documentIndex).filter(
+    (nodeIndex) =>
+      attributeValue(
+        snapshot,
+        snapshot.documents[documentIndex]!,
+        nodeIndex,
+        "data-facet-renderer-kind",
+      ) !== "markdown",
+  );
+}
+
+function contentRootIndexes(snapshot: SnapshotResponse, documentIndex: number): number[] {
   const document = snapshot.documents[documentIndex];
   if (document === undefined) return [];
   const candidates = new Set<number>();
@@ -181,6 +193,27 @@ function htmlRootIndexes(snapshot: SnapshotResponse, documentIndex: number): num
   });
 }
 
+function countSnapshotExternalImages(snapshot: SnapshotResponse, documentIndex: number): number {
+  const document = snapshot.documents[documentIndex];
+  if (document === undefined) return 0;
+  const roots = new Set(contentRootIndexes(snapshot, documentIndex));
+  let count = 0;
+  for (let nodeIndex = 0; nodeIndex < document.nodes.nodeName.length; nodeIndex += 1) {
+    if (!isDescendantOf(document, nodeIndex, roots)) continue;
+    const name = readString(
+      snapshot.strings,
+      document.nodes.nodeName[nodeIndex] ?? 0,
+    ).toLowerCase();
+    if (
+      (HTML_STRUCTURAL_GROUPS.images as readonly string[]).includes(name) &&
+      isExternalHttpsImageSource(attributeValue(snapshot, document, nodeIndex, "src"))
+    ) {
+      count += 1;
+    }
+  }
+  return count;
+}
+
 function isDescendantOf(
   document: SnapshotDocument,
   nodeIndex: number,
@@ -194,15 +227,6 @@ function isDescendantOf(
   return false;
 }
 
-function isExternalHttps(value: string | undefined): boolean {
-  if (value === undefined) return false;
-  try {
-    return new URL(value).protocol === "https:";
-  } catch {
-    return false;
-  }
-}
-
 export function countSnapshotHtml(
   snapshot: SnapshotResponse,
   documentIndex: number,
@@ -233,7 +257,7 @@ export function countSnapshotHtml(
     if ((HTML_STRUCTURAL_GROUPS.lists as readonly string[]).includes(name)) counts.listCount += 1;
     if ((HTML_STRUCTURAL_GROUPS.images as readonly string[]).includes(name)) {
       counts.imageCount += 1;
-      if (isExternalHttps(attributeValue(snapshot, document, nodeIndex, "src"))) {
+      if (isExternalHttpsImageSource(attributeValue(snapshot, document, nodeIndex, "src"))) {
         counts.externalImageCount += 1;
       }
     }
@@ -372,6 +396,7 @@ export async function probeProtocolSnapshot(
   const discriminativeErrors = collectDiscriminativeErrors(snapshot, documentIndex);
   const errorCount = discriminativeErrors.length;
   const htmlCounts = countSnapshotHtml(snapshot, documentIndex);
+  const externalImageCount = countSnapshotExternalImages(snapshot, documentIndex);
   const emptyRendererRoot = observeContent ? snapshotRootEmpty(snapshot, documentIndex) : undefined;
   return {
     rendererRootSvgCount: rendererRoots.length,
@@ -379,7 +404,7 @@ export async function probeProtocolSnapshot(
     mermaidNodeCount: countGNode(snapshot, documentIndex, graphRoots),
     visibleSvgCount: viewBoxes.filter(isNonDegenerateViewBox).length,
     opaqueRegionCount: countByName(snapshot, documentIndex, "canvas"),
-    externalImageCount: htmlCounts?.externalImageCount ?? 0,
+    externalImageCount,
     ...(htmlCounts === undefined ? {} : { html: htmlCounts }),
     ...(emptyRendererRoot === undefined ? {} : { emptyRendererRoot }),
     viewBoxes,
@@ -424,6 +449,7 @@ export async function probeProtocolGetDocument(
   let gNodeCount = 0;
   let opaqueRegionCount = 0;
   let visibleSvgCount = 0;
+  let externalImageCount = 0;
   let html: HtmlStructureCounts | undefined;
   let emptyRendererRoot: boolean | undefined;
   const viewBoxes: string[] = [];
@@ -458,19 +484,21 @@ export async function probeProtocolGetDocument(
     const name = (record.nodeName ?? "").toLowerCase();
     const markedRoot = findAttr("data-facet-renderer-root") === "true";
     const rendererRoot = name === "svg" && markedRoot && !withinRendererRoot;
-    const htmlRoot = name !== "svg" && markedRoot && !withinMarkedRoot;
+    const contentRoot = name !== "svg" && markedRoot && !withinMarkedRoot;
+    const markdownRoot = contentRoot && findAttr("data-facet-renderer-kind") === "markdown";
+    const htmlRoot = contentRoot && !markdownRoot;
     const graphRoot = rendererRoot && findAttr("data-facet-renderer-graph") === "true";
+    if (contentRoot && observeContent) {
+      const empty = !(record.children ?? []).some((child) => {
+        const direct = child as ProtocolDomNode & { nodeType?: number; nodeValue?: string };
+        return (
+          direct.nodeType === 1 ||
+          (direct.nodeType === 3 && (direct.nodeValue ?? "").trim().length > 0)
+        );
+      });
+      emptyRendererRoot = emptyRendererRoot === undefined ? empty : false;
+    }
     if (htmlRoot) {
-      if (observeContent) {
-        const empty = !(record.children ?? []).some((child) => {
-          const direct = child as ProtocolDomNode & { nodeType?: number; nodeValue?: string };
-          return (
-            direct.nodeType === 1 ||
-            (direct.nodeType === 3 && (direct.nodeValue ?? "").trim().length > 0)
-          );
-        });
-        emptyRendererRoot = emptyRendererRoot === undefined ? empty : false;
-      }
       html ??= {
         rendererRootCount: 0,
         headingCount: 0,
@@ -498,6 +526,12 @@ export async function probeProtocolGetDocument(
     // covers the entire child-frame document so smuggled canvases stay visible.
     // getContext() would create a context and make the observation self-fulfilling.
     if (name === "canvas") opaqueRegionCount += 1;
+    if (
+      (withinMarkedRoot || contentRoot) &&
+      (HTML_STRUCTURAL_GROUPS.images as readonly string[]).includes(name)
+    ) {
+      if (isExternalHttpsImageSource(findAttr("src"))) externalImageCount += 1;
+    }
     if (withinHtmlRoot && html !== undefined) {
       if ((HTML_STRUCTURAL_GROUPS.headings as readonly string[]).includes(name))
         html.headingCount += 1;
@@ -505,7 +539,7 @@ export async function probeProtocolGetDocument(
       if ((HTML_STRUCTURAL_GROUPS.lists as readonly string[]).includes(name)) html.listCount += 1;
       if ((HTML_STRUCTURAL_GROUPS.images as readonly string[]).includes(name)) {
         html.imageCount += 1;
-        if (isExternalHttps(findAttr("src"))) html.externalImageCount += 1;
+        if (isExternalHttpsImageSource(findAttr("src"))) html.externalImageCount += 1;
       }
       if ((HTML_STRUCTURAL_GROUPS.canvases as readonly string[]).includes(name))
         html.canvasCount += 1;
@@ -545,7 +579,7 @@ export async function probeProtocolGetDocument(
     mermaidNodeCount: gNodeCount,
     visibleSvgCount,
     opaqueRegionCount,
-    externalImageCount: html?.externalImageCount ?? 0,
+    externalImageCount,
     ...(html === undefined ? {} : { html }),
     ...(emptyRendererRoot === undefined ? {} : { emptyRendererRoot }),
     viewBoxes,