Chris Tateandctate
cc3c70dc86
* next.js guide
* better
* shadcn
* fixes
* fix: correct screenshot test assertion to check path instead of base64
The daemon returns { path: savePath } for screenshot commands, not base64.
* fix: cross-platform Chrome detection and gitignore hardening
- Replace hardcoded macOS Chrome path with findLocalChrome() that
searches common paths on macOS, Linux, and WSL, with a clear error
message when no Chrome is found.
- Add .env and .env*.local to .gitignore to prevent accidental
secret commits.
* fix: correct Vercel deploy button repo URL to vercel-labs/agent-browser
* clean up
* demo
* next page
---------
Co-authored-by: ctate <366502+ctate@users.noreply.github.com>
agent-browser Demo
A visual demo of agent-browser's core capabilities. Enter a URL, pick a compute environment, and take a screenshot or accessibility snapshot.
Environments
- Serverless Function --
@sparticuz/chromium+puppeteer-corerunning directly inside a Vercel serverless function - Vercel Sandbox -- agent-browser + Chrome in an ephemeral Linux microVM
Getting Started
cd examples/demo
pnpm install
pnpm dev
Serverless Function
Runs headless Chrome directly in the serverless function. On Vercel, @sparticuz/chromium provides the binary automatically. Locally, the app finds your system Chrome or uses CHROMIUM_PATH.
Vercel Sandbox
Spins up a Linux microVM on demand, installs agent-browser + Chrome, runs the commands, and shuts down. No binary size limits. Create a snapshot to make startup sub-second:
npx tsx scripts/create-snapshot.ts
# Output: AGENT_BROWSER_SNAPSHOT_ID=snap_xxxxxxxxxxxx
Add the snapshot ID to your Vercel environment variables or .env.local.
Environment Variables
| Variable | Environment | Description |
|---|---|---|
CHROMIUM_PATH |
Serverless | Path to local Chrome/Chromium binary (auto-detected on Vercel) |
AGENT_BROWSER_SNAPSHOT_ID |
Sandbox | Pre-built snapshot ID for fast startup |
Project Structure
examples/demo/
app/
page.tsx # Demo UI
actions/browse.ts # Server actions (all environments)
api/browse/route.ts # API route for programmatic access
lib/
agent-browser.ts # Serverless: @sparticuz/chromium + puppeteer-core
agent-browser-sandbox.ts # Sandbox: Vercel Sandbox client
scripts/
create-snapshot.ts # Create sandbox snapshot