Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 7 additions & 19 deletions box/overall/browser/cookbook.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,29 +7,21 @@ description: "Runnable browser examples grouped by use case. Each one is self-co
Every example is a single self-contained file in the [Box SDK
repo](https://github.com/upstash/box/tree/main/packages/sdk/examples/browser).
All of them need `UPSTASH_BOX_API_KEY`. Examples marked **AI** use metered
browser AI (`run`, `act`, `extract`) and need a model provider key on the box
browser AI (`act`, `extract`, `observe`) and need a model provider key on the box
or account. Everything else runs with the Box key alone.
</Info>

## Agents
## Agentic browsing

Goal-driven browsing with `tab.run()`.
Goal-driven browsing: hand a goal to the box's agent, or drive your own loop.

<CardGroup cols={2}>
<Card title="Search with fallback" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/01-search-with-fallback.ts">
Constrained search with a fallback category. The agent evaluates results, rejects with reasons, and switches on its own. **AI**
<Card title="In-box agent" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agentic/01-in-box-agent.ts">
Hand a goal to `box.agent.run`; the box's agent drives the browser through the chrome-devtools MCP and writes results to the box (needs an agent key; bills coding-agent tokens). **Agent**
</Card>

<Card title="Playwright vs act vs run" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/02-playwright-vs-act-vs-run.ts">
The same task via Playwright, `act` plus `extract`, and `run`. Pick your autonomy level by token cost. **AI**
</Card>

<Card title="Observe, record, audit" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/03-observe-record-audit.ts">
The search again with live view, session recording, a decision log, and token accounting. **AI**
</Card>

<Card title="Multisite feed" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/04-multisite-feed.ts">
One prompt and one schema across three differently structured sites. **AI**
<Card title="Build your own loop" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agentic/02-build-your-own-loop.ts">
A live `observe` then `act(action)` then `extract` loop you own, with `extract` as the stop check. **AI**
</Card>
</CardGroup>

Expand Down Expand Up @@ -90,10 +82,6 @@ The box as a test environment.
The box hosts the app under test and browses it on its own localhost.
</Card>

<Card title="AI smoke tests" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/testing/03-ai-smoke-tests.ts">
Agent-driven smoke flow, cross-checked by deterministic DOM assertions, recorded on video. **AI**
</Card>

<Card title="Visual regression" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/testing/04-visual-regression.ts">
Pixelmatch diffs against baselines stored on the box.
</Card>
Expand Down
26 changes: 7 additions & 19 deletions llms-full.txt
Original file line number Diff line number Diff line change
Expand Up @@ -2959,29 +2959,21 @@ Source: https://upstash.com/docs/box/overall/browser/cookbook
Every example is a single self-contained file in the [Box SDK
repo](https://github.com/upstash/box/tree/main/packages/sdk/examples/browser).
All of them need `UPSTASH_BOX_API_KEY`. Examples marked **AI** use metered
browser AI (`run`, `act`, `extract`) and need a model provider key on the box
browser AI (`act`, `extract`, `observe`) and need a model provider key on the box
or account. Everything else runs with the Box key alone.
</Info>

## Agents
## Agentic browsing

Goal-driven browsing with `tab.run()`.
Goal-driven browsing: hand a goal to the box's agent, or drive your own loop.

<CardGroup cols={2}>
<Card title="Search with fallback" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/01-search-with-fallback.ts">
Constrained search with a fallback category. The agent evaluates results, rejects with reasons, and switches on its own. **AI**
</Card>

<Card title="Playwright vs act vs run" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/02-playwright-vs-act-vs-run.ts">
The same task via Playwright, `act` plus `extract`, and `run`. Pick your autonomy level by token cost. **AI**
<Card title="In-box agent" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agentic/01-in-box-agent.ts">
Hand a goal to `box.agent.run`; the box's agent drives the browser through the chrome-devtools MCP and writes results to the box (needs an agent key; bills coding-agent tokens). **Agent**
</Card>

<Card title="Observe, record, audit" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/03-observe-record-audit.ts">
The search again with live view, session recording, a decision log, and token accounting. **AI**
</Card>

<Card title="Multisite feed" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agents/04-multisite-feed.ts">
One prompt and one schema across three differently structured sites. **AI**
<Card title="Build your own loop" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/agentic/02-build-your-own-loop.ts">
A live `observe` then `act(action)` then `extract` loop you own, with `extract` as the stop check. **AI**
</Card>
</CardGroup>

Expand Down Expand Up @@ -3042,10 +3034,6 @@ The box as a test environment.
The box hosts the app under test and browses it on its own localhost.
</Card>

<Card title="AI smoke tests" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/testing/03-ai-smoke-tests.ts">
Agent-driven smoke flow, cross-checked by deterministic DOM assertions, recorded on video. **AI**
</Card>

<Card title="Visual regression" href="https://github.com/upstash/box/blob/main/packages/sdk/examples/browser/testing/04-visual-regression.ts">
Pixelmatch diffs against baselines stored on the box.
</Card>
Expand Down