pi-browser-harness 0.8.3 → 0.9.0

package/src/client.ts

@@ -16,10 +16,12 @@ export type BrowserClientOptions = {
   readonly initialOwnership?: {
     readonly ownedTargetIds?: ReadonlyArray<string>;
     readonly harnessWindowTargetId?: string;
+    readonly harnessWindowId?: number;
   };
   readonly onOwnershipChange?: (snapshot: {
     readonly ownedTargetIds: ReadonlyArray<string>;
     readonly harnessWindowTargetId: string | undefined;
+    readonly harnessWindowId: number | undefined;
   }) => void;
 };
 
@@ -32,6 +34,9 @@ export type BrowserClient = {
   /** Detach from the current page target (removes the "Chrome is being controlled" banner)
    *  while keeping the transport connection alive. Call on session shutdown. */
   detach(): Promise<void>;
+  /** Close every tab this session owns and clear the window binding. Best-effort —
+   *  used on session shutdown so no stale harness tabs survive. */
+  closeOwnedTabs(): Promise<void>;
   evaluateJs(expression: string, sessionId?: string): Promise<Result<unknown, CdpError>>;
   pageInfo(): Promise<Result<PageInfo | { readonly dialog: DialogInfo }, CdpError>>;
   takeDialog(): DialogInfo | null;
@@ -82,13 +87,16 @@ const parsePageInfoPayload = (v: unknown): Result<PageInfo, CdpError> => {
 
 export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient => {
   const transport = opts.transport ?? createCdpTransport();
-  const ownershipInit: { ownedTargetIds?: ReadonlyArray<string>; harnessWindowTargetId?: string } = {};
+  const ownershipInit: { ownedTargetIds?: ReadonlyArray<string>; harnessWindowTargetId?: string; harnessWindowId?: number } = {};
   if (opts.initialOwnership?.ownedTargetIds !== undefined) {
     ownershipInit.ownedTargetIds = opts.initialOwnership.ownedTargetIds;
   }
   if (opts.initialOwnership?.harnessWindowTargetId !== undefined) {
     ownershipInit.harnessWindowTargetId = opts.initialOwnership.harnessWindowTargetId;
   }
+  if (opts.initialOwnership?.harnessWindowId !== undefined) {
+    ownershipInit.harnessWindowId = opts.initialOwnership.harnessWindowId;
+  }
   const ownership = createOwnershipRegistry(ownershipInit);
   if (opts.onOwnershipChange) {
     const cb = opts.onOwnershipChange;
@@ -96,6 +104,7 @@ export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient =
       cb({
         ownedTargetIds: ownership.list(),
         harnessWindowTargetId: ownership.harnessWindow(),
+        harnessWindowId: ownership.harnessWindowId(),
       });
     });
   }
@@ -256,6 +265,15 @@ export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient =
     return ok(undefined);
   };
 
