support iframe and nested iframes. use playwright instead of patchright

package.json

@@ -55,6 +55,7 @@
     "openai": "^6.7.0",
     "ora": "5.4.1",
     "patchright": "^1.55.1",
+    "playwright-core": "^1.56.1",
     "readline": "^1.3.0",
     "turndown": "^7.2.0",
     "zod": "^4.1.8"

scripts/test-page-ai.ts

@@ -3,14 +3,46 @@ import dotenv from "dotenv";
 
 dotenv.config();
 
-const agent = new HyperAgent();
+// const agent = new HyperAgent();
+
+// (async () => {
+//   const page = await agent.newPage();
+//   page.ai(
+//     "Go to https://flights.google.com and find a round-trip flight from Rio de Janeiro to Los Angeles, leaving on November 11, 2025, and returning on November 22, 2025, and select the option with the least carbon dioxide emissions."
+//   );
+
+//   const page2 = await agent.newPage();
+//   await page2.goto("https://maps.google.com");
+//   page2.ai("Find the nearest restaurant to the current page");
+// })();
 
 (async () => {
+  const agent = new HyperAgent({
+    llm: {
+      provider: "anthropic",
+      model: "claude-sonnet-4-0",
+    },
+    // browserProvider: "Hyperbrowser",
+    debug: true,
+  });
   const page = await agent.newPage();
-  page.ai(
-    "Go to https://flights.google.com and find a round-trip flight from Rio de Janeiro to Los Angeles, leaving on November 11, 2025, and returning on November 22, 2025, and select the option with the least carbon dioxide emissions."
+  page.goto("https://flights.google.com");
+  await page.aiAction("click source location box");
+  await page.aiAction("type 'Rio de Janeiro' into the source location box");
+  await page.aiAction("press enter");
+  await page.aiAction("click destination location box");
+  await page.aiAction("type 'Los Angeles' into the destination location box");
+  await page.aiAction("press enter");
+  await page.aiAction("click the departure date box");
+  await page.aiAction(
+    "fill 12/01/2025 into the departure date box"
   );
-  const page2 = await agent.newPage();
-  await page2.goto("https://maps.google.com");
-  page2.ai("Find the nearest restaurant to the current page");
+  await page.aiAction("click the return date box");
+  await page.aiAction("fill 12/22/2025 into the return date box");
+  await page.aiAction("click the search button");
+  await page.aiAction("click the first flight option");
+
+  // const page2 = await agent.newPage();
+  // await page2.goto("https://maps.google.com");
+  // page2.ai("Find the nearest restaurant to the current page");
 })();

src/agent/actions/click-element.ts

@@ -1,5 +1,5 @@
 import { z } from "zod";
-import { Locator } from "patchright";
+import { Locator } from "playwright-core";
 import { ActionContext, ActionOutput, AgentActionDefinition } from "@/types";
 import { sleep } from "@/utils";
 import { getLocator } from "./utils";

src/agent/examine-dom/prompts.ts

@@ -21,7 +21,19 @@ Return an array of elements that match the instruction if they exist, otherwise
  * Provides specific guidance for different action types
  */
 export function buildActionInstruction(action: string): string {
-  const supportedActions = ['click', 'fill', 'type', 'press', 'scrollTo', 'nextChunk', 'prevChunk', 'selectOptionFromDropdown', 'hover', 'check', 'uncheck'];
+  const supportedActions = [
+    "click",
+    "fill",
+    "type",
+    "press",
+    "scrollTo",
+    "nextChunk",
+    "prevChunk",
+    "selectOptionFromDropdown",
+    "hover",
+    "check",
+    "uncheck",
+  ];
 
   const instruction = `Find the most relevant element to perform an action on given the following action: ${action}.
 Provide an action for this element such as ${supportedActions.join(", ")}, or any other playwright locator method. Remember that to users, buttons and links look the same in most cases.
@@ -45,19 +57,11 @@ export function buildExamineDomUserPrompt(
   instruction: string,
   tree: string
 ): string {
-  // Truncate tree if too long
-  let truncatedTree = tree;
-  const MAX_TREE_LENGTH = 50000;
-
-  if (tree.length > MAX_TREE_LENGTH) {
-    truncatedTree = tree.substring(0, MAX_TREE_LENGTH) + '\n\n[TREE TRUNCATED: Too large]';
-  }
-
   // Build detailed instruction for actions
   const detailedInstruction = buildActionInstruction(instruction);
 
   return `instruction: ${detailedInstruction}
 
 Accessibility Tree:
-${truncatedTree}`;
+${tree}`;
 }