Stagehand and Mastra: build a TypeScript browser agent

This tutorial builds an AI agent for finding Amazon running shoes with Mastra, Browserbase and Stagehand. The demo extracts ten best-selling shoes into a table with prices, ratings and rating counts. The speaker notes that the markdown parser blocks the displayed links.

Browserbase supplies the hosted browser, Stagehand drives it, and Mastra connects the browser to the agent. The setup specifies a browser-driving model plus a Browserbase API key and project ID. Mastra also supports a local Playwright browser. The speaker recommends that option for localhost and sites under the developer's control, and uses the hosted setup for Amazon because of IP blocking. A local browser alone does not establish that the model runs locally or that the workflow works offline.

The driver uses the page's accessibility tree: labels, text and links, with alt text rather than image pixels. The speaker explains why this approach is unsuitable for reproducing exact visual layouts and notes that model calls add token costs and latency.

Adding the browser gives the agent six tools: act, extract, observe, navigate, tabs and close. The tutorial recommends increasing max steps beyond the stated default of five. It finishes with a backend chat stream and an AI SDK frontend that renders tool inputs and outputs.