+  // Ask Chrome for the real windowId hosting a target. Undefined on failure —
+  // callers treat the window binding as best-effort.
+  const getWindowId = async (targetId: string): Promise<number | undefined> => {
+    const r = await session.callBrowser("Browser.getWindowForTarget", { targetId });
+    if (!r.success) return undefined;
+    const wid = (r.data as { windowId?: number }).windowId;
+    return typeof wid === "number" ? wid : undefined;
+  };
+
   const newTab = async (url?: string): Promise<Result<string, CdpError>> => {
     // Verify the recorded harness window still exists. Querying the live
     // target list also gives listTabs's reconciliation a chance to run.
@@ -263,22 +281,35 @@ export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient =
     if (!tabsResult.success) return tabsResult;
     const live = new Set(tabsResult.data.map((t) => t.targetId));
     const hw = ownership.harnessWindow();
+    // Pick an opener that keeps us inside the harness window. Prefer the seed
+    // tab; if the user closed it but other owned tabs survive, reuse one of
+    // those instead of spawning a second window (avoids window scatter).
+    const opener = hw && live.has(hw)
+      ? hw
+      : ownership.list().find((id) => live.has(id));
 
     const params: Record<string, unknown> = { url: "about:blank" };
-    if (hw && live.has(hw)) {
-      // Open as a child of the harness window's seed tab — Chrome places
-      // it in the same window, giving us visual grouping for free.
-      params["openerId"] = hw;
+    if (opener) {
+      // Open as a child of an owned tab — Chrome places it in the same window,
+      // giving us visual grouping for free and keeping the session single-window.
+      params["openerId"] = opener;
     } else {
-      // Either fresh session or the harness window was closed by the user.
-      // Spawn a new dedicated window.
+      // Fresh session, or the whole harness window was closed by the user.
+      // Spawn a new dedicated window and rebind to it.
       params["newWindow"] = true;
     }
     const created = await session.callBrowser("Target.createTarget", params);
     if (!created.success) return created;
     const c = created.data as { targetId: string };
 
-    if (params["newWindow"]) ownership.setHarnessWindow(c.targetId);
+    if (params["newWindow"]) {
+      ownership.setHarnessWindow(c.targetId);
+      const wid = await getWindowId(c.targetId);
+      if (wid !== undefined) ownership.setHarnessWindowId(wid);
+    } else if (opener && opener !== hw) {
+      // Re-seeded onto a surviving owned tab; keep the seed pointer live.
+      ownership.setHarnessWindow(opener);
+    }
     ownership.add(c.targetId);
 
     const switched = await switchTab(c.targetId);
@@ -297,6 +328,18 @@ export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient =
     return ok(undefined);
   };
 
+  const closeOwnedTabs = async (): Promise<void> => {
+    // Snapshot first — remove() mutates the list, and targetDestroyed events
+    // may also prune concurrently. Failures are swallowed: a tab the user
+    // already closed, or a dead transport, must not block shutdown.
+    for (const id of ownership.list()) {
+      await session.callBrowser("Target.closeTarget", { targetId: id }).catch(() => {});
+      ownership.remove(id);
+    }
+    ownership.setHarnessWindow(undefined);
+    ownership.setHarnessWindowId(undefined);
+  };
+
   const status = (): DaemonStatus => ({
     alive: transport.state() === "open" && session.current() !== null,
     sessionId: session.current()?.sessionId ?? null,
@@ -316,7 +359,7 @@ export const createBrowserClient = (opts: BrowserClientOptions): BrowserClient =
 
   return {
     namespace: opts.namespace,
-    ensureAlive, status, start, stop, detach,
+    ensureAlive, status, start, stop, detach, closeOwnedTabs,
     evaluateJs, pageInfo,
     takeDialog: () => session.takeDialog(),
     listTabs, switchTab, newTab, closeTab,

package/src/daemon/protocol.ts

@@ -133,8 +133,18 @@ export const deserialize = (line: string): WireMessage | null => {
 
 // ── Constants ──────────────────────────────────────────────────────────────────
 
-/** Filesystem path for the daemon's Unix domain socket. */
-export const DAEMON_SOCKET_PATH = "/tmp/pi-browser-daemon.sock";
+/**
+ * IPC endpoint for the daemon.
+ *
+ * On POSIX platforms this is a Unix domain socket path. On Windows, Node's IPC
+ * requires a named pipe of the form `\\.\pipe\<name>` — a Unix path like
+ * `/tmp/…` is not a valid `net` listen/connect target there and causes setup
+ * to fail. See https://nodejs.org/api/net.html#ipc-support.
+ */
+export const DAEMON_SOCKET_PATH =
+  process.platform === "win32"
+    ? "\\\\.\\pipe\\pi-browser-daemon"
+    : "/tmp/pi-browser-daemon.sock";
 
 /**
  * How long the daemon stays alive with zero connected clients before exiting

package/src/daemon/spawn.ts

@@ -19,6 +19,19 @@ import { DAEMON_SOCKET_PATH, serialize, type WireControl } from "./protocol";
 
 const moduleDir = dirname(fileURLToPath(import.meta.url));
 
+const isWindows = process.platform === "win32";
+
+/**
+ * Remove a stale POSIX socket file. On Windows the daemon endpoint is a named
+ * pipe, which is not a filesystem entry and is torn down automatically when the
+ * owning process exits — so there is nothing to unlink, and calling unlink on a
+ * pipe path throws. This is a no-op on Windows.
+ */
+const cleanupStaleSocket = (): void => {
+  if (isWindows) return;
+  unlink(DAEMON_SOCKET_PATH).catch(() => {});
+};
+
 /**
  * Check whether the daemon is running by probing its Unix socket.
  * A file-existence check is unreliable — a crashed daemon leaves a stale socket.
@@ -26,11 +39,15 @@ const moduleDir = dirname(fileURLToPath(import.meta.url));
  * On failure, clean up the stale socket so ensureDaemon can spawn a fresh one.
  */
 export const isDaemonRunning = async (timeoutMs = 2_000): Promise<boolean> => {
-  // If the socket file doesn't exist, the daemon definitely isn't running.
-  try {
-    await access(DAEMON_SOCKET_PATH);
-  } catch {
-    return false;
+  // On POSIX, a missing socket file means the daemon definitely isn't running,
+  // so we can short-circuit. Windows named pipes are not filesystem entries —
+  // access() always fails there — so skip the pre-check and probe directly.
+  if (!isWindows) {
+    try {
+      await access(DAEMON_SOCKET_PATH);
+    } catch {
+      return false;
+    }
   }
 
   return new Promise((resolve) => {
@@ -45,7 +62,7 @@ export const isDaemonRunning = async (timeoutMs = 2_000): Promise<boolean> => {
     const timer = setTimeout(() => {
       sock.destroy();
       // ponytail: stale socket cleanup; ENOENT = already gone, fine
-      unlink(DAEMON_SOCKET_PATH).catch(() => {});
+      cleanupStaleSocket();
       done(false);
     }, timeoutMs);
 
@@ -70,7 +87,7 @@ export const isDaemonRunning = async (timeoutMs = 2_000): Promise<boolean> => {
       clearTimeout(timer);
       sock.destroy();
       // ponytail: connection refused = daemon dead, clean up stale socket
-      unlink(DAEMON_SOCKET_PATH).catch(() => {});
+      cleanupStaleSocket();
       done(false);
     });
 
@@ -96,18 +113,34 @@ export const isDaemonRunning = async (timeoutMs = 2_000): Promise<boolean> => {
 export const spawnDaemon = (): ChildProcess | null => {
   // Resolve the daemon entry point and tsx binary.
   const daemonScript = join(moduleDir, "index.ts");
-  const tsxBin = join(moduleDir, "..", "..", "node_modules", ".bin", "tsx");
 
-  // Use tsx to run the daemon TypeScript source directly.
-  // The spawed process inherits the parent's env so module resolution works.
+  // On Windows, npm installs binaries as `.cmd` shims, not bare executables,
+  // and the npx fallback is `npx.cmd`. A `.cmd` file can only be launched
+  // through a shell (spawning it directly yields EINVAL), so set shell: true
+  // whenever we invoke one.
+  const tsxBinBase = join(moduleDir, "..", "..", "node_modules", ".bin", "tsx");
+  const tsxBin = isWindows ? `${tsxBinBase}.cmd` : tsxBinBase;
+  const hasLocalTsx = existsSync(tsxBin);
+
+  // Use the local tsx binary to run the daemon TypeScript source directly.
+  // The spawned process inherits the parent's env so module resolution works.
   // Fall back to `npx tsx` if the local binary isn't available.
-  const cmd = existsSync(tsxBin) ? tsxBin : "npx";
-  const args = existsSync(tsxBin) ? [daemonScript] : ["tsx", daemonScript];
+  const cmd = hasLocalTsx ? tsxBin : isWindows ? "npx.cmd" : "npx";
+  const args = hasLocalTsx ? [daemonScript] : ["tsx", daemonScript];
+
+  // With shell: true, Node passes the command line to the shell verbatim
+  // without quoting, so any path containing spaces (e.g. C:\Users\Some Name)
+  // would be split into multiple tokens. Wrap each token in double quotes on
+  // Windows to keep space-containing paths intact.
+  const quote = (s: string): string => (isWindows ? `"${s}"` : s);
 
-  const child = spawn(cmd, args, {
+  const child = spawn(quote(cmd), args.map(quote), {
     detached: true,
     stdio: "ignore",
     env: { ...process.env },
+    // `.cmd` shims (local tsx or npx.cmd on Windows) must run via a shell.
+    shell: isWindows,
+    windowsVerbatimArguments: isWindows,
   });
 
   child.unref();

package/src/deep-research.ts

@@ -0,0 +1,41 @@
+/**
+ * Deep research — the /deep-research slash command. An explicit entry point
+ * (alongside the auto-triggering deep-research skill) that kicks off a research
+ * run for a given question.
+ *
+ * The command is thin: it validates a non-empty question and injects a user
+ * message that starts the deep-research flow. The actual orchestration
+ * (decompose → fan out web-search-researcher subagents → synthesize a cited
+ * report) lives in skills/deep-research/SKILL.md, which the injected prompt
+ * triggers. pi.sendUserMessage always starts a turn.
+ */
+
+import type { ExtensionAPI } from "@mariozechner/pi-coding-agent";
+
+// ── Shared core: build the prompt that starts a deep-research run ───────────
+
+export function buildDeepResearchPrompt(question: string): string {
+  return (
+    `Do deep research on the following question and produce a cited Markdown report. ` +
+    `Use the deep-research skill: decompose it into sub-questions, fan out web-search-researcher ` +
+    `subagents to research each against the live web, then synthesize a source-cited report file.\n\n` +
+    `Question: ${question}`
+  );
+}
+
+// ── Public: register the /deep-research slash command ──────────────────────
+
+export function registerDeepResearchCommand(pi: ExtensionAPI): void {
+  pi.registerCommand("deep-research", {
+    description: "Research a question on the web and write a cited report",
+    handler: async (args, ctx) => {
+      const question = args.trim();
+      if (question.length === 0) {
+        ctx.ui.notify('Usage: /deep-research <question>. Example: /deep-research "compare CDP vs WebDriver"', "warning");
+        return;
+      }
+      ctx.ui.notify(`Starting deep research: ${question}`, "info");
+      pi.sendUserMessage(buildDeepResearchPrompt(question));
+    },
+  });
+}

package/src/domains/forms.ts

@@ -0,0 +1,355 @@
+import { Type } from "typebox";
+import type { BrowserClient } from "../client";
+import { type Result, err, ok } from "../util/result";
+import { defineBrowserTool, type ToolErr, type ToolOk } from "../util/tool";
+
+// ── Page-side functions ──────────────────────────────────────────────────────
+// These run inside the page via Runtime.callFunctionOn with `this` bound to the
+// resolved element. They are NOT string-interpolated with user data — the value
+// is passed as a structured `arguments` entry, so safeJs is unnecessary here.
+
+/**
+ * Universal field setter. Auto-detects the element type and applies the right
+ * strategy, then reads the resulting value back so the caller can confirm.
+ *
+ * The <input>/<textarea> branch uses the "native setter" trick: React (and
+ * other frameworks) overload the element's `value` setter to track state, so a
+ * plain `el.value = x` updates the DOM but not the framework. Calling the
+ * prototype's original setter and then dispatching a bubbling `input` event is
+ * what makes React's onChange fire.
+ */
+const FILL_FN = `
+function(value) {
+  const el = this;
+  if (!el || el.nodeType !== 1) return { ok: false, reason: "ref does not point to an element" };
+  if (el.disabled) return { ok: false, reason: "element is disabled" };
+  const tag = (el.tagName || "").toLowerCase();
+  const type = (el.type || "").toLowerCase();
+  try { el.focus(); } catch (e) {}
+  const fire = function(t) { el.dispatchEvent(new Event(t, { bubbles: true })); };
+
+  if (tag === "select") {
+    const want = String(value);
+    let matched = null;
+    for (let i = 0; i < el.options.length; i++) {
+      const o = el.options[i];
+      if (o.value === want || o.label === want || o.text === want) { matched = o; break; }
+    }
+    if (!matched) {
+      const opts = [];
+      for (let i = 0; i < el.options.length; i++) opts.push({ value: el.options[i].value, text: el.options[i].text });
+      return { ok: false, reason: "no matching option", kind: "select", options: opts };
+    }
+    el.value = matched.value;
+    fire("input"); fire("change");
+    return { ok: true, kind: "select", value: el.value, text: matched.text };
+  }
+
+  if (tag === "input" && (type === "checkbox" || type === "radio")) {
+    const want = value === true || value === "true" || value === "on" || value === 1;
+    if (el.checked !== want) {
+      try { el.click(); } catch (e) {}
+      if (el.checked !== want) { el.checked = want; fire("input"); fire("change"); }
+    }
+    return { ok: true, kind: type, checked: el.checked };
+  }
+
+  if (el.isContentEditable) {
+    el.textContent = String(value);
+    fire("input"); fire("change");
+    return { ok: true, kind: "contenteditable", value: el.textContent };
+  }
+
+  if (tag === "input" || tag === "textarea") {
+    const proto = tag === "textarea" ? window.HTMLTextAreaElement.prototype : window.HTMLInputElement.prototype;
+    const desc = Object.getOwnPropertyDescriptor(proto, "value");
+    if (desc && desc.set) desc.set.call(el, String(value));
+    else el.value = String(value);
+    fire("input"); fire("change");
+    return { ok: true, kind: tag, value: el.value };
+  }
+
+  return { ok: false, reason: "element is not a fillable field (tag=" + tag + ")" };
+}`;
+
+/** Specialized <select> setter — matches by value first, then by label/text. */
+const SELECT_FN = `
+function(value, label) {
+  const el = this;
+  if (!el || (el.tagName || "").toLowerCase() !== "select") return { ok: false, reason: "ref is not a <select> element" };
+  if (el.disabled) return { ok: false, reason: "select is disabled" };
+  let matched = null;
+  for (let i = 0; i < el.options.length; i++) {
+    const o = el.options[i];
+    if (value != null && o.value === String(value)) { matched = o; break; }
+    if (label != null && (o.text === String(label) || o.label === String(label))) { matched = o; break; }
+  }
+  if (!matched) {
+    const opts = [];
+    for (let i = 0; i < el.options.length; i++) opts.push({ value: el.options[i].value, text: el.options[i].text });
+    return { ok: false, reason: "no matching option", options: opts };
+  }
+  try { el.focus(); } catch (e) {}
+  el.value = matched.value;
+  el.dispatchEvent(new Event("input", { bubbles: true }));
+  el.dispatchEvent(new Event("change", { bubbles: true }));
+  return { ok: true, value: el.value, text: matched.text };
+}`;
+
+/** Specialized checkbox/radio setter — only acts when the state differs. */
+const CHECK_FN = `
+function(checked) {
+  const el = this;
+  const tag = (el.tagName || "").toLowerCase();
+  const type = (el.type || "").toLowerCase();
+  if (tag !== "input" || (type !== "checkbox" && type !== "radio")) return { ok: false, reason: "ref is not a checkbox or radio" };
+  if (el.disabled) return { ok: false, reason: "element is disabled" };
+  const want = checked === true;
+  let changed = false;
+  if (el.checked !== want) {
+    try { el.click(); } catch (e) {}
+    if (el.checked !== want) { el.checked = want; el.dispatchEvent(new Event("change", { bubbles: true })); }
+    changed = true;
+  }
+  return { ok: true, checked: el.checked, changed: changed };
+}`;
+
+// ── Resolver ─────────────────────────────────────────────────────────────────
+
+/** Shape returned by the page-side functions above. */
+type PageResult = {
+  readonly ok: boolean;
+  readonly reason?: string;
+  readonly kind?: string;
+  readonly value?: unknown;
+  readonly text?: string;
+  readonly checked?: boolean;
+  readonly changed?: boolean;
+  readonly options?: ReadonlyArray<{ value: string; text: string }>;
+};
+
+/**
+ * Resolve a ref (CDP backendDOMNodeId) to a live JS handle and invoke a
+ * page-side function on it. DOM + Runtime are enabled on every session
+ * (see cdp/session.ts enableDomains), so no extra setup is required.
+ */
+const resolveAndCall = async (
+  client: BrowserClient,
+  ref: number,
+  functionDeclaration: string,
+  args: ReadonlyArray<unknown>,
+): Promise<Result<PageResult, ToolErr>> => {
+  const session = client.session();
+
+  const resolved = await session.call("DOM.resolveNode", { backendNodeId: ref });
+  if (!resolved.success) {
+    return err({
+      kind: "invalid_state",
+      message: `ref ${ref} could not be resolved — the page may have changed. Re-run browser_snapshot to get fresh refs.`,
+      details: { ref },
+    });
+  }
+  const objectId = (resolved.data as { object?: { objectId?: string } }).object?.objectId;
+  if (objectId === undefined) {
+    return err({
+      kind: "invalid_state",
+      message: `ref ${ref} resolved to no JS object — re-run browser_snapshot to get fresh refs.`,
+      details: { ref },
+    });
+  }
+
+  try {
+    const called = await session.call("Runtime.callFunctionOn", {
+      objectId,
+      functionDeclaration,
+      arguments: args.map((v) => ({ value: v })),
+      returnByValue: true,
+      awaitPromise: true,
+    });
+    if (!called.success) return err({ kind: "cdp_error", message: called.error.message, details: { ref } });
+    const data = called.data as { result?: { value?: unknown }; exceptionDetails?: unknown };
+    if (data.exceptionDetails !== undefined) {
+      return err({ kind: "cdp_error", message: `page function threw: ${JSON.stringify(data.exceptionDetails)}`, details: { ref } });
+    }
+    const value = data.result?.value;
+    if (typeof value !== "object" || value === null) {
+      return err({ kind: "internal", message: "page function returned no result object", details: { ref } });
+    }
+    return ok(value as PageResult);
+  } finally {
+    // Best-effort: release the remote handle so it can be GC'd. Failure is
+    // harmless (the page may have navigated), so we ignore the result.
+    await session.call("Runtime.releaseObject", { objectId });
+  }
+};
+
+/** Drop the `ok` flag before stashing a page result in tool `details` — the
+ *  tool-result envelope reserves `ok` for its own success discriminant. */
+const detailsOf = (ref: number, res: PageResult, extra?: Readonly<Record<string, unknown>>): Readonly<Record<string, unknown>> => {
+  const { ok: _ok, ...rest } = res;
+  return { ref, ...rest, ...(extra ?? {}) };
+};
+
+// ── Tools ────────────────────────────────────────────────────────────────────
+
+const FieldValue = Type.Union([Type.String(), Type.Boolean()], {
+  description: "Value to set. String for text inputs / textareas / selects / contenteditable; boolean for checkboxes & radios.",
+});
+
+const FillArgs = Type.Object({
+  ref: Type.Integer({ description: "Element ref from browser_snapshot ([ref=N])." }),
+  value: FieldValue,
+});
+
+export const fillTool = defineBrowserTool({
+  name: "browser_fill",
+  label: "Browser Fill",
+  description:
+    "Fill a single form field by ref. Auto-detects input/textarea/select/checkbox/radio/contenteditable, clears then sets the value, fires input+change events (drives React/Vue controlled inputs correctly), and reads the value back to confirm. Get the ref from browser_snapshot's [ref=N].",
+  promptSnippet: "Fill a form field by ref (text, select, checkbox) — React-safe, self-confirming",
+  promptGuidelines: [
+    "Get the ref from browser_snapshot's [ref=N] for the target field. No click-to-focus needed.",
+    "value is a string for text fields/selects/contenteditable, or a boolean for checkboxes/radios.",
+    "The result reports the value the field actually holds after filling — check it matches what you intended.",
+    "For autocomplete/typeahead that needs real keystrokes, click the field's @(x,y) then use browser_type instead.",
+    "If a ref no longer resolves, re-run browser_snapshot to get fresh refs.",
+  ],
+  parameters: FillArgs,
+  async handler(args, { client }): Promise<Result<ToolOk, ToolErr>> {
+    const r = await resolveAndCall(client, args.ref, FILL_FN, [args.value]);
+    if (!r.success) return r;
+    const res = r.data;
+    if (!res.ok) {
+      return err({ kind: "invalid_state", message: `Could not fill ref ${args.ref}: ${res.reason ?? "unknown reason"}`, details: detailsOf(args.ref, res) });
+    }
+    const wanted = typeof args.value === "boolean" ? undefined : String(args.value);
+    const got = res.value !== undefined ? String(res.value) : undefined;
+    const mismatch = wanted !== undefined && got !== undefined && got !== wanted;
+    let text: string;
+    if (mismatch) {
+      text = `Filled ref ${args.ref}, but it now reads ${JSON.stringify(got)} (wanted ${JSON.stringify(wanted)})`;
+    } else if (got !== undefined) {
+      text = `Filled ref ${args.ref} = ${JSON.stringify(got)}`;
+    } else if (res.checked !== undefined) {
+      text = `Filled ref ${args.ref} (checked=${res.checked})`;
+    } else {
+      text = `Filled ref ${args.ref}`;
+    }
+    return ok({ text, details: detailsOf(args.ref, res, { mismatch }) });
+  },
+});
+
+const FillFormArgs = Type.Object({
+  fields: Type.Array(
+    Type.Object({
+      ref: Type.Integer({ description: "Element ref from browser_snapshot ([ref=N])." }),
+      value: FieldValue,
+    }),
+    { minItems: 1, description: "Fields to fill in one batch, each by ref." },
+  ),
+});
+
+export const fillFormTool = defineBrowserTool({
+  name: "browser_fill_form",
+  label: "Browser Fill Form",
+  description:
+    "Fill multiple form fields in one call — the efficient way to complete a form. Each field is { ref, value }; refs come from browser_snapshot's [ref=N]. Handles text inputs, textareas, selects, checkboxes, radios, and contenteditable, drives React/Vue controlled inputs correctly, and reports the resulting value of every field.",
+  promptSnippet: "Fill many form fields at once by ref — React-safe, self-confirming",
+  promptGuidelines: [
+    "Preferred for forms: snapshot once, then fill all fields in a single browser_fill_form call.",
+    "Each field: { ref, value }. value is a string for text/select/contenteditable, boolean for checkbox/radio.",
+    "The result summarizes how many fields filled cleanly and flags any value mismatches or per-field errors.",
+    "Re-run browser_snapshot afterwards to verify the form state if needed.",
+  ],
+  parameters: FillFormArgs,
+  async handler(args, { client }): Promise<Result<ToolOk, ToolErr>> {
+    const results: Array<Readonly<Record<string, unknown>>> = [];
+    let okCount = 0;
+    const issues: string[] = [];
+    for (const f of args.fields) {
+      const r = await resolveAndCall(client, f.ref, FILL_FN, [f.value]);
+      if (!r.success) {
+        results.push({ ref: f.ref, ok: false, error: r.error.message });
+        issues.push(`ref ${f.ref} (${r.error.message})`);
+        continue;
+      }
+      const res = r.data;
+      const wanted = typeof f.value === "boolean" ? undefined : String(f.value);
+      const got = res.value !== undefined ? String(res.value) : undefined;
+      const mismatch = wanted !== undefined && got !== undefined && got !== wanted;
+      const fieldOk = res.ok === true && !mismatch;
+      if (fieldOk) okCount++;
+      else issues.push(`ref ${f.ref} (${res.ok === false ? (res.reason ?? "failed") : "value mismatch"})`);
+      results.push({ ref: f.ref, ok: fieldOk, mismatch, ...detailsOf(f.ref, res) });
+    }
+    const text =
+      `Filled ${okCount}/${args.fields.length} fields` +
+      (issues.length > 0 ? `; issues: ${issues.join(", ")}` : "");
+    return ok({ text, details: { results } });
+  },
+});
+
+const SelectOptionArgs = Type.Object({
+  ref: Type.Integer({ description: "Element ref of a <select> from browser_snapshot ([ref=N])." }),
+  value: Type.Optional(Type.String({ description: "Option value attribute to select." })),
+  label: Type.Optional(Type.String({ description: "Visible option text/label to select (used if value is omitted)." })),
+});
+
+export const selectOptionTool = defineBrowserTool({
+  name: "browser_select_option",
+  label: "Browser Select Option",
+  description:
+    "Select an option in a native <select> dropdown by ref. Matches by option value, then by visible label/text, and fires change. Native selects cannot be driven by clicking coordinates — use this instead. Get the ref from browser_snapshot's [ref=N].",
+  promptSnippet: "Choose an option in a <select> dropdown by ref",
+  promptGuidelines: [
+    "Provide value (the option's value attribute) or label (the visible text). value wins if both given.",
+    "On no match, the result lists the available options so you can retry with a valid one.",
+    "Use this for native <select> elements — clicking coordinates does not work for OS dropdowns.",
+  ],
+  parameters: SelectOptionArgs,
+  async handler(args, { client }): Promise<Result<ToolOk, ToolErr>> {
+    if (args.value === undefined && args.label === undefined) {
+      return err({ kind: "invalid_state", message: "Provide value or label to select an option." });
+    }
+    const r = await resolveAndCall(client, args.ref, SELECT_FN, [args.value ?? null, args.label ?? null]);
+    if (!r.success) return r;
+    const res = r.data;
+    if (!res.ok) {
+      return err({ kind: "invalid_state", message: `Could not select option on ref ${args.ref}: ${res.reason ?? "unknown reason"}`, details: detailsOf(args.ref, res) });
+    }
+    return ok({
+      text: `Selected ${JSON.stringify(res.text)} (value=${JSON.stringify(res.value)}) on ref ${args.ref}`,
+      details: detailsOf(args.ref, res),
+    });
+  },
+});
+
+const SetCheckedArgs = Type.Object({
+  ref: Type.Integer({ description: "Element ref of a checkbox or radio from browser_snapshot ([ref=N])." }),
+  checked: Type.Boolean({ description: "Desired checked state." }),
+});
+
+export const setCheckedTool = defineBrowserTool({
+  name: "browser_set_checked",
+  label: "Browser Set Checked",
+  description:
+    "Set a checkbox or radio to a desired checked state by ref. Only acts if the current state differs, fires change, and reports the final state. Get the ref from browser_snapshot's [ref=N].",
+  promptSnippet: "Set a checkbox/radio checked state by ref",
+  promptGuidelines: [
+    "checked:true ticks the box, checked:false unticks it. Idempotent — no-op if already in the desired state.",
+    "For radios, set checked:true on the option you want; the group deselects the others.",
+  ],
+  parameters: SetCheckedArgs,
+  async handler(args, { client }): Promise<Result<ToolOk, ToolErr>> {
+    const r = await resolveAndCall(client, args.ref, CHECK_FN, [args.checked]);
+    if (!r.success) return r;
+    const res = r.data;
+    if (!res.ok) {
+      return err({ kind: "invalid_state", message: `Could not set checked on ref ${args.ref}: ${res.reason ?? "unknown reason"}`, details: detailsOf(args.ref, res) });
+    }
+    return ok({
+      text: `Set ref ${args.ref} checked=${res.checked}` + (res.changed === false ? " (already)" : ""),
+      details: detailsOf(args.ref, res),
+    });
+  },
+});