@detiq/crawler 1.1.8 → 1.1.9

package/dist/interactive-probe.js

@@ -1,774 +1,886 @@
-import { AppBrain } from "@detiq/app-brain";
+/**
+ * Interactive Probe — Phase 2 Dynamic Observation
+ *
+ * The static crawl captures DOM structure at rest. This module runs AFTER the static crawl
+ * to observe dynamic behaviour by actually interacting with the UI:
+ *
+ *   1. Empty submit  → captures required-field validation error messages
+ *   2. Invalid format → captures format validation errors (bad email, short password)
+ *   3. Button clicks → captures modal/dialog contents
+ *   4. Select changes → captures conditional reveals (show/hide logic)
+ *   5. Success paths → captures toast/banner messages (where input is safe)
+ *
+ * Results are stored as KnowledgeChunks (sourceType='probe') and update the
+ * ERROR_CATALOGUE + INTERACTION_PATTERNS skill files with real observed data
+ * instead of LLM inference.
+ *
+ * Call signature: probeScreen(page, screenId, elements, opts)
+ * Called from crawlProject() after static element extraction when opts.interactive=true.
+ */
+import { AppBrain } from '@detiq/app-brain';
+// ── CSS selectors that reliably find error messages across frameworks ────────
 const ERROR_SELECTORS = [
-  '[role="alert"]',
-  '[aria-live="assertive"]',
-  '[aria-live="polite"]',
-  ".invalid-feedback",
-  ".field-error",
-  ".error-message",
-  ".form-error",
-  ".validation-error",
-  '[class*="error" i]',
-  '[class*="invalid" i]',
-  '[class*="Error"]',
-  "p.text-red-500",
-  "p.text-red-600",
-  "p.text-destructive",
-  "p.text-danger",
-  "[data-error]",
-  "[data-invalid]",
-  ".ant-form-item-explain-error",
-  // Ant Design
-  ".el-form-item__error",
-  // Element UI
-  ".chakra-form__error-message",
-  // Chakra UI
-  ".mantine-InputWrapper-error"
-  // Mantine
-].join(", ");
+    '[role="alert"]',
+    '[aria-live="assertive"]',
+    '[aria-live="polite"]',
+    '.invalid-feedback',
+    '.field-error',
+    '.error-message',
+    '.form-error',
+    '.validation-error',
+    '[class*="error" i]',
+    '[class*="invalid" i]',
+    '[class*="Error"]',
+    'p.text-red-500', 'p.text-red-600', 'p.text-destructive', 'p.text-danger',
+    '[data-error]', '[data-invalid]',
+    '.ant-form-item-explain-error', // Ant Design
+    '.el-form-item__error', // Element UI
+    '.chakra-form__error-message', // Chakra UI
+    '.mantine-InputWrapper-error', // Mantine
+].join(', ');
+// ── Toast / notification selectors ───────────────────────────────────────────
 const TOAST_SELECTORS = [
-  '[role="status"]',
-  "[data-sonner-toast]",
-  "[data-toast]",
-  "[data-hot-toast]",
-  ".Toastify__toast",
-  ".toast-message",
-  ".notification-body",
-  ".notistack-snackbar",
-  '[class*="toast" i]',
-  '[class*="Toast"]',
-  '[class*="snackbar" i]',
-  '[class*="notification" i]'
-].join(", ");
+    '[role="status"]',
+    '[data-sonner-toast]',
+    '[data-toast]',
+    '[data-hot-toast]',
+    '.Toastify__toast',
+    '.toast-message',
+    '.notification-body',
+    '.notistack-snackbar',
+    '[class*="toast" i]',
+    '[class*="Toast"]',
+    '[class*="snackbar" i]',
+    '[class*="notification" i]',
+].join(', ');
+/** Wait up to `maxMs` for any selector to appear, then return its text content. */
 async function waitForAny(page, selector, maxMs = 2500) {
-  try {
-    await page.waitForSelector(selector, { timeout: maxMs, state: "visible" });
-  } catch {
-    return [];
-  }
-  return page.$$eval(
-    selector,
-    (els) => els.map((el) => el.innerText?.replace(/\s+/g, " ").trim()).filter(Boolean)
-  );
+    try {
+        await page.waitForSelector(selector, { timeout: maxMs, state: 'visible' });
+    }
+    catch {
+        return [];
+    }
+    return page.$$eval(selector, (els) => els.map((el) => el.innerText?.replace(/\s+/g, ' ').trim()).filter(Boolean));
 }
+/** Collect all currently-visible error messages. */
 async function collectErrors(page) {
-  try {
-    return page.$$eval(
-      ERROR_SELECTORS,
-      (els) => els.filter((el) => {
-        const style = window.getComputedStyle(el);
-        return style.display !== "none" && style.visibility !== "hidden" && el.innerText?.trim().length > 0;
-      }).map((el) => el.innerText?.replace(/\s+/g, " ").trim()).filter(Boolean)
-    );
-  } catch {
-    return [];
-  }
+    try {
+        return page.$$eval(ERROR_SELECTORS, (els) => els
+            .filter((el) => {
+            const style = window.getComputedStyle(el);
+            return style.display !== 'none' && style.visibility !== 'hidden' && el.innerText?.trim().length > 0;
+        })
+            .map((el) => el.innerText?.replace(/\s+/g, ' ').trim())
+            .filter(Boolean));
+    }
+    catch {
+        return [];
+    }
 }
+/** Collect any visible toast / notification content. */
 async function collectToasts(page) {
-  try {
-    return page.$$eval(
-      TOAST_SELECTORS,
-      (els) => els.filter((el) => {
-        const style = window.getComputedStyle(el);
-        return style.display !== "none" && el.innerText?.trim().length > 0;
-      }).map((el) => el.innerText?.replace(/\s+/g, " ").trim()).filter(Boolean)
-    );
-  } catch {
-    return [];
-  }
+    try {
+        return page.$$eval(TOAST_SELECTORS, (els) => els
+            .filter((el) => {
+            const style = window.getComputedStyle(el);
+            return style.display !== 'none' && el.innerText?.trim().length > 0;
+        })
+            .map((el) => el.innerText?.replace(/\s+/g, ' ').trim())
+            .filter(Boolean));
+    }
+    catch {
+        return [];
+    }
 }
