halo-agent 2.0.9 → 2.1.0

package/detectFormErrors.js

@@ -46,7 +46,32 @@ const BANNER_PATTERNS = [
   /please\s*review/i,
 ];
 
+// Embedded ATS hosts whose forms (and their validation errors) live inside
+// an iframe. Errors must be scanned in that frame, not just the top page.
+const DFE_EMBED_HOSTS = /(greenhouse\.io|lever\.co|ashbyhq\.com|myworkdayjobs\.com|icims\.com|smartrecruiters\.com|jobvite\.com|workable\.com|bamboohr\.com)/i;
+
 async function detectFormErrors(page) {
+  // Scan the top frame + any embedded ATS frame, merge results. Embedded
+  // forms (Orion → greenhouse.io iframe) render their "X is required"
+  // errors inside the frame, so a top-only scan would see a clean page and
+  // wrongly conclude the submit succeeded.
+  const roots = [page, ...page.frames().filter((f) => {
+    const u = f.url();
+    return f !== page.mainFrame() && u && DFE_EMBED_HOSTS.test(u) && !/google\.com|gstatic\.com|recaptcha/i.test(u);
+  })];
+  let merged = { hasErrors: false, errorBanner: null, invalidFields: [] };
+  for (const root of roots) {
+    const r = await detectFormErrorsInRoot(root).catch(() => null);
+    if (r) {
+      merged.hasErrors = merged.hasErrors || r.hasErrors;
+      merged.errorBanner = merged.errorBanner || r.errorBanner;
+      merged.invalidFields.push(...(r.invalidFields || []));
+    }
+  }
+  return merged;
+}
+
+async function detectFormErrorsInRoot(page) {
   return await page.evaluate(({ fieldPatterns, bannerPatterns }) => {
     const fp = fieldPatterns.map((s) => new RegExp(s.source, s.flags));
     const bp = bannerPatterns.map((s) => new RegExp(s.source, s.flags));

package/filler.js

@@ -1157,16 +1157,25 @@ async function findSubmitButton(page) {
     'button[type="submit"]',
     'form button:last-of-type',
   ];
-  for (const sel of selectors) {
-    try {
-      const el = page.locator(sel).first();
-      if (await el.isVisible({ timeout: 500 })) {
-        // Skip if it looks like a Next/Continue button
-        const text = (await el.textContent().catch(() => '')).toLowerCase().trim();
-        if (text.includes('next') || text.includes('continue') || text.includes('save and') || text.includes('save &')) continue;
-        return el;
-      }
-    } catch {}
+  // Search the top frame first, then any embedded ATS frame. Embedded
+  // Greenhouse/Lever forms put the Submit button INSIDE the iframe, so a
+  // top-frame-only search returns null and the orchestrator can't submit.
+  const EMBED_HOSTS = /(greenhouse\.io|lever\.co|ashbyhq\.com|myworkdayjobs\.com|icims\.com|smartrecruiters\.com|jobvite\.com|workable\.com|bamboohr\.com)/i;
+  const roots = [page, ...page.frames().filter((f) => {
+    const u = f.url();
+    return f !== page.mainFrame() && u && EMBED_HOSTS.test(u) && !/google\.com|gstatic\.com|recaptcha/i.test(u);
+  })];
+  for (const root of roots) {
+    for (const sel of selectors) {
+      try {
+        const el = root.locator(sel).first();
+        if (await el.isVisible({ timeout: 500 })) {
+          const text = (await el.textContent().catch(() => '')).toLowerCase().trim();
+          if (text.includes('next') || text.includes('continue') || text.includes('save and') || text.includes('save &')) continue;
+          return el;
+        }
+      } catch {}
+    }
   }
   return null;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "halo-agent",
-  "version": "2.0.9",
+  "version": "2.1.0",
   "description": "HALO local apply agent — auto-fills job applications using your real Chrome session",
   "main": "index.js",
   "bin": {

package/scanAccessibility.js

@@ -357,8 +357,148 @@ function pickDescription(f) {
   return (f.description || (f.rawName && f.placeholder ? f.placeholder : '')).trim();
 }
 
+// ── Frame DOM scanner (for embedded/cross-origin ATS iframes) ─────────────────
+
+/**
+ * The AX-tree path (Accessibility.getFullAXTree on the main page) does NOT
+ * cross into cross-origin iframes. Many companies embed Greenhouse/Lever
+ * forms via job-boards.greenhouse.io/embed/job_app on their own careers
+ * domain — the fields live entirely inside that cross-origin frame, so the
+ * main scan returns 0 real fields (the Orion case: 41 elements, all chrome).
+ *
+ * This scanner runs a self-contained DOM walk INSIDE a given frame and
+ * produces the same field shape the AX path does (mmid, role, label,
+ * options, etc). Each field is tagged with frameUrl so the executor can
+ * locate it via page.frameLocator(...) instead of page.locator(...).
+ *
+ * We inject mmid here too (the frame's own elements), so the executor's
+ * `[mmid="N"]` selector works within the frame.
+ */
+async function scanFrameDom(frame, frameUrl) {
+  const raw = await frame.evaluate(({ mmidAttr }) => {
+    function safeText(t) { return (t || '').replace(/\s+/g, ' ').trim(); }
+    function cssEscape(s) {
+      try { return CSS.escape(s); } catch { return String(s).replace(/([!"#$%&'()*+,.\/:;<=>?@\[\\\]^`{|}~])/g, '\\$1'); }
+    }
+    // Label resolver — same ladder the old scanPage used: label[for], aria,
+    // parent heading/legend walk, placeholder/name fallback.
+    function getLabel(el) {
+      if (el.id) {
+        const lbl = document.querySelector(`label[for="${cssEscape(el.id)}"]`);
+        if (lbl) return safeText(lbl.textContent).replace(/\*$/, '').trim();
+      }
+      if (el.labels && el.labels[0]) return safeText(el.labels[0].textContent).replace(/\*$/, '').trim();
+      const al = el.getAttribute('aria-label'); if (al) return al.trim();
+      const alb = el.getAttribute('aria-labelledby');
+      if (alb) {
+        const t = alb.split(/\s+/).map((id) => document.getElementById(id)).filter(Boolean).map((e) => safeText(e.textContent)).join(' ').trim();
+        if (t) return t;
+      }
+      let p = el.parentElement, hops = 0;
+      while (p && hops < 8) {
+        const lbl = p.querySelector('label, legend, h2, h3, h4');
+        if (lbl && !lbl.contains(el)) { const t = safeText(lbl.textContent).replace(/\*$/, '').trim(); if (t && t.length < 200) return t; }
+        p = p.parentElement; hops++;
+      }
+      return el.placeholder || el.getAttribute('aria-label') || el.name || el.id || '';
+    }
+
+    const out = [];
+    const seen = new Set();
+    let n = Math.floor(Math.random() * 800000) + 200000; // high offset, no main-frame collision
+
+    const sel = 'input,textarea,select,[contenteditable="true"],[role="textbox"],[role="combobox"],[role="listbox"],[role="radio"],[role="checkbox"],[role="switch"],[role="button"],button[type="submit"]';
+    document.querySelectorAll(sel).forEach((el) => {
+      const tag = el.tagName.toLowerCase();
+      const type = (el.type || '').toLowerCase();
+      if (['hidden', 'image', 'reset'].includes(type)) return;
+      // Visibility check (allow styled-hidden radio/checkbox/file)
+      if (!['radio', 'checkbox', 'file'].includes(type)) {
+        const r = el.getBoundingClientRect();
+        if (r.width === 0 && r.height === 0) return;
+        if (el.offsetParent === null && !el.closest('[role="dialog"]')) return;
+      }
+      n += 1; const id = String(n);
+      el.setAttribute(mmidAttr, id);
+
+      const label = getLabel(el);
+      const role = (el.getAttribute('role') || '').toLowerCase();
+      const isCE = el.isContentEditable || false;
+      // dedup
+      const key = el.id || el.name || (label + ':' + type) || el.outerHTML.slice(0, 60);
+      if (seen.has(key)) return;
+      seen.add(key);
+
+      let selectorHint = `[${mmidAttr}="${id}"]`;
+      if (el.id) selectorHint = `#${cssEscape(el.id)}`;
+      else if (el.name) selectorHint = `${tag}[name="${el.name.replace(/"/g, '\\"')}"]`;
+
+      // value (checkbox/radio use checked)
+      let currentValue = '';
+      if (type === 'checkbox' || type === 'radio') currentValue = el.checked ? 'checked' : '';
+      else currentValue = (el.value || (isCE ? safeText(el.innerText) : '') || '').trim();
+
+      // native select options
+      let options = null;
+      if (tag === 'select' && el.options) {
+        options = Array.from(el.options).map((o) => safeText(o.text)).filter(Boolean);
+      }
+
+      // typeahead / react-select heuristics
+      const isTypeahead = !!(
+        el.getAttribute('aria-autocomplete') === 'list' ||
+        el.getAttribute('aria-haspopup') === 'listbox' ||
+        el.closest('[role="combobox"]') ||
+        el.closest('[class*="select__"]') ||
+        Array.from((el.closest('div') || el.parentElement || document).querySelectorAll('button,a')).some((b) => /locate\s*me/i.test(b.textContent || ''))
+      );
+
+      out.push({
+        mmid: id,
+        tag, inputType: type, role,
+        label,
+        selectorHint,
+        currentValue,
+        options,
+        isTypeahead,
+        isContentEditable: isCE,
+        textContent: safeText(el.innerText || el.textContent || '').slice(0, 120),
+        // react-select inputs report role=combobox; mark them combobox so
+        // the executor uses the dropdown path.
+        forceRole: el.closest('[class*="select__control"]') ? 'combobox' : null,
+      });
+    });
+    return out;
+  }, { mmidAttr: MMID_ATTR }).catch((e) => {
+    console.warn(`[scanAx] frame DOM scan failed for ${frameUrl}: ${e.message}`);
+    return [];
+  });
+
+  // Normalize to the public field shape, tagging frameUrl for the executor.
+  return raw.map((f) => ({
+    mmid: f.mmid,
+    role: f.forceRole || normalizeRole(f),
+    label: f.label || f.textContent || '',
+    description: '',
+    required: false,
+    disabled: false,
+    options: f.options || null,
+    selectorHint: f.selectorHint,
+    inputType: f.inputType,
+    currentValue: f.currentValue,
+    isTypeahead: f.isTypeahead,
+    groupLabel: null,
+    textContent: f.textContent,
+    filledAlready: !!(f.currentValue && f.currentValue.length > 0),
+    frameUrl, // ← executor uses this to scope via frameLocator
+  }));
+}
+
 // ── Public entry point ───────────────────────────────────────────────────────
 
+// Frames whose forms we should DOM-scan independently (cross-origin embeds).
+const EMBED_FRAME_HOSTS = /(greenhouse\.io|lever\.co|ashbyhq\.com|myworkdayjobs\.com|icims\.com|smartrecruiters\.com|jobvite\.com|workable\.com|bamboohr\.com)/i;
+
 /**
  * Main scanner. Returns a flat list of fields the LLM planner can plan over.
  * Iterates same-origin frames so iCIMS/Workday iframes don't get missed.
@@ -378,43 +518,30 @@ async function scanAccessibility(page) {
       // once (on the main page) and reconcile against all frames' DOMs.
       const isMain = ctx === page || ctx === page.mainFrame?.();
 
-      const injected = await (isMain
-        ? injectMmid(page)
-        : ctx.evaluate(({ mmidAttr, handleAttr }) => {
-            const sel = 'input,textarea,select,[contenteditable="true"],[role="textbox"],[role="combobox"],[role="listbox"],[role="radiogroup"],[role="radio"],[role="checkbox"],[role="switch"],[role="button"],[role="option"],button[type="submit"],a[href]';
-            // Continue numbering from a high offset so frames don't collide
-            // with main-frame ids. 100000 * frame index is plenty.
-            let n = Math.floor(Math.random() * 90000) + 100000;
-            const all = document.querySelectorAll(sel);
-            all.forEach((el) => {
-              n += 1; const id = String(n);
-              el.setAttribute(mmidAttr, id);
-              const prev = el.getAttribute(handleAttr);
-              if (prev && !el.hasAttribute('data-orig-aria-keyshortcuts')) {
-                el.setAttribute('data-orig-aria-keyshortcuts', prev);
-              }
-              el.setAttribute(handleAttr, id);
-            });
-            return all.length;
-          }, { mmidAttr: MMID_ATTR, handleAttr: HANDLE_ATTR }));
-
-      if (!injected || injected === 0) continue;
-
-      // Only the main page can drive CDP; for frames, AX is reachable from
-      // the same root tree fetched on the main page (it includes all frame
-      // subtrees). Skip the per-frame fetch.
-      if (!isMain) {
-        // For frames, just enrich DOM — we'll re-run reconcile after the
-        // main-page AX fetch. Stash the frame's DOM data only.
-        // (Simpler: skip frames entirely in v1 — the main-frame AX tree
-        // doesn't include cross-realm frame nodes anyway.)
-        continue;
+      if (isMain) {
+        // Main frame: AX-tree path (best label quality).
+        const injected = await injectMmid(page);
+        if (!injected || injected === 0) continue;
+        const axNodes = await fetchAxTree(page);
+        const axFields = reconcile(axNodes);
+        const enriched = await enrichFromDom(page, axFields);
+        allFields.push(...enriched);
+      } else {
+        // Non-main frame: only DOM-scan it if it's a known ATS embed frame
+        // (greenhouse/lever/ashby/etc). Skipping frames was the v1
+        // simplification that broke embedded forms — the Orion case had
+        // ALL fields inside the greenhouse.io embed iframe, so the main
+        // scan found 0 real fields. Now we scan that frame independently
+        // and tag each field with frameUrl so the executor scopes to it.
+        const fUrl = ctx.url();
+        if (fUrl && EMBED_FRAME_HOSTS.test(fUrl) && !/google\.com|gstatic\.com|recaptcha/i.test(fUrl)) {
+          const frameFields = await scanFrameDom(ctx, fUrl);
+          if (frameFields.length > 0) {
+            console.log(`[scanAx] embedded ATS frame: ${frameFields.length} fields from ${fUrl.slice(0, 60)}`);
+            allFields.push(...frameFields);
+          }
+        }
       }
-
-      const axNodes = await fetchAxTree(page);
-      const axFields = reconcile(axNodes);
-      const enriched = await enrichFromDom(page, axFields);
-      allFields.push(...enriched);
     } catch (e) {
       console.warn(`[scanAx] Frame scan failed: ${e.message}`);
     }
@@ -426,6 +553,20 @@ async function scanAccessibility(page) {
   for (const f of allFields) {
     if (seen.has(f.mmid)) continue;
     seen.add(f.mmid);
+
+    // Frame-DOM fields are ALREADY normalized (scanFrameDom produced the
+    // public shape: role/label/options as strings). Re-running pickLabel /
+    // normalizeRole / options.map(o=>o.label) on them would break (those
+    // expect the raw AX-field shape). Pass them through, applying only the
+    // Remove-chip filter.
+    if (f.frameUrl) {
+      const fl = (f.label || '').trim();
+      if (f.role === 'button' && (/^remove\s+\S/i.test(fl) || /^clear\s+selection/i.test(fl) || fl === '×' || fl === '✕' || fl === 'x')) continue;
+      if (!fl && !['button', 'link'].includes(f.role)) continue;
+      out.push(f); // already in public shape, carries frameUrl
+      continue;
+    }
+
     const label = pickLabel(f);
     // Filter noise: no label AND no visible role → skip
     if (!label && !['button', 'link'].includes(normalizeRole(f))) continue;
@@ -460,6 +601,7 @@ async function scanAccessibility(page) {
       textContent: f.textContent,
       // Already-filled hint so the planner can skip
       filledAlready: !!(f.currentValue && f.currentValue.length > 0),
+      frameUrl: null, // main-frame field
     });
   }
 

package/smartFill.js

@@ -33,17 +33,32 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
 
   const labelShort = (field.label || field.selectorHint || '?').slice(0, 50);
 
+  // Resolve the LOCATOR ROOT. For fields inside an embedded ATS iframe
+  // (field.frameUrl set), the element lives in that frame, not the top
+  // page — so locating via page.locator() would never find it. Find the
+  // matching Playwright Frame and use IT as the root. Frame exposes
+  // .locator() exactly like Page, so all downstream helpers work; only
+  // page.keyboard stays on the top-level page (keyboard events target the
+  // focused element regardless of frame, so that's fine).
+  let root = page;
+  if (field.frameUrl) {
+    const frame = page.frames().find((fr) => fr.url() === field.frameUrl)
+      || page.frames().find((fr) => fr.url() && field.frameUrl && fr.url().split('?')[0] === field.frameUrl.split('?')[0]);
+    if (frame) root = frame;
+    else return { ok: false, reason: `embed frame gone (${(field.frameUrl || '').slice(0, 50)})` };
+  }
+
   // Re-locate the element via the mmid attribute (the executor's anchor).
   // Falls back to selectorHint if mmid was wiped (rare; happens on full
   // re-renders between scan and execute).
-  let locator = page.locator(`[mmid="${item.mmid}"]`).first();
+  let locator = root.locator(`[mmid="${item.mmid}"]`).first();
   let visible = await locator.isVisible({ timeout: 800 }).catch(() => false);
   if (!visible && field.selectorHint) {
-    locator = page.locator(field.selectorHint).first();
+    locator = root.locator(field.selectorHint).first();
     visible = await locator.isVisible({ timeout: 800 }).catch(() => false);
   }
   if (!visible) {
-    return { ok: false, reason: `element not visible (mmid=${item.mmid})` };
+    return { ok: false, reason: `element not visible (mmid=${item.mmid}${field.frameUrl ? ', in-frame' : ''})` };
   }
 
   switch (item.action) {
@@ -63,7 +78,7 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
       // hidden until clicked) and fell back to type. Recover by treating
       // it as click_option.
       if (field.role === 'combobox' || field.role === 'listbox') {
-        const result = await openAndPickOption(page, locator, item.value, {
+        const result = await openAndPickOption(root, locator, item.value, {
           config: ctx.config, jobId: ctx.jobId, label: field.label,
         });
         if (result.ok) return result;
@@ -72,9 +87,9 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
       }
       // Typeahead path: open suggestion list, pick first match.
       if (field.isTypeahead) {
-        return await typeAndPickSuggestion(page, locator, item.value);
+        return await typeAndPickSuggestion(root, locator, item.value);
       }
-      return await reactSafeType(page, locator, item.value);
+      return await reactSafeType(root, locator, item.value);
     }
 
     case 'select_option': {
@@ -91,7 +106,7 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
     }
 
     case 'click_option': {
-      return await openAndPickOption(page, locator, item.value, {
+      return await openAndPickOption(root, locator, item.value, {
         config: ctx.config, jobId: ctx.jobId, label: field.label,
       });
     }
@@ -114,14 +129,14 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
         // Strategy 1: native radio with name= — find by name + label match.
         const name = field.name;
         if (name) {
-          const group = page.locator(`input[type="radio"][name="${name}"]`);
+          const group = root.locator(`input[type="radio"][name="${name}"]`);
           const gc = await group.count();
           for (let i = 0; i < gc; i++) {
             const rad = group.nth(i);
             const id = await rad.getAttribute('id').catch(() => null);
             let lbl = '';
             if (id) {
-              lbl = (await page.locator(`label[for="${id}"]`).first().textContent().catch(() => '') || '').trim();
+              lbl = (await root.locator(`label[for="${id}"]`).first().textContent().catch(() => '') || '').trim();
             }
             if (!lbl) lbl = (await rad.evaluate(el => el.value || '').catch(() => '') || '');
             if (lbl.toLowerCase().includes(String(item.value).toLowerCase())) {
@@ -132,7 +147,7 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
         }
         // Strategy 2: just click the labeled option directly (custom radios).
         const v = String(item.value);
-        const opt = page.locator(`[role="radio"]:has-text("${v}"), label:has-text("${v}")`).first();
+        const opt = root.locator(`[role="radio"]:has-text("${v}"), label:has-text("${v}")`).first();
         if (await opt.isVisible({ timeout: 800 }).catch(() => false)) {
           await opt.click({ timeout: 1500 });
           return { ok: true, reason: `radio (label): ${v}` };
@@ -206,7 +221,8 @@ async function executePlanItem(page, item, fieldByMmid, ctx) {
  * Returns null if this isn't an intl-tel-input field; otherwise the
  * fill result.
  */
-async function tryIntlTelCountry(page, triggerLocator, value) {
+async function tryIntlTelCountry(root, triggerLocator, value) {
+  const page = (root && typeof root.page === 'function') ? root.page() : root;
   try {
     // Detect intl-tel-input by looking for ANY characteristic class within
     // a reasonable ancestor radius. Newer versions (v18+) shifted from
@@ -259,7 +275,7 @@ async function tryIntlTelCountry(page, triggerLocator, value) {
 
     // Country items — try several known class patterns
     const itemSel = '.iti__country-list:visible .iti__country, .iti__dropdown-content .iti__country, [class*="country-list"] [class*="country-item"], [role="listbox"] [role="option"][class*="iti"]';
-    const items = page.locator(itemSel);
+    const items = root.locator(itemSel);
     const count = await items.count().catch(() => 0);
     if (count === 0) {
       await page.keyboard.press('Escape').catch(() => {});
@@ -313,7 +329,10 @@ async function tryIntlTelCountry(page, triggerLocator, value) {
  *
  * Returns null if this isn't a react-select field (so other handlers run).
  */
-async function tryReactSelect(page, triggerLocator, value) {
+async function tryReactSelect(root, triggerLocator, value) {
+  // root: Page or Frame. control/input/option locators must be scoped to
+  // root (in-frame for embedded forms); keyboard/waitForTimeout use Page.
+  const page = (root && typeof root.page === 'function') ? root.page() : root;
   try {
     // Detect: the trigger or an ancestor carries a .select__ class.
     const info = await triggerLocator.evaluate((el) => {
@@ -333,8 +352,8 @@ async function tryReactSelect(page, triggerLocator, value) {
     }).catch(() => null);
     if (!info) return null;
 
-    const control = page.locator(`[data-halo-rs="${info.cid}"]`).first();
-    const input = page.locator(`[data-halo-rs-input="${info.cid}"]`).first();
+    const control = root.locator(`[data-halo-rs="${info.cid}"]`).first();
+    const input = root.locator(`[data-halo-rs-input="${info.cid}"]`).first();
 
     // 1. Open: click the control. react-select opens the menu on control click.
     await control.click({ timeout: 2500 }).catch(() => {});
@@ -353,7 +372,7 @@ async function tryReactSelect(page, triggerLocator, value) {
     //    .select__option. Async (Places) options take longer — wait up to 2s.
     const optSel = '.select__option, [class*="select__option"], [id*="react-select"][id*="option"]';
     try {
-      await page.locator(optSel).first().waitFor({ state: 'visible', timeout: 2200 });
+      await root.locator(optSel).first().waitFor({ state: 'visible', timeout: 2200 });
     } catch {
       // No options appeared. For react-select, pressing Enter on a typed
       // value sometimes commits a free-text/create option. Try it, then
@@ -370,7 +389,7 @@ async function tryReactSelect(page, triggerLocator, value) {
     }
 
     // 4. Pick best option.
-    const opts = page.locator(optSel);
+    const opts = root.locator(optSel);
     const texts = await opts.allTextContents().catch(() => []);
     const tl = typed.toLowerCase();
     let idx = texts.findIndex((t) => t.toLowerCase().trim() === tl);
@@ -394,12 +413,13 @@ async function tryReactSelect(page, triggerLocator, value) {
   }
 }
 
-async function openAndPickOption(page, triggerLocator, value, llmCtx) {
-  // React-Select FIRST — Greenhouse uses it for every dropdown. The
-  // diagnostic confirmed Country + Location are both .select__ widgets.
-  // Returns null if not react-select, so other handlers still run.
+async function openAndPickOption(root, triggerLocator, value, llmCtx) {
+  // root: Page or Frame. .locator works on both; keyboard/waitForTimeout
+  // need the Page. For in-frame fields, option menus render inside the
+  // frame so root.locator finds them.
+  const page = (root && typeof root.page === 'function') ? root.page() : root;
   try {
-    const rs = await tryReactSelect(page, triggerLocator, value);
+    const rs = await tryReactSelect(root, triggerLocator, value);
     if (rs !== null) {
       if (rs.ok) return rs;
       // react-select detected but pick failed — log + fall through to the
@@ -410,7 +430,7 @@ async function openAndPickOption(page, triggerLocator, value, llmCtx) {
 
   try {
     // intl-tel-input special case (kept for forms that genuinely use it).
-    const itlResult = await tryIntlTelCountry(page, triggerLocator, value);
+    const itlResult = await tryIntlTelCountry(root, triggerLocator, value);
     if (itlResult !== null && itlResult.ok) return itlResult;
   } catch {}
 
@@ -431,7 +451,7 @@ async function openAndPickOption(page, triggerLocator, value, llmCtx) {
       return hasLocateMe || hasPacContainer || isPacInput;
     }).catch(() => false);
     if (isPac) {
-      const r = await typeAndPickSuggestion(page, triggerLocator, value);
+      const r = await typeAndPickSuggestion(root, triggerLocator, value);
       // If typeahead failed, fall through to the normal dropdown path
       // (some fields are both, weirdly)
       if (r.ok) return r;
@@ -446,7 +466,7 @@ async function openAndPickOption(page, triggerLocator, value, llmCtx) {
     //   .select__option — React-Select
     //   role=option     — ARIA-correct dropdowns
     const optionSel = '[role="option"], [role="menuitem"], .select__option, li[class*="option"], .pac-item, .iti__country';
-    const beforeCount = await page.locator(optionSel).count().catch(() => 0);
+    const beforeCount = await root.locator(optionSel).count().catch(() => 0);
 
     await triggerLocator.click({ timeout: 2500 });
     await page.waitForTimeout(350);
@@ -454,7 +474,7 @@ async function openAndPickOption(page, triggerLocator, value, llmCtx) {
     // Newly mounted options live at indexes >= beforeCount. If no new
     // ones appeared, the dropdown may have rendered options earlier
     // (already-open select). Fall through to scanning all visible.
-    const allOpts = page.locator(optionSel);
+    const allOpts = root.locator(optionSel);
     const totalCount = await allOpts.count().catch(() => 0);
     const newCount = totalCount - beforeCount;
 
@@ -553,7 +573,10 @@ async function openAndPickOption(page, triggerLocator, value, llmCtx) {
   }
 }
 
-async function reactSafeType(page, locator, value) {
+async function reactSafeType(root, locator, value) {
+  // root may be a Page or a Frame. keyboard/waitForTimeout live on Page;
+  // Frame exposes .page() to reach it. locator() works on both.
+  const page = (root && typeof root.page === 'function') ? root.page() : root;
   const v = String(value);
   try {
     await locator.fill(v, { timeout: 4000 });
@@ -586,7 +609,10 @@ async function reactSafeType(page, locator, value) {
 /**
  * Type-and-pick for typeahead inputs (Greenhouse Location etc).
  */
-async function typeAndPickSuggestion(page, locator, value) {
+async function typeAndPickSuggestion(root, locator, value) {
+  // root: Page or Frame. Option lists for an in-frame field render inside
+  // that frame, so they must be located via root, not the top page.
+  const page = (root && typeof root.page === 'function') ? root.page() : root;
   try {
     await locator.click({ timeout: 2000 });
     await locator.press('Meta+A').catch(() => locator.press('Control+A')).catch(() => {});
@@ -613,13 +639,13 @@ async function typeAndPickSuggestion(page, locator, value) {
     // to 1.5s additional. waitFor errors if nothing appears — that's the
     // signal that the field accepted free text instead.
     try {
-      await page.locator(optionSel).first().waitFor({ state: 'visible', timeout: 1500 });
+      await root.locator(optionSel).first().waitFor({ state: 'visible', timeout: 1500 });
     } catch {
       const got = await locator.inputValue({ timeout: 800 }).catch(() => null);
       if (got && got.trim()) return { ok: true, reason: `typeahead (no suggestion, accepted): "${value.slice(0, 30)}"` };
       return { ok: false, reason: 'typeahead opened no suggestions' };
     }
-    const opts = page.locator(optionSel);
+    const opts = root.locator(optionSel);
     const count = await opts.count().catch(() => 0);
     if (count === 0) {
       const got = await locator.inputValue({ timeout: 800 }).catch(() => null);