@riddledc/riddle-proof 0.7.37 → 0.7.39

package/README.md

@@ -202,6 +202,25 @@ clears `local`, `session`, or `both` browser storage scopes, defaults to
 profile carries its own hosted Riddle worker budget; an explicit CLI `--timeout`
 still overrides the profile value for one-off runs.
 
+Use `allowed_console_patterns` / `allowed_console_texts` on
+`no_fatal_console_errors` when a negative-path profile intentionally triggers a
+known browser console error, such as a mocked `503` that the app recovers from:
+
+```json
+{
+  "type": "no_fatal_console_errors",
+  "allowed_console_patterns": [
+    "Failed to load resource: the server responded with a status of 503",
+    "Build failed: Error: Synthetic build outage"
+  ]
+}
+```
+
+Allowed console events and page errors are still counted in check evidence, but
+only unallowed `error` / `assert` console events and page errors fail the check.
+Use `allowed_page_error_patterns`, `allowed_console_texts`, or
+`allowed_page_error_texts` for narrower matching when needed.
+
 Use `selector_text_order` when a table, list, or card group must show visible
 items in a specific order after setup actions such as sorting or filtering:
 
@@ -217,6 +236,29 @@ The check records the visible text sequence for the selector and passes when
 the expected texts appear in that order as a subsequence. This is less brittle
 than matching one large body-text regex when only row or card order matters.
 
+Use `frame_text_visible` and `frame_no_horizontal_overflow` for embedded app,
+game, or preview surfaces that render inside iframes:
+
+```json
+[
+  {
+    "type": "frame_text_visible",
+    "selector": ".game-player-root iframe",
+    "text": "Start Game"
+  },
+  {
+    "type": "frame_no_horizontal_overflow",
+    "selector": ".game-player-root iframe",
+    "max_overflow_px": 1
+  }
+]
+```
+
+Frame checks capture each matching iframe's URL, title, compact text sample,
+scroll width, client width, measured horizontal overflow, and top visible
+overflow offenders. This keeps embedded-player audits in profile mode instead
+of requiring bespoke iframe inspection scripts.
+
 Use the `route_inventory` check for source-page route coverage audits where a
 navigation surface must expose a known set of routes and each route must load
 both directly and through real link clicks:

package/dist/{chunk-KZRDAMI5.js → chunk-L4FLSU7L.js}

