Add a timeout to dom based act (#556)

* pls

* pls

* changeset

* act evals

* example

* Update lib/StagehandPage.ts

Co-authored-by: Sean McGuire <[email protected]>

---------

Co-authored-by: Sean McGuire <[email protected]>

Author: kamath

Diff for: .changeset/small-zebras-jog.md

@@ -0,0 +1,5 @@
+---
+"@browserbasehq/stagehand": minor
+---
+
+You can now set a timeout for dom-based stagehand act!

Diff for: .changeset/wild-hats-turn.md

@@ -2,4 +2,4 @@
 "@browserbasehq/stagehand": minor
 ---
 
-`act()` can now use `observe()` under the hood, resulting in significant performance improvements. To opt-in to this change, set `slowDomBasedAct: true` in `ActOptions`.
+`act()` can now use `observe()` under the hood, resulting in significant performance improvements. To opt-in to this change, set `slowDomBasedAct: false` in `ActOptions`.

Diff for: evals/evals.config.json

@@ -1,5 +1,13 @@
 {
   "tasks": [
+    {
+      "name": "expect_act_timeout",
+      "categories": ["act"]
+    },
+    {
+      "name": "expect_act_timeout_global",
+      "categories": ["act"]
+    },
     {
       "name": "extract_repo_name",
       "categories": ["extract"]

Diff for: evals/initStagehand.ts

@@ -55,11 +55,13 @@ export const initStagehand = async ({
   domSettleTimeoutMs,
   logger,
   configOverrides,
+  actTimeoutMs,
 }: {
   modelName: AvailableModel;
   domSettleTimeoutMs?: number;
   logger: EvalLogger;
   configOverrides?: Partial<ConstructorParams>;
+  actTimeoutMs?: number;
 }) => {
   let chosenApiKey: string | undefined = process.env.OPENAI_API_KEY;
   if (modelName.startsWith("claude")) {
@@ -73,6 +75,7 @@ export const initStagehand = async ({
     modelClientOptions: {
       apiKey: chosenApiKey,
     },
+    actTimeoutMs,
     logger: (logLine: LogLine) => {
       logger.log(logLine);
     },

Diff for: evals/tasks/expect_act_timeout.ts

@@ -0,0 +1,30 @@
+import { initStagehand } from "@/evals/initStagehand";
+import { EvalFunction } from "@/types/evals";
+
+export const expect_act_timeout: EvalFunction = async ({
+  modelName,
+  logger,
+}) => {
+  const { stagehand, initResponse } = await initStagehand({
+    modelName,
+    logger,
+  });
+
+  const { debugUrl, sessionUrl } = initResponse;
+
+  await stagehand.page.goto("https://docs.stagehand.dev");
+  const result = await stagehand.page.act({
+    action: "search for 'Stagehand'",
+    timeoutMs: 1_000,
+    slowDomBasedAct: true,
+  });
+
+  await stagehand.close();
+
+  return {
+    _success: !result.success,
+    debugUrl,
+    sessionUrl,
+    logs: logger.getLogs(),
+  };
+};

Diff for: evals/tasks/expect_act_timeout_global.ts

@@ -0,0 +1,32 @@
+import { initStagehand } from "@/evals/initStagehand";
+import { EvalFunction } from "@/types/evals";
+
+export const expect_act_timeout_global: EvalFunction = async ({
+  modelName,
+  logger,
+}) => {
+  const { stagehand, initResponse } = await initStagehand({
+    modelName,
+    logger,
+    actTimeoutMs: 1_000,
+  });
+
+  const { debugUrl, sessionUrl } = initResponse;
+
+  await stagehand.page.goto("https://docs.stagehand.dev");
+
+  const result = await stagehand.page.act({
+    action: "search for 'Stagehand'",
+    slowDomBasedAct: true,
+  });
+  console.log("RESULT", result);
+
+  await stagehand.close();
+
+  return {
+    _success: !result.success,
+    debugUrl,
+    sessionUrl,
+    logs: logger.getLogs(),
+  };
+};

Diff for: examples/example.ts

@@ -14,6 +14,10 @@ async function example() {
   });
   await stagehand.init();
   await stagehand.page.goto("https://docs.stagehand.dev");
+  /**
+   * Add your code here!
+   */
+  await stagehand.close();
 }
 
 (async () => {

Diff for: lib/StagehandPage.ts

@@ -488,6 +488,7 @@ export class StagehandPage {
       variables = {},
       domSettleTimeoutMs,
       slowDomBasedAct = true,
+      timeoutMs = this.stagehand.actTimeoutMs,
     } = actionOrOptions;
 
     if (typeof useVision !== "undefined") {
@@ -545,6 +546,7 @@ export class StagehandPage {
         previousSelectors: [],
         skipActionCacheForThisStep: false,
         domSettleTimeoutMs,
+        timeoutMs,
       })
       .catch((e) => {
         this.stagehand.log({