From 05372a7943e97d46a2eb38edc0651187cc6a255e Mon Sep 17 00:00:00 2001 From: Anirudh Kamath Date: Sat, 14 Dec 2024 19:20:34 -0800 Subject: [PATCH 1/2] temp --- examples/wikipedia.ts | 58 ++++++++++++++++++++++++++++++++++ lib/dom/debug.ts | 73 ------------------------------------------- package.json | 1 + types/act.ts | 3 +- types/inference.ts | 3 +- 5 files changed, 63 insertions(+), 75 deletions(-) create mode 100644 examples/wikipedia.ts diff --git a/examples/wikipedia.ts b/examples/wikipedia.ts new file mode 100644 index 00000000..fd30c637 --- /dev/null +++ b/examples/wikipedia.ts @@ -0,0 +1,58 @@ +import { Stagehand } from "../lib"; +import { z } from "zod"; + +type RandomArticle = { + id: number; + ns: number; + title: string; +}; + +async function getRandomArticle() { + const response = await fetch( + "https://en.wikipedia.org/w/api.php?action=query&list=random&rnnamespace=0&rnlimit=1&format=json", + ); + const data = await response.json(); + return { + ...(data.query.random[0] satisfies RandomArticle), + link: `https://en.wikipedia.org/wiki/${data.query.random[0].title.replace(/ /g, "_")}`, + }; +} + +async function example() { + console.log(" Navigating to Wikipedia..."); + // const src = await getRandomArticle(); + // const dest = await getRandomArticle(); + + const src = { + title: "Isiah Thomas", + link: "https://en.wikipedia.org/wiki/Isiah_Thomas", + }; + + const dest = { + title: "LeBron James", + link: "https://en.wikipedia.org/wiki/LeBron_James", + }; + + console.log(src, dest); + const stagehand = new Stagehand({ + env: "LOCAL", + verbose: 1, + debugDom: true, + domSettleTimeoutMs: 100, + }); + + await stagehand.init(); + await stagehand.page.goto(src.link); + await stagehand.act({ + action: `You are a helpful assistant that can navigate Wikipedia. + You need to navigate from this article to the destination article in the least number of clicks. + The destination article is ${dest.title}. + Click the link to the destination article. + If the destination article is not found, click the link that will get you closer to the destination article. + Stop when you have reached the destination article. + `, + }); +} +(async () => { + await example(); +})(); diff --git a/lib/dom/debug.ts b/lib/dom/debug.ts index 39795fde..e9d39373 100644 --- a/lib/dom/debug.ts +++ b/lib/dom/debug.ts @@ -1,5 +1,3 @@ -import { calculateViewportHeight } from "./utils"; - export async function debugDom() { window.chunkNumber = 0; @@ -10,7 +8,6 @@ export async function debugDom() { const selectorMap = multiSelectorMapToSelectorMap(multiSelectorMap); drawChunk(selectorMap); - setupChunkNav(); } function multiSelectorMapToSelectorMap( @@ -67,7 +64,6 @@ function drawChunk(selectorMap: Record) { async function cleanupDebug() { cleanupMarkers(); - cleanupNav(); } function cleanupMarkers() { @@ -77,74 +73,5 @@ function cleanupMarkers() { }); } -function cleanupNav() { - const stagehandNavElements = document.querySelectorAll(".stagehand-nav"); - stagehandNavElements.forEach((element) => { - element.remove(); - }); -} - -function setupChunkNav() { - const viewportHeight = calculateViewportHeight(); - const documentHeight = document.documentElement.scrollHeight; - const totalChunks = Math.ceil(documentHeight / viewportHeight); - - if (window.chunkNumber > 0) { - const prevChunkButton = document.createElement("button"); - prevChunkButton.className = "stagehand-nav"; - - prevChunkButton.textContent = "Previous"; - prevChunkButton.style.marginLeft = "50px"; - prevChunkButton.style.position = "fixed"; - prevChunkButton.style.bottom = "10px"; - prevChunkButton.style.left = "50%"; - prevChunkButton.style.transform = "translateX(-50%)"; - prevChunkButton.style.zIndex = "1000000000"; - prevChunkButton.onclick = async () => { - cleanupMarkers(); - cleanupNav(); - window.chunkNumber -= 1; - window.scrollTo(0, window.chunkNumber * viewportHeight); - await window.waitForDomSettle(); - const { selectorMap: multiSelectorMap } = await window.processElements( - window.chunkNumber, - ); - - const selectorMap = multiSelectorMapToSelectorMap(multiSelectorMap); - - drawChunk(selectorMap); - setupChunkNav(); - }; - document.body.appendChild(prevChunkButton); - } - if (totalChunks > window.chunkNumber) { - const nextChunkButton = document.createElement("button"); - nextChunkButton.className = "stagehand-nav"; - nextChunkButton.textContent = "Next"; - nextChunkButton.style.marginRight = "50px"; - nextChunkButton.style.position = "fixed"; - nextChunkButton.style.bottom = "10px"; - nextChunkButton.style.right = "50%"; - nextChunkButton.style.transform = "translateX(50%)"; - nextChunkButton.style.zIndex = "1000000000"; - nextChunkButton.onclick = async () => { - cleanupMarkers(); - cleanupNav(); - window.chunkNumber += 1; - window.scrollTo(0, window.chunkNumber * viewportHeight); - await window.waitForDomSettle(); - - const { selectorMap: multiSelectorMap } = await window.processElements( - window.chunkNumber, - ); - const selectorMap = multiSelectorMapToSelectorMap(multiSelectorMap); - drawChunk(selectorMap); - setupChunkNav(); - }; - - document.body.appendChild(nextChunkButton); - } -} - window.debugDom = debugDom; window.cleanupDebug = cleanupDebug; diff --git a/package.json b/package.json index b71719b6..5160190d 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "types": "./dist/index.d.ts", "scripts": { "2048": "npm run build-dom-scripts && tsx examples/2048.ts", + "wikipedia": "npm run build-dom-scripts && tsx examples/wikipedia.ts", "example": "npm run build-dom-scripts && tsx examples/example.ts", "debug-url": "npm run build-dom-scripts && tsx examples/debugUrl.ts", "format": "prettier --write .", diff --git a/types/act.ts b/types/act.ts index 44632539..9cad711e 100644 --- a/types/act.ts +++ b/types/act.ts @@ -1,5 +1,6 @@ import { Buffer } from "buffer"; import { LLMClient } from "../lib/llm/LLMClient"; +import { LogLine } from "./log"; export interface ActParams { action: string; @@ -8,7 +9,7 @@ export interface ActParams { llmClient: LLMClient; screenshot?: Buffer; retries?: number; - logger: (message: { category?: string; message: string }) => void; + logger: (logLine: LogLine) => void; requestId: string; variables?: Record; } diff --git a/types/inference.ts b/types/inference.ts index 367b7b68..a3f26e8e 100644 --- a/types/inference.ts +++ b/types/inference.ts @@ -1,6 +1,7 @@ import { Buffer } from "buffer"; import { LLMClient } from "../lib/llm/LLMClient"; import { LLMProvider } from "../lib/llm/LLMProvider"; +import { LogLine } from "./log"; export interface VerifyActCompletionParams { goal: string; @@ -9,6 +10,6 @@ export interface VerifyActCompletionParams { llmClient: LLMClient; screenshot?: Buffer; domElements?: string; - logger: (message: { category?: string; message: string }) => void; + logger: (message: LogLine) => void; requestId: string; } From a0c529105487aae8968581d5c2c05024adb4759e Mon Sep 17 00:00:00 2001 From: Anirudh Kamath Date: Sun, 15 Dec 2024 00:18:53 -0800 Subject: [PATCH 2/2] temp --- lib/index.ts | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/lib/index.ts b/lib/index.ts index 224c2436..88c0f769 100644 --- a/lib/index.ts +++ b/lib/index.ts @@ -370,15 +370,9 @@ export class Stagehand { this.browserbaseResumeSessionID = browserbaseResumeSessionID; } - async init( - /** @deprecated Use constructor options instead */ - initOptions?: InitOptions, + static async init( + constructorParams?: ConstructorParams, ): Promise { - if (initOptions) { - console.warn( - "Passing parameters to init() is deprecated and will be removed in the next major version. Use constructor options instead.", - ); - } const { context, debugUrl, sessionUrl, contextPath, sessionId } = await getBrowser( this.apiKey,