@@ -15,6 +15,8 @@ var RIDDLE_PROOF_PROFILE_CHECK_TYPES = [
   "selector_visible",
   "selector_count_at_least",
   "selector_text_order",
+  "frame_text_visible",
+  "frame_no_horizontal_overflow",
   "text_visible",
   "text_absent",
   "route_inventory",
@@ -303,6 +305,13 @@ function normalizeExpectedTexts(value, index) {
   if (!texts.length) throw new Error(`checks[${index}] selector_text_order expected_texts must contain non-empty strings.`);
   return texts;
 }
+function normalizeStringList(value, label) {
+  if (value === void 0) return void 0;
+  if (!Array.isArray(value)) throw new Error(`${label} must be an array.`);
+  const values = value.map((item) => String(item).replace(/\s+/g, " ").trim()).filter(Boolean);
+  if (!values.length) throw new Error(`${label} must contain non-empty strings.`);
+  return values;
+}
 function normalizeCheck(input, index) {
   if (!isRecord(input)) throw new Error(`checks[${index}] must be an object.`);
   const type = stringValue(input.type);
@@ -313,6 +322,12 @@ function normalizeCheck(input, index) {
   if ((type === "selector_visible" || type === "selector_count_at_least") && !stringValue(input.selector)) {
     throw new Error(`checks[${index}] ${type} requires selector.`);
   }
+  if ((type === "frame_text_visible" || type === "frame_no_horizontal_overflow") && !stringValue(input.selector)) {
+    throw new Error(`checks[${index}] ${type} requires selector.`);
+  }
+  if (type === "frame_text_visible" && !stringValue(input.text) && !stringValue(input.pattern)) {
+    throw new Error(`checks[${index}] frame_text_visible requires text or pattern.`);
+  }
   if ((type === "text_visible" || type === "text_absent") && !stringValue(input.text) && !stringValue(input.pattern)) {
     throw new Error(`checks[${index}] ${type} requires text or pattern.`);
   }
@@ -345,6 +360,10 @@ function normalizeCheck(input, index) {
     text: stringValue(input.text),
     pattern: stringValue(input.pattern),
     flags: stringValue(input.flags),
+    allowed_console_texts: normalizeStringList(input.allowed_console_texts ?? input.allowedConsoleTexts ?? input.allow_console_texts ?? input.allowConsoleTexts, `checks[${index}] allowed_console_texts`),
+    allowed_console_patterns: normalizeStringList(input.allowed_console_patterns ?? input.allowedConsolePatterns ?? input.allow_console_patterns ?? input.allowConsolePatterns, `checks[${index}] allowed_console_patterns`),
+    allowed_page_error_texts: normalizeStringList(input.allowed_page_error_texts ?? input.allowedPageErrorTexts ?? input.allow_page_error_texts ?? input.allowPageErrorTexts, `checks[${index}] allowed_page_error_texts`),
+    allowed_page_error_patterns: normalizeStringList(input.allowed_page_error_patterns ?? input.allowedPageErrorPatterns ?? input.allow_page_error_patterns ?? input.allowPageErrorPatterns, `checks[${index}] allowed_page_error_patterns`),
     min_count: numberValue(input.min_count),
     max_overflow_px: numberValue(input.max_overflow_px),
     timeout_ms: numberValue(input.timeout_ms) ?? numberValue(input.timeoutMs),
@@ -463,6 +482,22 @@ function textOrderMatch(texts, expectedTexts) {
   }
   return { matched: true, positions };
 }
+function frameEvidenceForSelector(viewport, selector) {
+  const container = viewport.frames?.[selector];
+  if (!isRecord(container)) return [];
+  const frames = Array.isArray(container.frames) ? container.frames : [];
+  return frames.filter((frame) => isRecord(frame));
+}
+function frameTextSample(frame) {
+  const parts = [
+    frame.title,
+    frame.text_sample,
+    frame.body_text_sample,
+    frame.body_text,
+    frame.text
+  ];
+  return parts.map((part) => String(part || "")).filter(Boolean).join(" ");
+}
 function summarizeRouteInventory(viewport, inventory) {
   const directRoutes = Array.isArray(inventory.direct_routes) ? inventory.direct_routes : [];
   const clickthroughs = Array.isArray(inventory.clickthroughs) ? inventory.clickthroughs : [];
@@ -492,6 +527,18 @@ function matchText(sample, check) {
   }
   return sample.includes(check.text || "");
 }
+function matchesAllowedMessage(message, texts, patterns) {
+  const sample = String(message || "");
+  if (texts?.some((text) => sample.includes(text))) return true;
+  for (const pattern of patterns || []) {
+    try {
+      if (new RegExp(pattern).test(sample)) return true;
+    } catch {
+      continue;
+    }
+  }
+  return false;
+}
 function normalizeRoutePath(path) {
   const value = path || "/";
   if (value === "/") return "/";
@@ -627,6 +674,67 @@ function assessCheckFromEvidence(check, evidence) {
       message: failed ? `Selector ${key} text order failed in ${failed} viewport(s).` : void 0
     };
   }
+  if (check.type === "frame_text_visible") {
+    const key = selectorKey(check);
+    const results = viewports.map((viewport) => {
+      const frames = frameEvidenceForSelector(viewport, key);
+      const matches = frames.map((frame, index) => ({ index, frame, matched: matchText(frameTextSample(frame), check) })).filter((item) => item.matched);
+      return {
+        viewport: viewport.name,
+        frame_count: frames.length,
+        matched_count: matches.length,
+        matched: matches.length > 0,
+        urls: frames.map((frame) => String(frame.url || "")).filter(Boolean).slice(0, 10),
+        samples: matches.map((item) => frameTextSample(item.frame).replace(/\s+/g, " ").trim().slice(0, 240)).slice(0, 3)
+      };
+    });
+    const failed = results.filter((result) => !result.matched).length;
+    return {
+      type: check.type,
+      label: checkLabel(check),
+      status: failed ? "failed" : "passed",
+      evidence: {
+        selector: key,
+        text: check.text || null,
+        pattern: check.pattern || null,
+        viewports: results.map((result) => toJsonValue(result))
+      },
+      message: failed ? `Frame selector ${key} did not contain expected text in ${failed} viewport(s).` : void 0
+    };
+  }
+  if (check.type === "frame_no_horizontal_overflow") {
+    const key = selectorKey(check);
+    const maxOverflow = check.max_overflow_px ?? 4;
+    const results = viewports.map((viewport) => {
+      const frames = frameEvidenceForSelector(viewport, key);
+      const frameOverflows = frames.map((frame, index) => ({
+        index,
+        url: String(frame.url || ""),
+        overflow_px: horizontalBoundsOverflowPx(frame),
+        offender_count: boundsOffendersForEvidence(frame).length
+      }));
+      const maxFrameOverflow = frameOverflows.reduce((max, frame) => Math.max(max, frame.overflow_px), 0);
+      return {
+        viewport: viewport.name,
+        frame_count: frames.length,
+        max_overflow_px: roundPixels(maxFrameOverflow),
+        failed_frame_count: frameOverflows.filter((frame) => frame.overflow_px > maxOverflow).length,
+        frames: frameOverflows.map((frame) => toJsonValue(frame))
+      };
+    });
+    const failed = results.filter((result) => result.frame_count < 1 || result.failed_frame_count > 0).length;
+    return {
+      type: check.type,
+      label: checkLabel(check),
+      status: failed ? "failed" : "passed",
+      evidence: {
+        selector: key,
+        max_overflow_px: maxOverflow,
+        viewports: results.map((result) => toJsonValue(result))
+      },
+      message: failed ? `Frame selector ${key} overflow exceeded ${maxOverflow}px or was missing in ${failed} viewport(s).` : void 0
+    };
+  }
   if (check.type === "text_visible" || check.type === "text_absent") {
     const key = textKey(check);
     const expectedVisible = check.type === "text_visible";
@@ -717,14 +825,28 @@ function assessCheckFromEvidence(check, evidence) {
     };
   }
   if (check.type === "no_fatal_console_errors") {
-    const fatalCount = (evidence.console?.fatal_count || 0) + (evidence.page_errors?.length || 0);
+    const fatalConsoleEvents = (evidence.console?.events || []).filter((event) => event.type === "error" || event.type === "assert");
+    const allowedConsoleEvents = fatalConsoleEvents.filter((event) => matchesAllowedMessage(event.text, check.allowed_console_texts, check.allowed_console_patterns));
+    const unallowedConsoleEvents = fatalConsoleEvents.filter((event) => !matchesAllowedMessage(event.text, check.allowed_console_texts, check.allowed_console_patterns));
+    const pageErrors = evidence.page_errors || [];
+    const allowedPageErrors = pageErrors.filter((error) => matchesAllowedMessage(error.message, check.allowed_page_error_texts, check.allowed_page_error_patterns));
+    const unallowedPageErrors = pageErrors.filter((error) => !matchesAllowedMessage(error.message, check.allowed_page_error_texts, check.allowed_page_error_patterns));
+    const fatalCount = unallowedConsoleEvents.length + unallowedPageErrors.length;
     return {
       type: check.type,
       label: checkLabel(check),
       status: fatalCount ? "failed" : "passed",
       evidence: {
-        console_fatal_count: evidence.console?.fatal_count || 0,
-        page_error_count: evidence.page_errors?.length || 0
+        console_fatal_count: unallowedConsoleEvents.length,
+        page_error_count: unallowedPageErrors.length,
+        total_console_fatal_count: fatalConsoleEvents.length,
+        total_page_error_count: pageErrors.length,
+        allowed_console_fatal_count: allowedConsoleEvents.length,
+        allowed_page_error_count: allowedPageErrors.length,
+        allowed_console_texts: check.allowed_console_texts || [],
+        allowed_console_patterns: check.allowed_console_patterns || [],
+        allowed_page_error_texts: check.allowed_page_error_texts || [],
+        allowed_page_error_patterns: check.allowed_page_error_patterns || []
       },
       message: fatalCount ? `${fatalCount} fatal browser error(s) were captured.` : void 0
     };
@@ -980,6 +1102,16 @@ function textMatches(sample, check) {
   }
   return String(sample || "").includes(check.text || "");
 }
+function matchesAllowedMessage(message, texts, patterns) {
+  const sample = String(message || "");
+  if ((texts || []).some((text) => sample.includes(text))) return true;
+  for (const pattern of patterns || []) {
+    try {
+      if (new RegExp(pattern).test(sample)) return true;
+    } catch {}
+  }
+  return false;
+}
 function textSequenceForCheck(viewport, check) {
   const key = check.selector || "";
   const sequence = viewport.text_sequences && viewport.text_sequences[key];
@@ -1002,6 +1134,21 @@ function textOrderMatch(texts, expectedTexts) {
   }
   return { matched: true, positions };
 }
+function frameEvidenceForSelector(viewport, selector) {
+  const container = viewport.frames && viewport.frames[selector || ""];
+  if (!container || typeof container !== "object" || Array.isArray(container)) return [];
+  const frames = Array.isArray(container.frames) ? container.frames : [];
+  return frames.filter((frame) => frame && typeof frame === "object" && !Array.isArray(frame));
+}
+function frameTextSample(frame) {
+  return [
+    frame && frame.title,
+    frame && frame.text_sample,
+    frame && frame.body_text_sample,
+    frame && frame.body_text,
+    frame && frame.text,
+  ].map((part) => String(part || "")).filter(Boolean).join(" ");
+}
 function summarizeRouteInventory(viewport, inventory) {
   const directRoutes = Array.isArray(inventory.direct_routes) ? inventory.direct_routes : [];
   const clickthroughs = Array.isArray(inventory.clickthroughs) ? inventory.clickthroughs : [];
@@ -1248,6 +1395,62 @@ function assessProfile(profile, evidence) {
       });
       continue;
     }
+    if (check.type === "frame_text_visible") {
+      const selector = check.selector || "";
+      const results = viewports.map((viewport) => {
+        const frames = frameEvidenceForSelector(viewport, selector);
+        const matches = frames
+          .map((frame, index) => ({ index, frame, matched: textMatches(frameTextSample(frame), check) }))
+          .filter((item) => item.matched);
+        return {
+          viewport: viewport.name,
+          frame_count: frames.length,
+          matched_count: matches.length,
+          matched: matches.length > 0,
+          urls: frames.map((frame) => String(frame.url || "")).filter(Boolean).slice(0, 10),
+          samples: matches.map((item) => frameTextSample(item.frame).replace(/\s+/g, " ").trim().slice(0, 240)).slice(0, 3),
+        };
+      });
+      const failed = results.filter((result) => !result.matched).length;
+      checks.push({
+        type: check.type,
+        label: check.label || check.type,
+        status: failed ? "failed" : "passed",
+        evidence: { selector, text: check.text || null, pattern: check.pattern || null, viewports: results },
+        message: failed ? "Frame selector " + selector + " did not contain expected text in " + failed + " viewport(s)." : undefined,
+      });
+      continue;
+    }
+    if (check.type === "frame_no_horizontal_overflow") {
+      const selector = check.selector || "";
+      const maxOverflow = check.max_overflow_px == null ? 4 : check.max_overflow_px;
+      const results = viewports.map((viewport) => {
+        const frames = frameEvidenceForSelector(viewport, selector);
+        const frameOverflows = frames.map((frame, index) => ({
+          index,
+          url: String(frame.url || ""),
+          overflow_px: horizontalBoundsOverflowPx(frame),
+          offender_count: boundsOffendersForEvidence(frame).length,
+        }));
+        const maxFrameOverflow = frameOverflows.reduce((max, frame) => Math.max(max, frame.overflow_px), 0);
+        return {
+          viewport: viewport.name,
+          frame_count: frames.length,
+          max_overflow_px: roundPixels(maxFrameOverflow),
+          failed_frame_count: frameOverflows.filter((frame) => frame.overflow_px > maxOverflow).length,
+          frames: frameOverflows,
+        };
+      });
+      const failed = results.filter((result) => result.frame_count < 1 || result.failed_frame_count > 0).length;
+      checks.push({
+        type: check.type,
+        label: check.label || check.type,
+        status: failed ? "failed" : "passed",
+        evidence: { selector, max_overflow_px: maxOverflow, viewports: results },
+        message: failed ? "Frame selector " + selector + " overflow exceeded " + maxOverflow + "px or was missing in " + failed + " viewport(s)." : undefined,
+      });
+      continue;
+    }
     if (check.type === "text_visible" || check.type === "text_absent") {
       const key = check.pattern ? "pattern:" + check.pattern + "/" + (check.flags || "") : "text:" + (check.text || "");
       const expectedVisible = check.type === "text_visible";
@@ -1343,12 +1546,29 @@ function assessProfile(profile, evidence) {
       continue;
     }
     if (check.type === "no_fatal_console_errors") {
-      const fatalCount = ((evidence.console && evidence.console.fatal_count) || 0) + ((evidence.page_errors || []).length);
+      const fatalConsoleEvents = ((evidence.console && evidence.console.events) || []).filter((event) => event && (event.type === "error" || event.type === "assert"));
+      const allowedConsoleEvents = fatalConsoleEvents.filter((event) => matchesAllowedMessage(event.text, check.allowed_console_texts, check.allowed_console_patterns));
+      const unallowedConsoleEvents = fatalConsoleEvents.filter((event) => !matchesAllowedMessage(event.text, check.allowed_console_texts, check.allowed_console_patterns));
+      const pageErrors = evidence.page_errors || [];
+      const allowedPageErrors = pageErrors.filter((error) => matchesAllowedMessage(error && error.message, check.allowed_page_error_texts, check.allowed_page_error_patterns));
+      const unallowedPageErrors = pageErrors.filter((error) => !matchesAllowedMessage(error && error.message, check.allowed_page_error_texts, check.allowed_page_error_patterns));
+      const fatalCount = unallowedConsoleEvents.length + unallowedPageErrors.length;
       checks.push({
         type: check.type,
         label: check.label || check.type,
         status: fatalCount ? "failed" : "passed",
-        evidence: { console_fatal_count: (evidence.console && evidence.console.fatal_count) || 0, page_error_count: (evidence.page_errors || []).length },
+        evidence: {
+          console_fatal_count: unallowedConsoleEvents.length,
+          page_error_count: unallowedPageErrors.length,
+          total_console_fatal_count: fatalConsoleEvents.length,
+          total_page_error_count: pageErrors.length,
+          allowed_console_fatal_count: allowedConsoleEvents.length,
+          allowed_page_error_count: allowedPageErrors.length,
+          allowed_console_texts: check.allowed_console_texts || [],
+          allowed_console_patterns: check.allowed_console_patterns || [],
+          allowed_page_error_texts: check.allowed_page_error_texts || [],
+          allowed_page_error_patterns: check.allowed_page_error_patterns || [],
+        },
         message: fatalCount ? String(fatalCount) + " fatal browser error(s) were captured." : undefined,
       });
       continue;
@@ -1645,6 +1865,108 @@ async function selectorTextSequence(selector) {
     };
   }).catch((error) => ({ count: 0, visible_count: 0, texts: [], visible_texts: [], error: String(error && error.message ? error.message : error).slice(0, 500) }));
 }
+async function frameEvidence(selector) {
+  const result = { selector, count: 0, frame_count: 0, frames: [], errors: [] };
+  let handles = [];
+  try {
+    const locator = page.locator(selector);
+    result.count = await locator.count();
+    handles = await locator.elementHandles();
+  } catch (error) {
+    result.errors.push(String(error && error.message ? error.message : error).slice(0, 500));
+    return result;
+  }
+  for (let index = 0; index < handles.length; index += 1) {
+    const handle = handles[index];
+    try {
+      const frame = typeof handle.contentFrame === "function" ? await handle.contentFrame() : null;
+      if (!frame) {
+        result.frames.push({ index, attached: false, error: "content_frame_unavailable" });
+        continue;
+      }
+      const snapshot = await frame.evaluate(() => {
+        const body = document.body;
+        const documentElement = document.documentElement;
+        const text = (body ? body.innerText : "").replace(/\s+/g, " ").trim();
+        const clientWidth = documentElement ? documentElement.clientWidth : window.innerWidth;
+        const clientHeight = documentElement ? documentElement.clientHeight : window.innerHeight;
+        const scrollWidth = documentElement ? documentElement.scrollWidth : 0;
+        const viewportWidth = clientWidth || window.innerWidth;
+        const overflowOffenders = [];
+        function isContainedByHorizontalScroller(element) {
+          let current = element.parentElement;
+          while (current && current !== body && current !== documentElement) {
+            const style = window.getComputedStyle(current);
+            const overflowX = style.overflowX || style.overflow || "";
+            if ((overflowX === "auto" || overflowX === "scroll") && current.scrollWidth > current.clientWidth + 1) {
+              const currentRect = current.getBoundingClientRect();
+              const contained = currentRect.left >= -0.5 && currentRect.right <= viewportWidth + 0.5;
+              if (contained) return true;
+            }
+            current = current.parentElement;
+          }
+          return false;
+        }
+        for (const element of Array.from(body ? body.querySelectorAll("*") : [])) {
+          const rect = element.getBoundingClientRect();
+          if (!rect || rect.width < 1 || rect.height < 1) continue;
+          const style = window.getComputedStyle(element);
+          if (style.display === "none" || style.visibility === "hidden" || style.opacity === "0") continue;
+          const leftOverflow = Math.max(0, -rect.left);
+          const rightOverflow = Math.max(0, rect.right - viewportWidth);
+          const overflow = Math.max(leftOverflow, rightOverflow);
+          if (overflow <= 0.5) continue;
+          if (isContainedByHorizontalScroller(element)) continue;
+          const tag = element.tagName ? element.tagName.toLowerCase() : "element";
+          const id = element.id ? "#" + element.id : "";
+          const className = typeof element.className === "string"
+            ? element.className.trim().split(/\s+/).filter(Boolean).slice(0, 2).join(".")
+            : "";
+          overflowOffenders.push({
+            selector: tag + id + (className ? "." + className : ""),
+            tag,
+            text: (element.textContent || "").replace(/\s+/g, " ").trim().slice(0, 120),
+            overflow,
+            left_overflow_px: leftOverflow,
+            right_overflow_px: rightOverflow,
+            viewport_width: viewportWidth,
+            rect: {
+              left: rect.left,
+              right: rect.right,
+              width: rect.width,
+            },
+          });
+        }
+        overflowOffenders.sort((a, b) => b.overflow - a.overflow);
+        const boundsOverflowPx = Math.max(
+          0,
+          scrollWidth - (clientWidth || viewportWidth),
+          ...overflowOffenders.map((offender) => offender.overflow),
+        );
+        return {
+          url: location.href,
+          title: document.title,
+          text_length: text.length,
+          text_sample: text.slice(0, 8000),
+          body_text_sample: text.slice(0, 8000),
+          viewport_width: viewportWidth,
+          viewport_height: clientHeight || window.innerHeight,
+          scroll_width: scrollWidth,
+          client_width: clientWidth,
+          overflow_px: Math.max(0, scrollWidth - (clientWidth || viewportWidth)),
+          bounds_overflow_px: Math.round(boundsOverflowPx * 100) / 100,
+          overflow_offender_count: overflowOffenders.length,
+          overflow_offenders: overflowOffenders.slice(0, 10),
+        };
+      });
+      result.frames.push({ index, attached: true, ...snapshot });
+    } catch (error) {
+      result.frames.push({ index, attached: false, error: String(error && error.message ? error.message : error).slice(0, 1000) });
+    }
+  }
+  result.frame_count = result.frames.filter((frame) => frame && frame.attached !== false && !frame.error).length;
+  return result;
+}
 function inventoryAppPathFromUrl(urlLike) {
   const url = new URL(String(urlLike), targetUrl);
   const mountPrefix = previewMountPrefix(new URL(targetUrl).pathname);
@@ -2049,6 +2371,7 @@ async function captureViewport(viewport) {
     evaluation_error: String(error && error.message ? error.message : error).slice(0, 1000),
   }));
   const selectors = {};