+/** Find the primary submit button on the page. */
 async function findSubmitButton(page) {
-  return page.evaluate(() => {
-    const SUBMIT_KW = /submit|send|save|create|confirm|continue|proceed|register|sign.?in|log.?in|apply|verify|search|next|finish|complete|order|buy|checkout/i;
-    const candidates = Array.from(document.querySelectorAll('button, [role="button"], input[type="submit"]'));
-    const primary = candidates.find((el) => {
-      const style = window.getComputedStyle(el);
-      if (style.display === "none" || style.visibility === "hidden") return false;
-      const text = el.innerText || el.value || el.getAttribute("aria-label") || "";
-      return SUBMIT_KW.test(text);
+    return page.evaluate(() => {
+        const SUBMIT_KW = /submit|send|save|create|confirm|continue|proceed|register|sign.?in|log.?in|apply|verify|search|next|finish|complete|order|buy|checkout/i;
+        const candidates = Array.from(document.querySelectorAll('button, [role="button"], input[type="submit"]'));
+        const primary = candidates.find((el) => {
+            const style = window.getComputedStyle(el);
+            if (style.display === 'none' || style.visibility === 'hidden')
+                return false;
+            const text = el.innerText || el.value || el.getAttribute('aria-label') || '';
+            return SUBMIT_KW.test(text);
+        });
+        if (!primary)
+            return null;
+        return primary.getAttribute('data-testid') || primary.getAttribute('aria-label') || primary.innerText?.trim().slice(0, 60);
     });
-    if (!primary) return null;
-    return primary.getAttribute("data-testid") || primary.getAttribute("aria-label") || primary.innerText?.trim().slice(0, 60);
-  });
 }
+/** Find all modal-trigger buttons (non-submit buttons). */
 async function findModalTriggers(page) {
-  return page.evaluate(() => {
-    const SKIP = /submit|send|save|create|log.?in|sign.?in|register|continue|checkout|buy|order|search|close|cancel|dismiss/i;
-    const NAV_PARENTS = /* @__PURE__ */ new Set(["NAV", "HEADER", "FOOTER"]);
-    return Array.from(document.querySelectorAll('button, [role="button"]')).filter((el) => {
-      const style = window.getComputedStyle(el);
-      if (style.display === "none" || style.visibility === "hidden") return false;
-      const label = el.innerText?.trim() || el.getAttribute("aria-label") || "";
-      if (!label || SKIP.test(label)) return false;
-      let p = el.parentElement;
-      while (p) {
-        if (NAV_PARENTS.has(p.tagName)) return false;
-        p = p.parentElement;
-      }
-      return true;
-    }).slice(0, 20).map((el) => {
-      const label = el.innerText?.trim() || el.getAttribute("aria-label") || "button";
-      return { selector: `[aria-label="${label}"]`, label: label.slice(0, 60) };
+    return page.evaluate(() => {
+        const SKIP = /submit|send|save|create|log.?in|sign.?in|register|continue|checkout|buy|order|search|close|cancel|dismiss/i;
+        const NAV_PARENTS = new Set(['NAV', 'HEADER', 'FOOTER']);
+        return Array.from(document.querySelectorAll('button, [role="button"]'))
+            .filter((el) => {
+            const style = window.getComputedStyle(el);
+            if (style.display === 'none' || style.visibility === 'hidden')
+                return false;
+            const label = el.innerText?.trim() || el.getAttribute('aria-label') || '';
+            if (!label || SKIP.test(label))
+                return false;
+            // Skip nav chrome
+            let p = el.parentElement;
+            while (p) {
+                if (NAV_PARENTS.has(p.tagName))
+                    return false;
+                p = p.parentElement;
+            }
+            return true;
+        })
+            .slice(0, 20) // probe at most 20 buttons per screen
+            .map((el) => {
+            const label = el.innerText?.trim() || el.getAttribute('aria-label') || 'button';
+            return { selector: `[aria-label="${label}"]`, label: label.slice(0, 60) };
+        });
     });
-  });
 }
+/** Try to interact with select elements and observe conditional reveals. */
 async function probeConditionals(page) {
-  const results = [];
-  try {
-    const selects = await page.$$("select");
-    for (const sel of selects.slice(0, 5)) {
-      const label = await sel.getAttribute("aria-label") || await sel.getAttribute("name") || "select";
-      const options = await sel.$$eval("option", (opts) => opts.slice(1, 3).map((o) => ({ value: o.value, text: o.textContent?.trim() })));
-      for (const opt of options) {
-        if (!opt.value) continue;
-        const domBefore = await page.evaluate(() => document.body.innerText.length);
-        await sel.selectOption(opt.value);
-        await page.waitForTimeout(500);
-        const domAfter = await page.evaluate(() => document.body.innerText.length);
-        if (Math.abs(domAfter - domBefore) > 50) {
-          const revealed = await page.evaluate(() => {
-            return Array.from(document.querySelectorAll('[data-conditional],[data-show],[class*="conditional"]')).filter((el) => window.getComputedStyle(el).display !== "none").map((el) => el.innerText?.trim()).filter((t) => t && t.length > 10).slice(0, 3).join(" | ");
-          });
-          if (revealed) {
-            results.push({ triggerElement: label, triggerValue: opt.text || opt.value, revealedText: revealed.slice(0, 200) });
-          }
-        }
-      }
-    }
-  } catch {
-  }
-  return results;
-}
-async function probeScreen(page, screenId, url, elements) {
-  const result = {
-    screenId,
-    url,
-    validationErrors: [],
-    successMessages: [],
-    modals: [],
-    conditionals: [],
-    loadingPatterns: []
-  };
-  const formInputs = elements.filter(
-    (e) => /input|text|email|password|tel|search|textarea|select/i.test(e.role)
-  );
-  const hasForm = formInputs.length > 0;
-  if (hasForm) {
+    const results = [];
     try {
-      const submitLabel = await findSubmitButton(page);
-      if (submitLabel) {
-        const submitBtn = page.locator(`button:has-text("${submitLabel}")`).first();
-        await submitBtn.click({ timeout: 2e3 });
-        await page.waitForTimeout(1500);
-        const errors = await collectErrors(page);
-        const ariaFieldErrors = await page.evaluate(
-          () => Array.from(document.querySelectorAll('[aria-invalid="true"]')).map((el) => {
-            const describedBy = el.getAttribute("aria-describedby");
-            const errorEl = describedBy ? document.getElementById(describedBy) : null;
-            const label = el.getAttribute("aria-label") || el.getAttribute("placeholder") || el.name || "";
-            return { label, errorText: errorEl?.textContent?.trim() || "" };
-          }).filter((f) => f.errorText)
-        );
-        const ariaMatched = /* @__PURE__ */ new Set();
-        for (const af of ariaFieldErrors) {
-          ariaMatched.add(af.errorText);
-          result.validationErrors.push({ field: af.label || "unknown", trigger: "empty_submit", errorText: af.errorText.slice(0, 150) });
-        }
-        for (const errorText of errors.filter((e) => !ariaMatched.has(e))) {
-          const matchedField = formInputs.find(
-            (el) => errorText.toLowerCase().includes(el.meaning.toLowerCase().split(" ")[0]) || el.meaning.toLowerCase().includes(errorText.toLowerCase().split(" ")[0])
-          );
-          result.validationErrors.push({
-            field: matchedField?.meaning ?? "unknown",
-            trigger: "empty_submit",
-            errorText: errorText.slice(0, 150)
-          });
+        const selects = await page.$$('select');
+        for (const sel of selects.slice(0, 5)) {
+            const label = await sel.getAttribute('aria-label') || await sel.getAttribute('name') || 'select';
+            const options = await sel.$$eval('option', (opts) => opts.slice(1, 3).map((o) => ({ value: o.value, text: o.textContent?.trim() })));
+            for (const opt of options) {
+                if (!opt.value)
+                    continue;
+                const domBefore = await page.evaluate(() => document.body.innerText.length);
+                await sel.selectOption(opt.value);
+                await page.waitForTimeout(500);
+                const domAfter = await page.evaluate(() => document.body.innerText.length);
+                if (Math.abs(domAfter - domBefore) > 50) {
+                    const revealed = await page.evaluate(() => {
+                        // Grab text from any newly-visible sections
+                        return Array.from(document.querySelectorAll('[data-conditional],[data-show],[class*="conditional"]'))
+                            .filter((el) => window.getComputedStyle(el).display !== 'none')
+                            .map((el) => el.innerText?.trim())
+                            .filter((t) => t && t.length > 10)
+                            .slice(0, 3)
+                            .join(' | ');
+                    });
+                    if (revealed) {
+                        results.push({ triggerElement: label, triggerValue: opt.text || opt.value, revealedText: revealed.slice(0, 200) });
+                    }
+                }
+            }
         }
-        const loadingText = await page.evaluate(() => {
-          const loading = Array.from(document.querySelectorAll('button, [aria-busy="true"], [class*="loading" i], [class*="spinner" i]')).map((el) => el.innerText?.trim()).filter((t) => t && /loading|saving|submitting|sending|processing/i.test(t));
-          return loading.slice(0, 3);
-        });
-        result.loadingPatterns.push(...loadingText);
-      }
-    } catch {
     }
-  }
-  if (hasForm) {
-    try {
-      const emailField = formInputs.find((e) => e.expectedData === "valid_email" || /email/i.test(e.meaning));
-      const passwordField = formInputs.find((e) => e.expectedData === "password" || /password/i.test(e.meaning));
-      if (emailField) {
-        const emailLocator = page.locator('input[type="email"], input[name*="email"], input[placeholder*="email" i]').first();
+    catch { /* non-fatal */ }
+    return results;
+}
+/**
+ * Run interactive probing on a single screen page.
+ * The page must already be navigated to the screen URL.
+ * `elements` is the output of the static extractElements pass.
+ */
+export async function probeScreen(page, screenId, url, elements) {
+    const result = {
+        screenId, url,
+        validationErrors: [], successMessages: [], modals: [], conditionals: [], loadingPatterns: [],
+    };
+    const formInputs = elements.filter((e) => /input|text|email|password|tel|search|textarea|select/i.test(e.role));
+    const hasForm = formInputs.length > 0;
+    // ── Probe 1: Empty submit → capture required-field errors ────────────────────
+    if (hasForm) {
         try {
-          await emailLocator.fill("notanemail", { timeout: 1e3 });
-          await emailLocator.blur();
-          await page.waitForTimeout(600);
-          const errors = await collectErrors(page);
-          for (const errorText of errors) {
-            result.validationErrors.push({ field: emailField.meaning, trigger: "invalid_format", errorText: errorText.slice(0, 150) });
-          }
-        } catch {
+            const submitLabel = await findSubmitButton(page);
+            if (submitLabel) {
+                // Click submit with no data filled in
+                const submitBtn = page.locator(`button:has-text("${submitLabel}")`).first();
+                await submitBtn.click({ timeout: 2000 });
+                await page.waitForTimeout(1500);
+                const errors = await collectErrors(page);
+                // Prefer DOM-proximity mapping via aria-invalid + aria-describedby
+                const ariaFieldErrors = await page.evaluate(() => Array.from(document.querySelectorAll('[aria-invalid="true"]')).map((el) => {
+                    const describedBy = el.getAttribute('aria-describedby');
+                    const errorEl = describedBy ? document.getElementById(describedBy) : null;
+                    const label = el.getAttribute('aria-label') || el.getAttribute('placeholder') || el.name || '';
+                    return { label, errorText: errorEl?.textContent?.trim() || '' };
+                }).filter((f) => f.errorText));
+                const ariaMatched = new Set();
+                for (const af of ariaFieldErrors) {
+                    ariaMatched.add(af.errorText);
+                    result.validationErrors.push({ field: af.label || 'unknown', trigger: 'empty_submit', errorText: af.errorText.slice(0, 150) });
+                }
+                // Fallback: text-proximity match for errors not covered by aria-invalid
+                for (const errorText of errors.filter((e) => !ariaMatched.has(e))) {
+                    const matchedField = formInputs.find((el) => errorText.toLowerCase().includes(el.meaning.toLowerCase().split(' ')[0]) ||
+                        el.meaning.toLowerCase().includes(errorText.toLowerCase().split(' ')[0]));
+                    result.validationErrors.push({
+                        field: matchedField?.meaning ?? 'unknown',
+                        trigger: 'empty_submit',
+                        errorText: errorText.slice(0, 150),
+                    });
+                }
+                // Check for loading state text during submit
+                const loadingText = await page.evaluate(() => {
+                    const loading = Array.from(document.querySelectorAll('button, [aria-busy="true"], [class*="loading" i], [class*="spinner" i]'))
+                        .map((el) => el.innerText?.trim())
+                        .filter((t) => t && /loading|saving|submitting|sending|processing/i.test(t));
+                    return loading.slice(0, 3);
+                });
+                result.loadingPatterns.push(...loadingText);
+            }
         }
-      }
-      if (passwordField) {
-        const pwLocator = page.locator('input[type="password"]').first();
+        catch { /* non-fatal — form probe failed, continue */ }
+    }
+    // ── Probe 2: Invalid format inputs ──────────────────────────────────────────
+    if (hasForm) {
         try {
-          await pwLocator.fill("123", { timeout: 1e3 });
-          await pwLocator.blur();
-          await page.waitForTimeout(600);
-          const errors = await collectErrors(page);
-          for (const errorText of errors) {
-            if (!result.validationErrors.some((e) => e.errorText === errorText)) {
-              result.validationErrors.push({ field: passwordField.meaning, trigger: "invalid_format", errorText: errorText.slice(0, 150) });
+            const emailField = formInputs.find((e) => e.expectedData === 'valid_email' || /email/i.test(e.meaning));
+            const passwordField = formInputs.find((e) => e.expectedData === 'password' || /password/i.test(e.meaning));
+            if (emailField) {
+                const emailLocator = page.locator('input[type="email"], input[name*="email"], input[placeholder*="email" i]').first();
+                try {
+                    await emailLocator.fill('notanemail', { timeout: 1000 });
+                    await emailLocator.blur();
+                    await page.waitForTimeout(600);
+                    const errors = await collectErrors(page);
+                    for (const errorText of errors) {
+                        result.validationErrors.push({ field: emailField.meaning, trigger: 'invalid_format', errorText: errorText.slice(0, 150) });
+                    }
+                }
+                catch { /* locator not found */ }
+            }
+            if (passwordField) {
+                const pwLocator = page.locator('input[type="password"]').first();
+                try {
+                    await pwLocator.fill('123', { timeout: 1000 });
+                    await pwLocator.blur();
+                    await page.waitForTimeout(600);
+                    const errors = await collectErrors(page);
+                    for (const errorText of errors) {
+                        if (!result.validationErrors.some((e) => e.errorText === errorText)) {
+                            result.validationErrors.push({ field: passwordField.meaning, trigger: 'invalid_format', errorText: errorText.slice(0, 150) });
+                        }
+                    }
+                }
+                catch { /* locator not found */ }
             }
-          }
-        } catch {
-        }
-      }
-    } catch {
-    }
-  }
-  try {
-    const triggers = await findModalTriggers(page);
-    for (const trigger of triggers) {
-      try {
-        const btn = page.locator(`button:has-text("${trigger.label}")`).first();
-        const domBefore = await page.evaluate(() => document.body.innerText.length);
-        await btn.click({ timeout: 1500 });
-        await page.waitForTimeout(1e3);
-        const dialogText = await page.evaluate(() => {
-          const DIALOG_SEL = '[role="dialog"], [role="alertdialog"], .modal, .Modal, [class*="modal" i], [class*="dialog" i], [class*="Dialog"]';
-          const dialogs = Array.from(document.querySelectorAll(DIALOG_SEL)).filter((el) => window.getComputedStyle(el).display !== "none");
-          if (dialogs.length === 0) return null;
-          const d = dialogs[0];
-          const title = d.querySelector('[role="heading"], h1, h2, h3')?.textContent?.trim() || "";
-          const content = d.innerText?.replace(/\s+/g, " ").trim().slice(0, 400);
-          const fields = Array.from(d.querySelectorAll("input, select, textarea, button")).map((f) => f.getAttribute("aria-label") || f.getAttribute("placeholder") || f.value || "").filter((t) => t.trim().length > 0);
-          return { title, content, fields };
-        });
-        if (dialogText && dialogText.content.length > 20) {
-          result.modals.push({
-            triggerElement: trigger.label,
-            title: dialogText.title,
-            content: dialogText.content,
-            fields: dialogText.fields.slice(0, 10)
-          });
-        } else {
-          const accordionText = await page.evaluate(() => {
-            const panels = Array.from(document.querySelectorAll(
-              '[aria-expanded="true"] + *, details[open] > :not(summary), [data-state="open"]:not([role="dialog"]):not([class*="modal" i]), [data-headlessui-state="open"] > *'
-            )).filter((el) => {
-              const s = window.getComputedStyle(el);
-              return s.display !== "none" && s.visibility !== "hidden";
-            });
-            if (panels.length === 0) return null;
-            const panel = panels[0];
-            const heading = panel.querySelector("h2,h3,h4")?.textContent?.replace(/\s+/g, " ").trim() || "";
-            const content = panel.innerText?.replace(/\s+/g, " ").trim().slice(0, 400) || "";
-            return content.length > 15 ? { heading, content } : null;
-          });
-          if (accordionText) {
-            result.modals.push({
-              triggerElement: trigger.label,
-              title: accordionText.heading || `${trigger.label} (revealed)`,
-              content: accordionText.content,
-              fields: []
-            });
-          }
         }
-        await page.keyboard.press("Escape");
-        await page.waitForTimeout(400);
-        const toasts = await collectToasts(page);
-        for (const t of toasts) {
-          if (t.length > 5) result.successMessages.push({ type: "toast", content: t.slice(0, 200) });
+        catch { /* non-fatal */ }
+    }
+    // ── Probe 3: Button clicks → discover modal/dialog contents ─────────────────
+    try {
+        const triggers = await findModalTriggers(page);
+        for (const trigger of triggers) {
+            try {
+                const btn = page.locator(`button:has-text("${trigger.label}")`).first();
+                const domBefore = await page.evaluate(() => document.body.innerText.length);
+                await btn.click({ timeout: 1500 });
+                await page.waitForTimeout(1000);
+                // Check if a dialog/modal appeared
+                const dialogText = await page.evaluate(() => {
+                    const DIALOG_SEL = '[role="dialog"], [role="alertdialog"], .modal, .Modal, [class*="modal" i], [class*="dialog" i], [class*="Dialog"]';
+                    const dialogs = Array.from(document.querySelectorAll(DIALOG_SEL))
+                        .filter((el) => window.getComputedStyle(el).display !== 'none');
+                    if (dialogs.length === 0)
+                        return null;
+                    const d = dialogs[0];
+                    const title = d.querySelector('[role="heading"], h1, h2, h3')?.textContent?.trim() || '';
+                    const content = d.innerText?.replace(/\s+/g, ' ').trim().slice(0, 400);
+                    const fields = Array.from(d.querySelectorAll('input, select, textarea, button'))
+                        .map((f) => f.getAttribute('aria-label') || f.getAttribute('placeholder') || f.value || '')
+                        .filter((t) => t.trim().length > 0);
+                    return { title, content, fields };
+                });
+                if (dialogText && dialogText.content.length > 20) {
+                    result.modals.push({
+                        triggerElement: trigger.label,
+                        title: dialogText.title,
+                        content: dialogText.content,
+                        fields: dialogText.fields.slice(0, 10),
+                    });
+                }
+                else {
+                    // No modal appeared — check for accordion/disclosure panel reveals
+                    // Clicks on accordion triggers change aria-expanded but don't open a dialog.
+                    const accordionText = await page.evaluate(() => {
+                        const panels = Array.from(document.querySelectorAll('[aria-expanded="true"] + *, details[open] > :not(summary), [data-state="open"]:not([role="dialog"]):not([class*="modal" i]), [data-headlessui-state="open"] > *')).filter((el) => {
+                            const s = window.getComputedStyle(el);
+                            return s.display !== 'none' && s.visibility !== 'hidden';
+                        });
+                        if (panels.length === 0)
+                            return null;
+                        const panel = panels[0];
+                        const heading = panel.querySelector('h2,h3,h4')?.textContent?.replace(/\s+/g, ' ').trim() || '';
+                        const content = panel.innerText?.replace(/\s+/g, ' ').trim().slice(0, 400) || '';
+                        return content.length > 15 ? { heading, content } : null;
+                    });
+                    if (accordionText) {
+                        result.modals.push({
+                            triggerElement: trigger.label,
+                            title: accordionText.heading || `${trigger.label} (revealed)`,
+                            content: accordionText.content,
+                            fields: [],
+                        });
+                    }
+                }
+                // Dismiss: Escape key first, then close button
+                await page.keyboard.press('Escape');
+                await page.waitForTimeout(400);
+                // Check if toast appeared after the click
+                const toasts = await collectToasts(page);
+                for (const t of toasts) {
+                    if (t.length > 5)
+                        result.successMessages.push({ type: 'toast', content: t.slice(0, 200) });
+                }
+            }
+            catch { /* this button's probe failed, try next */ }
         }
-      } catch {
-      }
-    }
-  } catch {
-  }
-  try {
-    const conditionals = await probeConditionals(page);
-    result.conditionals.push(...conditionals);
-  } catch {
-  }
-  try {
-    result.tabPanels = await probeTabPanels(page);
-  } catch {
-  }
-  try {
-    result.tooltips = await probeTooltips(page);
-  } catch {
-  }
-  try {
-    result.carouselSlides = await probeCarousels(page);
-  } catch {
-  }
-  try {
-    result.wizardSteps = await probeWizardSteps(page);
-  } catch {
-  }
-  try {
-    result.focusTraps = await detectFocusTraps(page);
-  } catch {
-  }
-  try {
-    result.skipNavIssues = await probeSkipNavigation(page);
-  } catch {
-  }
-  try {
-    result.contextMenus = await probeContextMenus(page);
-  } catch {
-  }
-  return result;
-}
-function probeResultToObservations(result) {
-  const obs = [];
-  for (const ve of result.validationErrors) {
-    obs.push({ elementMeaning: ve.field, observationType: "VALIDATION_ERROR", observedText: ve.errorText, triggeredBy: ve.trigger });
-  }
-  for (const sm of result.successMessages) {
-    obs.push({ elementMeaning: "(page)", observationType: "SUCCESS_TOAST", observedText: sm.content, triggeredBy: sm.type });
-  }
-  for (const m of result.modals) {
-    obs.push({ elementMeaning: m.triggerElement, observationType: "MODAL", observedText: [m.title, m.content].filter(Boolean).join(" \u2014 ").slice(0, 500), triggeredBy: `button_click:${m.triggerElement}` });
-  }
-  for (const c of result.conditionals) {
-    obs.push({ elementMeaning: c.triggerElement, observationType: "CONDITIONAL_REVEAL", observedText: c.revealedText, triggeredBy: `select_change:${c.triggerElement}:${c.triggerValue}` });
-  }
-  for (const lp of result.loadingPatterns) {
-    obs.push({ elementMeaning: "(submit button)", observationType: "LOADING_STATE", observedText: lp, triggeredBy: "form_submit" });
-  }
-  for (const tp of result.tabPanels ?? []) {
-    obs.push({ elementMeaning: tp.tabLabel, observationType: "TAB_PANEL", observedText: tp.panelContent, triggeredBy: `tab_click:${tp.tabLabel}` });
-  }
-  for (const tt of result.tooltips ?? []) {
-    obs.push({ elementMeaning: tt.triggerLabel, observationType: "TOOLTIP", observedText: tt.tooltipText, triggeredBy: "hover_or_title" });
-  }
-  for (const cs of result.carouselSlides ?? []) {
-    obs.push({ elementMeaning: `Slide ${cs.slideIndex + 1}`, observationType: "CAROUSEL_SLIDE", observedText: cs.content, triggeredBy: `carousel_next:${cs.slideIndex}` });
-  }
-  for (const ws of result.wizardSteps ?? []) {
-    obs.push({ elementMeaning: ws.stepLabel ?? `Step ${ws.stepIndex + 1}`, observationType: "WIZARD_STEP", observedText: ws.content, triggeredBy: `wizard_next:${ws.stepIndex}` });
-  }
-  for (const ft of result.focusTraps ?? []) {
-    obs.push({ elementMeaning: ft.modalTrigger, observationType: "FOCUS_TRAP", observedText: ft.focusTrapped ? "Focus correctly trapped inside dialog" : "FAIL: focus escaped dialog \u2014 WCAG 2.1.2 violation", triggeredBy: "tab_key_sequence" });
-  }
-  for (const issue of result.skipNavIssues ?? []) {
-    obs.push({ elementMeaning: "(page)", observationType: "SKIP_NAV_ISSUE", observedText: issue, triggeredBy: "skip_nav_audit" });
-  }
-  for (const cm of result.contextMenus ?? []) {
-    obs.push({ elementMeaning: cm.trigger, observationType: "CONTEXT_MENU", observedText: cm.items.join(" | "), triggeredBy: "right_click" });
-  }
-  return obs;
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 4: Select/radio → conditional reveals ──────────────────────────────
+    try {
+        const conditionals = await probeConditionals(page);
+        result.conditionals.push(...conditionals);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 5: Tab panels — click each tab, capture revealed content ────────────
+    try {
+        result.tabPanels = await probeTabPanels(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 6: Tooltips — hover/title/describedby capture ─────────────────────
+    try {
+        result.tooltips = await probeTooltips(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 7: Carousel/slider slides ──────────────────────────────────────────
+    try {
+        result.carouselSlides = await probeCarousels(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 8: Wizard/multi-step form steps ────────────────────────────────────
+    try {
+        result.wizardSteps = await probeWizardSteps(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 9: Focus-trap detection on any open dialogs ────────────────────────
+    try {
+        result.focusTraps = await detectFocusTraps(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 10: Skip navigation compliance (WCAG 2.4.1) ────────────────────────
+    try {
+        result.skipNavIssues = await probeSkipNavigation(page);
+    }
+    catch { /* non-fatal */ }
+    // ── Probe 11: Context menu capture on canvas/chart elements ──────────────────
+    try {
+        result.contextMenus = await probeContextMenus(page);
+    }
+    catch { /* non-fatal */ }
+    return result;
 }
-function probeResultToMarkdown(result) {
-  const lines = [`## Probe Observations \u2014 ${result.url}
-`];
-  if (result.validationErrors.length > 0) {
-    lines.push("### Validation Errors (observed)");
+/** Phase 5: Convert ProbeResult to typed ProbeObservationFact rows for direct DB storage. */
+export function probeResultToObservations(result) {
+    const obs = [];
     for (const ve of result.validationErrors) {
-      lines.push(`- **${ve.field}** (${ve.trigger}): "${ve.errorText}"`);
+        obs.push({ elementMeaning: ve.field, observationType: 'VALIDATION_ERROR', observedText: ve.errorText, triggeredBy: ve.trigger });
     }
-  }
-  if (result.successMessages.length > 0) {
-    lines.push("\n### Success / Feedback Messages (observed)");
     for (const sm of result.successMessages) {
-      lines.push(`- ${sm.type}: "${sm.content}"`);
+        obs.push({ elementMeaning: '(page)', observationType: 'SUCCESS_TOAST', observedText: sm.content, triggeredBy: sm.type });
     }
-  }
-  if (result.modals.length > 0) {
-    lines.push("\n### Modal / Dialog Contents (observed)");
     for (const m of result.modals) {
-      lines.push(`- **Trigger:** ${m.triggerElement}`);
-      if (m.title) lines.push(`  - Title: ${m.title}`);
-      lines.push(`  - Content: ${m.content.slice(0, 200)}`);
-      if (m.fields.length > 0) lines.push(`  - Fields: ${m.fields.join(", ")}`);
-    }
-  }
-  if ((result.tabPanels ?? []).length > 0) {
-    lines.push("\n### Tab Panel Contents (observed)");
-    for (const tp of result.tabPanels) {
-      lines.push(`- **Tab: ${tp.tabLabel}**${tp.panelHeading ? ` \u2014 ${tp.panelHeading}` : ""}: ${tp.panelContent.slice(0, 200)}`);
-    }
-  }
-  if ((result.tooltips ?? []).length > 0) {
-    lines.push("\n### Tooltips (observed)");
-    for (const tt of result.tooltips) {
-      lines.push(`- **${tt.triggerLabel}**: ${tt.tooltipText}`);
-    }
-  }
-  if ((result.carouselSlides ?? []).length > 0) {
-    lines.push("\n### Carousel Slides (observed)");
-    for (const cs of result.carouselSlides) {
-      lines.push(`- **Slide ${cs.slideIndex + 1}**${cs.heading ? ` \u2014 ${cs.heading}` : ""}: ${cs.content.slice(0, 200)}`);
-    }
-  }
-  if ((result.wizardSteps ?? []).length > 0) {
-    lines.push("\n### Wizard / Multi-Step Form (observed)");
-    for (const ws of result.wizardSteps) {
-      const label = ws.stepLabel ? ` \u2014 ${ws.stepLabel}` : "";
-      lines.push(`- **Step ${ws.stepIndex + 1}${label}**: ${ws.content.slice(0, 200)}`);
-      if (ws.fields.length > 0) lines.push(`  - Fields: ${ws.fields.join(", ")}`);
-    }
-  }
-  if ((result.focusTraps ?? []).length > 0) {
-    lines.push("\n### Focus-Trap Audit (observed)");
-    for (const ft of result.focusTraps) {
-      const verdict = ft.focusTrapped ? "\u2705 PASS" : "\u274C FAIL (WCAG 2.1.2)";
-      lines.push(`- **${ft.modalTrigger}**: ${verdict} \u2014 focused: [${ft.sampledFocused.slice(0, 4).join(", ")}]`);
-    }
-  }
-  if (result.conditionals.length > 0) {
-    lines.push("\n### Conditional UI (observed)");
+        obs.push({ elementMeaning: m.triggerElement, observationType: 'MODAL', observedText: [m.title, m.content].filter(Boolean).join(' — ').slice(0, 500), triggeredBy: `button_click:${m.triggerElement}` });
+    }
     for (const c of result.conditionals) {
-      lines.push(`- **${c.triggerElement}** = "${c.triggerValue}" reveals: ${c.revealedText}`);
-    }
-  }
-  if (result.loadingPatterns.length > 0) {
-    lines.push("\n### Loading State Text (observed)");
-    for (const lp of result.loadingPatterns) lines.push(`- "${lp}"`);
-  }
-  const full = lines.join("\n");
-  const errorSection = result.validationErrors.length > 0 ? `## Real Validation Errors \u2014 ${result.url}
-` + result.validationErrors.map((e) => `- **${e.field}**: "${e.errorText}"`).join("\n") : "";
-  const interactionSection = [
-    result.successMessages.length > 0 ? `## Success Messages \u2014 ${result.url}
-` + result.successMessages.map((s) => `- ${s.type}: "${s.content}"`).join("\n") : "",
-    result.loadingPatterns.length > 0 ? `## Loading Patterns \u2014 ${result.url}
-` + result.loadingPatterns.map((lp) => `- "${lp}"`).join("\n") : "",
-    result.modals.length > 0 ? `## Modal Contents \u2014 ${result.url}
-` + result.modals.map((m) => `### ${m.triggerElement}
-${m.content}`).join("\n") : ""
-  ].filter(Boolean).join("\n\n");
-  return {
-    errorCatalogueChunk: errorSection,
-    interactionPatternsChunk: interactionSection
-  };
+        obs.push({ elementMeaning: c.triggerElement, observationType: 'CONDITIONAL_REVEAL', observedText: c.revealedText, triggeredBy: `select_change:${c.triggerElement}:${c.triggerValue}` });
+    }
+    for (const lp of result.loadingPatterns) {
+        obs.push({ elementMeaning: '(submit button)', observationType: 'LOADING_STATE', observedText: lp, triggeredBy: 'form_submit' });
+    }
+    for (const tp of result.tabPanels ?? []) {
+        obs.push({ elementMeaning: tp.tabLabel, observationType: 'TAB_PANEL', observedText: tp.panelContent, triggeredBy: `tab_click:${tp.tabLabel}` });
+    }
+    for (const tt of result.tooltips ?? []) {
+        obs.push({ elementMeaning: tt.triggerLabel, observationType: 'TOOLTIP', observedText: tt.tooltipText, triggeredBy: 'hover_or_title' });
+    }
+    for (const cs of result.carouselSlides ?? []) {
+        obs.push({ elementMeaning: `Slide ${cs.slideIndex + 1}`, observationType: 'CAROUSEL_SLIDE', observedText: cs.content, triggeredBy: `carousel_next:${cs.slideIndex}` });
+    }
+    for (const ws of result.wizardSteps ?? []) {
+        obs.push({ elementMeaning: ws.stepLabel ?? `Step ${ws.stepIndex + 1}`, observationType: 'WIZARD_STEP', observedText: ws.content, triggeredBy: `wizard_next:${ws.stepIndex}` });
+    }
+    for (const ft of result.focusTraps ?? []) {
+        obs.push({ elementMeaning: ft.modalTrigger, observationType: 'FOCUS_TRAP', observedText: ft.focusTrapped ? 'Focus correctly trapped inside dialog' : 'FAIL: focus escaped dialog — WCAG 2.1.2 violation', triggeredBy: 'tab_key_sequence' });
+    }
+    for (const issue of result.skipNavIssues ?? []) {
+        obs.push({ elementMeaning: '(page)', observationType: 'SKIP_NAV_ISSUE', observedText: issue, triggeredBy: 'skip_nav_audit' });
+    }
+    for (const cm of result.contextMenus ?? []) {
+        obs.push({ elementMeaning: cm.trigger, observationType: 'CONTEXT_MENU', observedText: cm.items.join(' | '), triggeredBy: 'right_click' });
+    }
+    return obs;
 }
-async function probeAllScreens(page, tenantId, projectId, discovered, onProgress) {
-  const probeable = discovered.filter((d) => d.screenId && d.url && !d.url.includes("#"));
-  if (probeable.length === 0) return;
-  const errorCatalogueChunks = [];
-  const interactionChunks = [];
-  for (let i = 0; i < probeable.length; i++) {
-    const screen = probeable[i];
-    const pct = 88 + Math.round(i / probeable.length * 10);
-    await onProgress?.(pct, `Probing screen ${i + 1}/${probeable.length}: ${screen.url}`);
-    try {
-      if (page.url() !== screen.url) {
-        await page.goto(screen.url, { waitUntil: "domcontentloaded" });
-        await page.waitForTimeout(1500);
-      }
-      const result = await probeScreen(page, screen.screenId, screen.url, screen.elements ?? []);
-      const observations = probeResultToObservations(result);
-      if (observations.length > 0) {
-        await AppBrain.saveProbeObservations(tenantId, projectId, screen.screenId, observations).catch(console.warn);
-      }
-      const md = probeResultToMarkdown(result);
-      if (md.errorCatalogueChunk) errorCatalogueChunks.push(md.errorCatalogueChunk);
-      if (md.interactionPatternsChunk) interactionChunks.push(md.interactionPatternsChunk);
-      const probeMarkdown = [md.errorCatalogueChunk, md.interactionPatternsChunk].filter(Boolean).join("\n\n");
-      if (probeMarkdown.length > 50) {
-        await AppBrain.saveKnowledgeChunk(tenantId, projectId, "probe", screen.screenId, probeMarkdown, `Probe \u2014 ${screen.url}`).catch(console.warn);
-      }
-      if (result.validationErrors.length > 0) {
-        console.log(`[probe] ${screen.url}: ${result.validationErrors.length} validation errors, ${result.modals.length} modals`);
-      }
-    } catch (err) {
-      console.warn(`[probe] \u2717 ${screen.url}:`, err instanceof Error ? err.message : err);
-    }
-  }
-  if (errorCatalogueChunks.length > 0) {
-    const combined = `# Error Catalogue (Real Observed \u2014 Interactive Probe)
-
-${errorCatalogueChunks.join("\n\n")}`;
-    await AppBrain.upsertSkillFile(tenantId, projectId, "ERROR_CATALOGUE", combined, {
-      summary: `Real validation error messages observed via interactive probe across ${errorCatalogueChunks.length} screens`,
-      scope: "PROJECT"
-    }).catch(console.warn);
-  }
-  if (interactionChunks.length > 0) {
-    const combined = `# Interaction Patterns (Real Observed \u2014 Interactive Probe)
-
-${interactionChunks.join("\n\n")}`;
-    await AppBrain.upsertSkillFile(tenantId, projectId, "INTERACTION_PATTERNS", combined, {
-      summary: `Real loading states, success messages, and modal contents observed via interactive probe`,
-      scope: "PROJECT"
-    }).catch(console.warn);
-  }
-  await onProgress?.(98, "Interactive probe complete");
-  console.log(`[probe] Probed ${probeable.length} screens. Errors: ${errorCatalogueChunks.length}, Interactions: ${interactionChunks.length}`);
+/**
+ * Convert a ProbeResult into markdown to store as KnowledgeChunks
+ * and update ERROR_CATALOGUE + INTERACTION_PATTERNS skill files.
+ */
+export function probeResultToMarkdown(result) {
+    const lines = [`## Probe Observations — ${result.url}\n`];
+    if (result.validationErrors.length > 0) {
+        lines.push('### Validation Errors (observed)');
+        for (const ve of result.validationErrors) {
+            lines.push(`- **${ve.field}** (${ve.trigger}): "${ve.errorText}"`);
+        }
+    }
+    if (result.successMessages.length > 0) {
+        lines.push('\n### Success / Feedback Messages (observed)');
+        for (const sm of result.successMessages) {
+            lines.push(`- ${sm.type}: "${sm.content}"`);
+        }
+    }
+    if (result.modals.length > 0) {
+        lines.push('\n### Modal / Dialog Contents (observed)');
+        for (const m of result.modals) {
+            lines.push(`- **Trigger:** ${m.triggerElement}`);
+            if (m.title)
+                lines.push(`  - Title: ${m.title}`);
+            lines.push(`  - Content: ${m.content.slice(0, 200)}`);
+            if (m.fields.length > 0)
+                lines.push(`  - Fields: ${m.fields.join(', ')}`);
+        }
+    }
+    if ((result.tabPanels ?? []).length > 0) {
+        lines.push('\n### Tab Panel Contents (observed)');
+        for (const tp of result.tabPanels) {
+            lines.push(`- **Tab: ${tp.tabLabel}**${tp.panelHeading ? ` — ${tp.panelHeading}` : ''}: ${tp.panelContent.slice(0, 200)}`);
+        }
+    }
+    if ((result.tooltips ?? []).length > 0) {
+        lines.push('\n### Tooltips (observed)');
+        for (const tt of result.tooltips) {
+            lines.push(`- **${tt.triggerLabel}**: ${tt.tooltipText}`);
+        }
+    }
+    if ((result.carouselSlides ?? []).length > 0) {
+        lines.push('\n### Carousel Slides (observed)');
+        for (const cs of result.carouselSlides) {
+            lines.push(`- **Slide ${cs.slideIndex + 1}**${cs.heading ? ` — ${cs.heading}` : ''}: ${cs.content.slice(0, 200)}`);
+        }
+    }
+    if ((result.wizardSteps ?? []).length > 0) {
+        lines.push('\n### Wizard / Multi-Step Form (observed)');
+        for (const ws of result.wizardSteps) {
+            const label = ws.stepLabel ? ` — ${ws.stepLabel}` : '';
+            lines.push(`- **Step ${ws.stepIndex + 1}${label}**: ${ws.content.slice(0, 200)}`);
+            if (ws.fields.length > 0)
+                lines.push(`  - Fields: ${ws.fields.join(', ')}`);
+        }
+    }
+    if ((result.focusTraps ?? []).length > 0) {
+        lines.push('\n### Focus-Trap Audit (observed)');
+        for (const ft of result.focusTraps) {
+            const verdict = ft.focusTrapped ? '✅ PASS' : '❌ FAIL (WCAG 2.1.2)';
+            lines.push(`- **${ft.modalTrigger}**: ${verdict} — focused: [${ft.sampledFocused.slice(0, 4).join(', ')}]`);
+        }
+    }
+    if (result.conditionals.length > 0) {
+        lines.push('\n### Conditional UI (observed)');
+        for (const c of result.conditionals) {
+            lines.push(`- **${c.triggerElement}** = "${c.triggerValue}" reveals: ${c.revealedText}`);
+        }
+    }
+    if (result.loadingPatterns.length > 0) {
+        lines.push('\n### Loading State Text (observed)');
+        for (const lp of result.loadingPatterns)
+            lines.push(`- "${lp}"`);
+    }
+    const full = lines.join('\n');
+    const errorSection = result.validationErrors.length > 0
+        ? `## Real Validation Errors — ${result.url}\n` +
+            result.validationErrors.map((e) => `- **${e.field}**: "${e.errorText}"`).join('\n')
+        : '';
+    const interactionSection = [
+        result.successMessages.length > 0
+            ? `## Success Messages — ${result.url}\n` + result.successMessages.map((s) => `- ${s.type}: "${s.content}"`).join('\n')
+            : '',
+        result.loadingPatterns.length > 0
+            ? `## Loading Patterns — ${result.url}\n` + result.loadingPatterns.map((lp) => `- "${lp}"`).join('\n')
+            : '',
+        result.modals.length > 0
+            ? `## Modal Contents — ${result.url}\n` + result.modals.map((m) => `### ${m.triggerElement}\n${m.content}`).join('\n')
+            : '',
+    ].filter(Boolean).join('\n\n');
+    return {
+        errorCatalogueChunk: errorSection,
+        interactionPatternsChunk: interactionSection,
+    };
 }
+/**
+ * Run interactive probing for all screens discovered in a crawl session.
+ * Called from crawlProject() when opts.interactive = true.
+ */
+export async function probeAllScreens(page, tenantId, projectId, discovered, onProgress) {
+    const probeable = discovered.filter((d) => d.screenId && d.url && !d.url.includes('#'));
+    if (probeable.length === 0)
+        return;
+    const errorCatalogueChunks = [];
+    const interactionChunks = [];
+    for (let i = 0; i < probeable.length; i++) {
+        const screen = probeable[i];
+        const pct = 88 + Math.round((i / probeable.length) * 10);
+        await onProgress?.(pct, `Probing screen ${i + 1}/${probeable.length}: ${screen.url}`);
+        try {
+            // Navigate to screen
+            if (page.url() !== screen.url) {
+                await page.goto(screen.url, { waitUntil: 'domcontentloaded' });
+                await page.waitForTimeout(1500); // SPA hydration
+            }
+            const result = await probeScreen(page, screen.screenId, screen.url, screen.elements ?? []);
+            // Phase 5: save structured probe observations (replaces per-re-probe)
+            const observations = probeResultToObservations(result);
+            if (observations.length > 0) {
+                await AppBrain.saveProbeObservations(tenantId, projectId, screen.screenId, observations).catch(console.warn);
+            }
+            // Store raw probe result as KnowledgeChunk (kept for BM25 / oversized projects)
+            const md = probeResultToMarkdown(result);
+            if (md.errorCatalogueChunk)
+                errorCatalogueChunks.push(md.errorCatalogueChunk);
+            if (md.interactionPatternsChunk)
+                interactionChunks.push(md.interactionPatternsChunk);
+            const probeMarkdown = [md.errorCatalogueChunk, md.interactionPatternsChunk].filter(Boolean).join('\n\n');
+            if (probeMarkdown.length > 50) {
+                await AppBrain.saveKnowledgeChunk(tenantId, projectId, 'probe', screen.screenId, probeMarkdown, `Probe — ${screen.url}`).catch(console.warn);
+            }
+            if (result.validationErrors.length > 0) {
+                console.log(`[probe] ${screen.url}: ${result.validationErrors.length} validation errors, ${result.modals.length} modals`);
+            }
+        }
+        catch (err) {
+            console.warn(`[probe] ✗ ${screen.url}:`, err instanceof Error ? err.message : err);
+        }
+    }
+    // Update ERROR_CATALOGUE skill file with all real observed errors
+    if (errorCatalogueChunks.length > 0) {
+        const combined = `# Error Catalogue (Real Observed — Interactive Probe)\n\n${errorCatalogueChunks.join('\n\n')}`;
+        await AppBrain.upsertSkillFile(tenantId, projectId, 'ERROR_CATALOGUE', combined, {
+            summary: `Real validation error messages observed via interactive probe across ${errorCatalogueChunks.length} screens`,
+            scope: 'PROJECT',
+        }).catch(console.warn);
+    }
+    // Update INTERACTION_PATTERNS skill file with real observed patterns
+    if (interactionChunks.length > 0) {
+        const combined = `# Interaction Patterns (Real Observed — Interactive Probe)\n\n${interactionChunks.join('\n\n')}`;
+        await AppBrain.upsertSkillFile(tenantId, projectId, 'INTERACTION_PATTERNS', combined, {
+            summary: `Real loading states, success messages, and modal contents observed via interactive probe`,
+            scope: 'PROJECT',
+        }).catch(console.warn);
+    }
+    await onProgress?.(98, 'Interactive probe complete');
+    console.log(`[probe] Probed ${probeable.length} screens. Errors: ${errorCatalogueChunks.length}, Interactions: ${interactionChunks.length}`);
+}
+/** Verify skip-navigation links exist and their targets are present in the DOM. */
 async function probeSkipNavigation(page) {
-  const issues = [];
-  try {
-    const skipLinks = await page.evaluate(
-      () => Array.from(document.querySelectorAll('a[href^="#"]')).filter((el) => /skip|jump to|main content|content|nav/i.test(el.innerText?.toLowerCase().trim() || "")).map((el) => ({
-        text: el.innerText?.trim() || "",
-        href: el.getAttribute("href") || "",
-        hasTarget: !!document.querySelector(el.getAttribute("href") || "#__invalid__")
-      }))
-    );
-    if (skipLinks.length === 0) {
-      issues.push("No skip navigation links found (WCAG 2.4.1 \u2014 keyboard users cannot bypass nav blocks)");
-    }
-    for (const link of skipLinks) {
-      if (!link.hasTarget) issues.push(`Skip link "${link.text}" \u2192 "${link.href}" target not found in DOM`);
-    }
-  } catch {
-  }
-  return issues;
+    const issues = [];
+    try {
+        const skipLinks = await page.evaluate(() => Array.from(document.querySelectorAll('a[href^="#"]'))
+            .filter((el) => /skip|jump to|main content|content|nav/i.test(el.innerText?.toLowerCase().trim() || ''))
+            .map((el) => ({
+            text: el.innerText?.trim() || '',
+            href: el.getAttribute('href') || '',
+            hasTarget: !!document.querySelector(el.getAttribute('href') || '#__invalid__'),
+        })));
+        if (skipLinks.length === 0) {
+            issues.push('No skip navigation links found (WCAG 2.4.1 — keyboard users cannot bypass nav blocks)');
+        }
+        for (const link of skipLinks) {
+            if (!link.hasTarget)
+                issues.push(`Skip link "${link.text}" → "${link.href}" target not found in DOM`);
+        }
+    }
+    catch { /* non-fatal */ }
+    return issues;
 }
+/** Right-click on canvas, chart, and context-menu elements to capture context menu items. */
 async function probeContextMenus(page) {
-  const results = [];
-  try {
-    const targets = await page.$$('canvas, [data-contextmenu], [oncontextmenu], [class*="chart" i]:not(script)');
-    for (const t of targets.slice(0, 4)) {
-      try {
-        await t.click({ button: "right", timeout: 1e3 });
-        await page.waitForTimeout(350);
-        const items = await page.evaluate(
-          () => Array.from(document.querySelectorAll('[role="menu"] [role="menuitem"], .context-menu-item, [class*="contextmenu" i] li')).map((el) => el.innerText?.trim()).filter(Boolean).slice(0, 12)
-        );
-        if (items.length > 0) {
-          const trigger = await t.evaluate((el) => el.getAttribute("aria-label") || el.className.slice(0, 40) || el.tagName).catch(() => "");
-          results.push({ trigger, items });
+    const results = [];
+    try {
+        const targets = await page.$$('canvas, [data-contextmenu], [oncontextmenu], [class*="chart" i]:not(script)');
+        for (const t of targets.slice(0, 4)) {
+            try {
+                await t.click({ button: 'right', timeout: 1000 });
+                await page.waitForTimeout(350);
+                const items = await page.evaluate(() => Array.from(document.querySelectorAll('[role="menu"] [role="menuitem"], .context-menu-item, [class*="contextmenu" i] li'))
+                    .map((el) => el.innerText?.trim())
+                    .filter(Boolean).slice(0, 12));
+                if (items.length > 0) {
+                    const trigger = await t.evaluate((el) => el.getAttribute('aria-label') || el.className.slice(0, 40) || el.tagName).catch(() => '');
+                    results.push({ trigger, items });
+                }
+                await page.keyboard.press('Escape').catch(() => { });
+            }
+            catch { /* skip this target */ }
         }
-        await page.keyboard.press("Escape").catch(() => {
-        });
-      } catch {
-      }
     }
-  } catch {
-  }
-  return results;
+    catch { /* non-fatal */ }
+    return results;
 }
+/** Click carousel next buttons up to 8 slides and record content of each revealed slide. */
 async function probeCarousels(page) {
-  const results = [];
-  try {
-    const CAROUSEL_SEL = '[class*="carousel" i], [class*="slider" i], [class*="swiper" i], [role="region"][aria-roledescription*="carousel" i]';
-    const hasCarousel = await page.evaluate((sel) => !!document.querySelector(sel), CAROUSEL_SEL);
-    if (!hasCarousel) return results;
-    const NEXT_SEL = '[aria-label*="next" i], [aria-label*="Next"], [class*="next" i]:not([class*="footnext"]):not(a), button[class*="arrow-right" i], button[class*="chevron-right" i]';
-    const slide0 = await page.evaluate((carSel) => {
-      const car = document.querySelector(carSel);
-      if (!car) return null;
-      const active = car.querySelector('[aria-hidden="false"], .active, [class*="active" i], [class*="current" i]');
-      const target = active ?? car;
-      return { heading: target.querySelector("h2,h3,h4")?.textContent?.trim() ?? "", content: target.innerText?.replace(/\s+/g, " ").trim().slice(0, 300) ?? "" };
-    }, CAROUSEL_SEL);
-    if (slide0?.content && slide0.content.length > 15) results.push({ slideIndex: 0, heading: slide0.heading || void 0, content: slide0.content });
-    const seen = new Set(slide0?.content ? [slide0.content] : []);
-    for (let i = 1; i < 8; i++) {
-      try {
-        const nextBtn = page.locator(NEXT_SEL).first();
-        const visible = await nextBtn.isVisible().catch(() => false);
-        if (!visible) break;
-        await nextBtn.click({ timeout: 1e3 });
-        await page.waitForTimeout(600);
-        const slide = await page.evaluate((carSel) => {
-          const car = document.querySelector(carSel);
-          if (!car) return null;
-          const active = car.querySelector('[aria-hidden="false"], .active, [class*="active" i], [class*="current" i]');
-          const target = active ?? car;
-          return { heading: target.querySelector("h2,h3,h4")?.textContent?.trim() ?? "", content: target.innerText?.replace(/\s+/g, " ").trim().slice(0, 300) ?? "" };
+    const results = [];
+    try {
+        const CAROUSEL_SEL = '[class*="carousel" i], [class*="slider" i], [class*="swiper" i], [role="region"][aria-roledescription*="carousel" i]';
+        const hasCarousel = await page.evaluate((sel) => !!document.querySelector(sel), CAROUSEL_SEL);
+        if (!hasCarousel)
+            return results;
+        const NEXT_SEL = '[aria-label*="next" i], [aria-label*="Next"], [class*="next" i]:not([class*="footnext"]):not(a), button[class*="arrow-right" i], button[class*="chevron-right" i]';
+        // Capture slide 0 (current state)
+        const slide0 = await page.evaluate((carSel) => {
+            const car = document.querySelector(carSel);
+            if (!car)
+                return null;
+            const active = car.querySelector('[aria-hidden="false"], .active, [class*="active" i], [class*="current" i]');
+            const target = active ?? car;
+            return { heading: target.querySelector('h2,h3,h4')?.textContent?.trim() ?? '', content: target.innerText?.replace(/\s+/g, ' ').trim().slice(0, 300) ?? '' };
         }, CAROUSEL_SEL);
-        if (!slide?.content || slide.content.length < 15 || seen.has(slide.content)) break;
-        seen.add(slide.content);
-        results.push({ slideIndex: i, heading: slide.heading || void 0, content: slide.content });
-      } catch {
-        break;
-      }
-    }
-  } catch {
-  }
-  return results;
+        if (slide0?.content && slide0.content.length > 15)
+            results.push({ slideIndex: 0, heading: slide0.heading || undefined, content: slide0.content });
+        const seen = new Set(slide0?.content ? [slide0.content] : []);
+        for (let i = 1; i < 8; i++) {
+            try {
+                const nextBtn = page.locator(NEXT_SEL).first();
+                const visible = await nextBtn.isVisible().catch(() => false);
+                if (!visible)
+                    break;
+                await nextBtn.click({ timeout: 1000 });
+                await page.waitForTimeout(600);
+                const slide = await page.evaluate((carSel) => {
+                    const car = document.querySelector(carSel);
+                    if (!car)
+                        return null;
+                    const active = car.querySelector('[aria-hidden="false"], .active, [class*="active" i], [class*="current" i]');
+                    const target = active ?? car;
+                    return { heading: target.querySelector('h2,h3,h4')?.textContent?.trim() ?? '', content: target.innerText?.replace(/\s+/g, ' ').trim().slice(0, 300) ?? '' };
+                }, CAROUSEL_SEL);
+                if (!slide?.content || slide.content.length < 15 || seen.has(slide.content))
+                    break;
+                seen.add(slide.content);
+                results.push({ slideIndex: i, heading: slide.heading || undefined, content: slide.content });
+            }
+            catch {
+                break;
+            }
+        }
+    }
+    catch { /* non-fatal */ }
+    return results;
 }
+/** Follow Next/Continue buttons to capture each wizard step's fields and content. */
 async function probeWizardSteps(page) {
-  const results = [];
-  try {
-    const NEXT_LABELS = /^(next|continue|proceed|step \d|›|→|forward)/i;
-    const BACK_LABELS = /^(back|previous|prev|‹|←)/i;
-    const WIZARD_INDICATORS = '[role="progressbar"], [class*="stepper" i], [class*="wizard" i], [class*="progress-step" i], [aria-label*="step" i]';
-    const isWizard = await page.evaluate((sel) => !!document.querySelector(sel), WIZARD_INDICATORS);
-    if (!isWizard) return results;
-    const captureStep = async (stepIndex) => {
-      const data = await page.evaluate(() => {
-        const content = document.querySelector('main, [role="main"], form')?.innerText?.replace(/\s+/g, " ").trim().slice(0, 400) ?? "";
-        const stepLabel = document.querySelector('[aria-current="step"], [class*="step-label" i], [class*="stepper-label" i]')?.textContent?.trim() ?? "";
-        const fields = Array.from(document.querySelectorAll('input:not([type="hidden"]), select, textarea')).map((el) => el.getAttribute("aria-label") || el.placeholder || el.name || "").filter(Boolean).slice(0, 10);
-        return { content, stepLabel, fields };
-      });
-      return { stepIndex, stepLabel: data.stepLabel || void 0, content: data.content, fields: data.fields };
-    };
-    results.push(await captureStep(0));
-    for (let i = 1; i < 6; i++) {
-      try {
-        const nextLabel = await page.evaluate((nextRe) => {
-          const btns = Array.from(document.querySelectorAll('button, [role="button"]'));
-          const btn2 = btns.find((b) => new RegExp(nextRe).test(b.innerText?.trim() || ""));
-          return btn2?.innerText?.trim() || null;
-        }, NEXT_LABELS.source);
-        if (!nextLabel) break;
-        const btn = page.locator(`button:has-text("${nextLabel}")`).first();
-        await btn.click({ timeout: 1500 });
-        await page.waitForTimeout(800);
-        results.push(await captureStep(i));
-      } catch {
-        break;
-      }
-    }
-  } catch {
-  }
-  return results;
+    const results = [];
+    try {
+        const NEXT_LABELS = /^(next|continue|proceed|step \d|›|→|forward)/i;
+        const BACK_LABELS = /^(back|previous|prev|‹|←)/i;
+        const WIZARD_INDICATORS = '[role="progressbar"], [class*="stepper" i], [class*="wizard" i], [class*="progress-step" i], [aria-label*="step" i]';
+        const isWizard = await page.evaluate((sel) => !!document.querySelector(sel), WIZARD_INDICATORS);
+        if (!isWizard)
+            return results;
+        const captureStep = async (stepIndex) => {
+            const data = await page.evaluate(() => {
+                const content = document.querySelector('main, [role="main"], form')?.innerText?.replace(/\s+/g, ' ').trim().slice(0, 400) ?? '';
+                const stepLabel = document.querySelector('[aria-current="step"], [class*="step-label" i], [class*="stepper-label" i]')?.textContent?.trim() ?? '';
+                const fields = Array.from(document.querySelectorAll('input:not([type="hidden"]), select, textarea'))
+                    .map((el) => el.getAttribute('aria-label') || el.placeholder || el.name || '')
+                    .filter(Boolean).slice(0, 10);
+                return { content, stepLabel, fields };
+            });
+            return { stepIndex, stepLabel: data.stepLabel || undefined, content: data.content, fields: data.fields };
+        };
+        results.push(await captureStep(0));
+        for (let i = 1; i < 6; i++) {
+            try {
+                const nextLabel = await page.evaluate((nextRe) => {
+                    const btns = Array.from(document.querySelectorAll('button, [role="button"]'));
+                    const btn = btns.find((b) => new RegExp(nextRe).test(b.innerText?.trim() || ''));
+                    return btn?.innerText?.trim() || null;
+                }, NEXT_LABELS.source);
+                if (!nextLabel)
+                    break;
+                const btn = page.locator(`button:has-text("${nextLabel}")`).first();
+                await btn.click({ timeout: 1500 });
+                await page.waitForTimeout(800);
+                results.push(await captureStep(i));
+            }
+            catch {
+                break;
+            }
+        }
+    }
+    catch { /* non-fatal */ }
+    return results;
 }
+/** For each open modal, Tab 8× and verify focus stays inside the dialog (focus-trap check). */
 async function detectFocusTraps(page) {
-  const results = [];
-  try {
-    const openDialogs = await page.evaluate(() => {
-      return Array.from(document.querySelectorAll('[role="dialog"], [role="alertdialog"]')).filter((el) => window.getComputedStyle(el).display !== "none").map((el) => el.getAttribute("aria-label") || el.querySelector('[role="heading"]')?.textContent?.trim() || "dialog");
-    });
-    for (const dialogLabel of openDialogs.slice(0, 3)) {
-      const sampled = [];
-      let allInside = true;
-      for (let i = 0; i < 8; i++) {
-        await page.keyboard.press("Tab");
-        await page.waitForTimeout(80);
-        const focused = await page.evaluate(() => {
-          const el = document.activeElement;
-          const inDialog = !!el?.closest('[role="dialog"], [role="alertdialog"]');
-          return { label: el?.getAttribute("aria-label") || el?.textContent?.trim().slice(0, 40) || el?.tagName || "", inDialog };
+    const results = [];
+    try {
+        const openDialogs = await page.evaluate(() => {
+            return Array.from(document.querySelectorAll('[role="dialog"], [role="alertdialog"]'))
+                .filter((el) => window.getComputedStyle(el).display !== 'none')
+                .map((el) => el.getAttribute('aria-label') || el.querySelector('[role="heading"]')?.textContent?.trim() || 'dialog');
         });
-        sampled.push(focused.label);
-        if (!focused.inDialog) {
-          allInside = false;
-          break;
+        for (const dialogLabel of openDialogs.slice(0, 3)) {
+            const sampled = [];
+            let allInside = true;
+            for (let i = 0; i < 8; i++) {
+                await page.keyboard.press('Tab');
+                await page.waitForTimeout(80);
+                const focused = await page.evaluate(() => {
+                    const el = document.activeElement;
+                    const inDialog = !!el?.closest('[role="dialog"], [role="alertdialog"]');
+                    return { label: el?.getAttribute('aria-label') || el?.textContent?.trim().slice(0, 40) || el?.tagName || '', inDialog };
+                });
+                sampled.push(focused.label);
+                if (!focused.inDialog) {
+                    allInside = false;
+                    break;
+                }
+            }
+            results.push({ modalTrigger: dialogLabel, focusTrapped: allInside, sampledFocused: sampled });
         }
-      }
-      results.push({ modalTrigger: dialogLabel, focusTrapped: allInside, sampledFocused: sampled });
     }
-  } catch {
-  }
-  return results;
+    catch { /* non-fatal */ }
+    return results;
 }
+/** Click each visible tab and record the panel content revealed. */
 async function probeTabPanels(page) {
-  const results = [];
-  try {
-    const tabs = await page.$$('[role="tab"]:not([aria-disabled="true"])');
-    for (const tab of tabs.slice(0, 10)) {
-      try {
-        const tabLabel = await tab.evaluate((el) => el.innerText?.trim() || el.getAttribute("aria-label") || "");
-        if (!tabLabel) continue;
-        await tab.click({ timeout: 1e3 });
-        await page.waitForTimeout(400);
-        const panelContent = await page.evaluate(() => {
-          const panel = document.querySelector('[role="tabpanel"]:not([hidden])');
-          if (!panel) return null;
-          const style = window.getComputedStyle(panel);
-          if (style.display === "none" || style.visibility === "hidden") return null;
-          return {
-            heading: panel.querySelector("h2,h3,h4")?.textContent?.trim() ?? "",
-            content: panel.innerText?.replace(/\s+/g, " ").trim().slice(0, 400) ?? ""
-          };
-        });
-        if (panelContent?.content && panelContent.content.length > 15) {
-          results.push({ tabLabel: tabLabel.slice(0, 60), panelContent: panelContent.content, panelHeading: panelContent.heading || void 0 });
+    const results = [];
+    try {
+        const tabs = await page.$$('[role="tab"]:not([aria-disabled="true"])');
+        for (const tab of tabs.slice(0, 10)) {
+            try {
+                const tabLabel = await tab.evaluate((el) => el.innerText?.trim() || el.getAttribute('aria-label') || '');
+                if (!tabLabel)
+                    continue;
+                await tab.click({ timeout: 1000 });
+                await page.waitForTimeout(400);
+                const panelContent = await page.evaluate(() => {
+                    const panel = document.querySelector('[role="tabpanel"]:not([hidden])');
+                    if (!panel)
+                        return null;
+                    const style = window.getComputedStyle(panel);
+                    if (style.display === 'none' || style.visibility === 'hidden')
+                        return null;
+                    return {
+                        heading: panel.querySelector('h2,h3,h4')?.textContent?.trim() ?? '',
+                        content: panel.innerText?.replace(/\s+/g, ' ').trim().slice(0, 400) ?? '',
+                    };
+                });
+                if (panelContent?.content && panelContent.content.length > 15) {
+                    results.push({ tabLabel: tabLabel.slice(0, 60), panelContent: panelContent.content, panelHeading: panelContent.heading || undefined });
+                }
+            }
+            catch { /* this tab failed, try next */ }
         }
-      } catch {
-      }
     }
-  } catch {
-  }
-  return results;
+    catch { /* non-fatal */ }
+    return results;
 }
+/** Hover elements with title/aria-describedby to capture tooltip text. */
 async function probeTooltips(page) {
-  const results = [];
-  try {
-    const candidates = await page.evaluate(() => {
-      return Array.from(document.querySelectorAll('[title], [aria-describedby], [data-tooltip], [data-tip], [class*="tooltip" i]')).filter((el) => {
-        const style = window.getComputedStyle(el);
-        return style.display !== "none" && style.visibility !== "hidden";
-      }).slice(0, 8).map((el) => ({
-        label: el.innerText?.trim().slice(0, 60) || el.getAttribute("aria-label") || "",
-        title: el.getAttribute("title") || "",
-        describedBy: el.getAttribute("aria-describedby") || "",
-        selector: el.tagName.toLowerCase() + (el.id ? `#${el.id}` : "")
-      }));
-    });
-    for (const c of candidates) {
-      try {
-        if (c.title && c.title.length > 5) {
-          results.push({ triggerLabel: c.label || c.selector, tooltipText: c.title.slice(0, 200) });
-          continue;
-        }
-        if (c.describedBy) {
-          const tooltipText = await page.evaluate((id) => document.getElementById(id)?.textContent?.trim() ?? "", c.describedBy);
-          if (tooltipText && tooltipText.length > 5) {
-            results.push({ triggerLabel: c.label || c.selector, tooltipText: tooltipText.slice(0, 200) });
-          }
+    const results = [];
+    try {
+        const candidates = await page.evaluate(() => {
+            return Array.from(document.querySelectorAll('[title], [aria-describedby], [data-tooltip], [data-tip], [class*="tooltip" i]'))
+                .filter((el) => {
+                const style = window.getComputedStyle(el);
+                return style.display !== 'none' && style.visibility !== 'hidden';
+            })
+                .slice(0, 8)
+                .map((el) => ({
+                label: el.innerText?.trim().slice(0, 60) || el.getAttribute('aria-label') || '',
+                title: el.getAttribute('title') || '',
+                describedBy: el.getAttribute('aria-describedby') || '',
+                selector: el.tagName.toLowerCase() + (el.id ? `#${el.id}` : ''),
+            }));
+        });
+        for (const c of candidates) {
+            try {
+                // Prefer title attribute directly — no need to hover for static tooltips
+                if (c.title && c.title.length > 5) {
+                    results.push({ triggerLabel: c.label || c.selector, tooltipText: c.title.slice(0, 200) });
+                    continue;
+                }
+                if (c.describedBy) {
+                    const tooltipText = await page.evaluate((id) => document.getElementById(id)?.textContent?.trim() ?? '', c.describedBy);
+                    if (tooltipText && tooltipText.length > 5) {
+                        results.push({ triggerLabel: c.label || c.selector, tooltipText: tooltipText.slice(0, 200) });
+                    }
+                }
+            }
+            catch { /* skip this element */ }
         }
-      } catch {
-      }
     }
-  } catch {
-  }
-  return results;
+    catch { /* non-fatal */ }
+    return results;
 }
-async function probeKeyboardNav(page) {
-  const sequence = [];
-  const issues = [];
-  const seenKeys = /* @__PURE__ */ new Set();
-  let firstKey = null;
-  for (let i = 0; i < 50; i++) {
-    await page.keyboard.press("Tab");
-    const el = await page.evaluate(() => {
-      const active = document.activeElement;
-      if (!active || active === document.body) return null;
-      const outline = window.getComputedStyle(active).outline;
-      return {
-        tag: active.tagName.toLowerCase(),
-        role: active.getAttribute("role"),
-        ariaLabel: active.getAttribute("aria-label"),
-        text: (active.innerText ?? "").trim().slice(0, 60) || null,
-        outline,
-        tabIndex: active.tabIndex ?? null
-      };
-    });
-    if (!el) break;
-    const hasFocusIndicator = el.outline !== "none" && el.outline !== "" && !el.outline.startsWith("0px") && !el.outline.startsWith("rgba(0, 0, 0, 0)") && !el.outline.startsWith("rgba(0,0,0,0)");
-    const focusable = {
-      tag: el.tag,
-      role: el.role,
-      ariaLabel: el.ariaLabel,
-      text: el.text,
-      hasFocusIndicator,
-      tabIndex: el.tabIndex
+/**
+ * Probe keyboard navigation accessibility by pressing Tab up to 50 times and
+ * recording each focused element's properties and focus-indicator visibility.
+ * Stops early if focus wraps back to the start or hits the same element twice.
+ */
+export async function probeKeyboardNav(page) {
+    const sequence = [];
+    const issues = [];
+    const seenKeys = new Set();
+    let firstKey = null;
+    for (let i = 0; i < 50; i++) {
+        await page.keyboard.press('Tab');
+        const el = await page.evaluate(() => {
+            const active = document.activeElement;
+            if (!active || active === document.body)
+                return null;
+            const outline = window.getComputedStyle(active).outline;
+            return {
+                tag: active.tagName.toLowerCase(),
+                role: active.getAttribute('role'),
+                ariaLabel: active.getAttribute('aria-label'),
+                text: (active.innerText ?? '').trim().slice(0, 60) || null,
+                outline,
+                tabIndex: active.tabIndex ?? null,
+            };
+        });
+        if (!el)
+            break;
+        const hasFocusIndicator = el.outline !== 'none' &&
+            el.outline !== '' &&
+            !el.outline.startsWith('0px') &&
+            !el.outline.startsWith('rgba(0, 0, 0, 0)') &&
+            !el.outline.startsWith('rgba(0,0,0,0)');
+        const focusable = {
+            tag: el.tag,
+            role: el.role,
+            ariaLabel: el.ariaLabel,
+            text: el.text,
+            hasFocusIndicator,
+            tabIndex: el.tabIndex,
+        };
+        const key = `${el.tag}|${el.text ?? ''}|${el.role ?? ''}`;
+        if (i === 0) {
+            firstKey = key;
+        }
+        else if (key === firstKey || seenKeys.has(key)) {
+            // Focus wrapped back to start or hit a duplicate — stop probing
+            break;
+        }
+        seenKeys.add(key);
+        sequence.push(focusable);
+        if (!hasFocusIndicator) {
+            issues.push(`Element #${i + 1} (${el.tag}) has no visible focus indicator`);
+        }
+    }
+    return {
+        focusableCount: sequence.length,
+        elementsWithNoFocusIndicator: issues.length,
+        sequence,
+        issues,
     };
-    const key = `${el.tag}|${el.text ?? ""}|${el.role ?? ""}`;
-    if (i === 0) {
-      firstKey = key;
-    } else if (key === firstKey || seenKeys.has(key)) {
-      break;
-    }
-    seenKeys.add(key);
-    sequence.push(focusable);
-    if (!hasFocusIndicator) {
-      issues.push(`Element #${i + 1} (${el.tag}) has no visible focus indicator`);
-    }
-  }
-  return {
-    focusableCount: sequence.length,
-    elementsWithNoFocusIndicator: issues.length,
-    sequence,
-    issues
-  };
 }
-export {
-  probeAllScreens,
-  probeKeyboardNav,
-  probeResultToMarkdown,
-  probeResultToObservations,
-  probeScreen
-};
-//# sourceMappingURL=interactive-probe.js.map