Stagehand: The AI Browser Automation Framework for Production

Introduction

Stagehand is an advanced AI browser automation framework developed by Browserbase, designed to bridge the gap between traditional code-based automation tools and unpredictable AI agents. Built with TypeScript, Stagehand offers a unique approach by allowing developers to strategically choose between writing precise Playwright code and utilizing natural language prompts for AI-driven actions. This flexibility makes it an ideal solution for creating robust and reliable browser automations in production environments. With over 18,000 stars on GitHub, Stagehand is quickly becoming a go-to tool for modern web automation challenges.

Installation

Getting started with Stagehand is straightforward. You can initialize a new project with a single command:

npx create-browser-app

For a more detailed walkthrough and additional setup instructions, refer to the official Quickstart Guide on the Stagehand documentation website.

Examples

Stagehand empowers you to combine Playwright's capabilities with AI-driven actions. Here's a practical example demonstrating how to navigate a page, interact using AI, and extract structured data:

// Use Playwright functions on the page object
const page = stagehand.page;
await page.goto("https://github.com/browserbase");

// Use act() to execute individual actions
await page.act("click on the stagehand repo");

// Use Computer Use agents for larger actions
const agent = stagehand.agent({
    provider: "openai",
    model: "computer-use-preview",
});
await agent.execute("Get to the latest PR");

// Use extract() to read data from the page
const { author, title } = await page.extract({
  instruction: "extract the author and title of the PR",
  schema: z.object({
    author: z.string().describe("The username of the PR author"),
    title: z.string().describe("The title of the PR"),
  }),
});

This example illustrates how Stagehand allows you to precisely control browser interactions with Playwright, while delegating more complex or exploratory tasks to intelligent AI agents, and then extracting specific information using schema-guided instructions.

Why Use Stagehand?

Stagehand stands out as a preferred choice for browser automation due to several key advantages:

• Choose when to write code vs. natural language: It provides the flexibility to use AI for navigating unfamiliar pages or performing exploratory actions, and to use Playwright code when you have precise, known interactions. This hybrid approach ensures both predictability and adaptability.
• Preview and cache actions: Stagehand allows you to preview AI-driven actions before execution, ensuring desired outcomes. It also facilitates easy caching of repeatable actions, saving time and computational resources.
• Computer use models with one line of code: Seamlessly integrate state-of-the-art computer use models from providers like OpenAI and Anthropic directly into your browser automation workflows, enhancing the intelligence and capability of your agents.

Links

Explore Stagehand further through these official resources:

• GitHub Repository: browserbase/stagehand
• Official Documentation: Stagehand Docs
• Slack Community: Join the Stagehand Slack Community