+  const frames = {};
   const text_sequences = {};
   const text_matches = {};
   for (const check of profile.checks || []) {
@@ -2062,6 +2385,10 @@ async function captureViewport(viewport) {
     if ((check.type === "text_visible" || check.type === "text_absent") && (check.text || check.pattern)) {
       text_matches[textKey(check)] = textMatches(dom.body_text || dom.body_text_sample || "", check);
     }
+    if ((check.type === "frame_text_visible" || check.type === "frame_no_horizontal_overflow") && check.selector) {
+      selectors[check.selector] = selectors[check.selector] || await selectorStats(check.selector);
+      frames[check.selector] = frames[check.selector] || await frameEvidence(check.selector);
+    }
   }
   const screenshotLabel = profileSlug + "-" + viewport.name;
   try {
@@ -2122,6 +2449,7 @@ async function captureViewport(viewport) {
     bounds_overflow_px: dom.bounds_overflow_px,
     overflow_offenders: dom.overflow_offenders || [],
     selectors,
+    frames,
     text_sequences,
     text_matches,
     route_inventory: routeInventory,
@@ -2157,6 +2485,20 @@ function buildProfileEvidence(currentViewports) {
       overflow_px: currentViewports.map((viewport) => viewport.overflow_px),
       bounds_overflow_px: currentViewports.map((viewport) => viewport.bounds_overflow_px),
       overflow_offender_counts: currentViewports.map((viewport) => (viewport.overflow_offenders || []).length),
+      frames: currentViewports
+        .filter((viewport) => viewport.frames)
+        .map((viewport) => ({
+          viewport: viewport.name,
+          selectors: Object.entries(viewport.frames || {}).map(([selector, frameSet]) => ({
+            selector,
+            count: frameSet && frameSet.count,
+            frame_count: frameSet && frameSet.frame_count,
+            max_bounds_overflow_px: Math.max(
+              0,
+              ...((frameSet && Array.isArray(frameSet.frames) ? frameSet.frames : [])).map((frame) => horizontalBoundsOverflowPx(frame)),
+            ),
+          })),
+        })),
       route_inventory: currentViewports
         .filter((viewport) => viewport.route_inventory)
         .map((viewport) => ({