@mastra/mcp-docs-server 1.1.22-alpha.11 → 1.1.22-alpha.13

package/.docs/reference/browser/agent-browser.md

@@ -0,0 +1,374 @@
+# AgentBrowser class
+
+The `AgentBrowser` class provides deterministic browser automation using the [agent-browser](https://github.com/vercel-labs/agent-browser) library. It uses accessibility tree snapshots and element refs (e.g., `@e5`) for precise, reproducible interactions.
+
+Use `AgentBrowser` when you need reliable, deterministic browser automation. For AI-powered interactions using natural language, see [`StagehandBrowser`](https://mastra.ai/reference/browser/stagehand-browser).
+
+## Usage example
+
+```typescript
+import { Agent } from '@mastra/core/agent'
+import { AgentBrowser } from '@mastra/agent-browser'
+
+const browser = new AgentBrowser({
+  headless: true,
+  viewport: { width: 1280, height: 720 },
+  scope: 'thread',
+})
+
+export const browserAgent = new Agent({
+  name: 'browser-agent',
+  instructions: `You can browse the web. Use browser_snapshot to see the page structure,
+then interact with elements using their refs (e.g., @e5).`,
+  model: 'openai/gpt-5.4',
+  browser,
+})
+```
+
+## Constructor parameters
+
+**headless** (`boolean`): Whether to run the browser in headless mode (no visible UI). (Default: `true`)
+
+**viewport** (`{ width: number; height: number }`): Browser viewport dimensions. (Default: `{ width: 1280, height: 720 }`)
+
+**timeout** (`number`): Default timeout in milliseconds for browser operations. (Default: `30000`)
+
+**cdpUrl** (`string | (() => string | Promise<string>)`): CDP WebSocket URL for connecting to an existing browser. Useful for cloud browser providers.
+
+**scope** (`'shared' | 'thread'`): Browser instance scope. 'shared' shares one browser across all threads. 'thread' gives each thread its own browser. (Default: `'thread' (or 'shared' when cdpUrl is provided)`)
+
+**onLaunch** (`(args: { browser: MastraBrowser }) => void | Promise<void>`): Callback invoked after the browser is ready.
+
+**onClose** (`(args: { browser: MastraBrowser }) => void | Promise<void>`): Callback invoked before the browser closes.
+
+**screencast** (`ScreencastOptions`): Configuration for streaming browser frames to Studio.
+
+## Tools
+
+`AgentBrowser` provides 15 deterministic tools for browser automation. All tools that interact with elements use refs from the accessibility tree snapshot.
+
+### Core tools
+
+| Tool               | Description                                       |
+| ------------------ | ------------------------------------------------- |
+| `browser_goto`     | Navigate to a URL                                 |
+| `browser_snapshot` | Get accessibility tree snapshot with element refs |
+| `browser_click`    | Click an element by ref                           |
+| `browser_type`     | Type text into an element                         |
+| `browser_press`    | Press keyboard keys                               |
+| `browser_select`   | Select option from dropdown                       |
+| `browser_scroll`   | Scroll the page or element                        |
+| `browser_close`    | Close the browser                                 |
+
+### Extended tools
+
+| Tool               | Description                                     |
+| ------------------ | ----------------------------------------------- |
+| `browser_hover`    | Hover over an element                           |
+| `browser_back`     | Go back in browser history                      |
+| `browser_dialog`   | Handle browser dialogs (alert, confirm, prompt) |
+| `browser_wait`     | Wait for element state changes                  |
+| `browser_tabs`     | Manage browser tabs (list, new, switch, close)  |
+| `browser_drag`     | Drag and drop elements                          |
+| `browser_evaluate` | Execute JavaScript in the page (escape hatch)   |
+
+## Tool reference
+
+### `browser_goto`
+
+Navigate to a URL.
+
+```text
+// Tool input
+{
+  "url": "https://example.com",
+  "waitUntil": "domcontentloaded",
+  "timeout": 30000
+}
+```
+
+| Parameter   | Type                                            | Description                                     |
+| ----------- | ----------------------------------------------- | ----------------------------------------------- |
+| `url`       | `string`                                        | URL to navigate to                              |
+| `waitUntil` | `"load" \| "domcontentloaded" \| "networkidle"` | When to consider navigation complete (optional) |
+| `timeout`   | `number`                                        | Navigation timeout in ms (optional)             |
+
+### `browser_snapshot`
+
+Get an accessibility tree snapshot of the page. Returns element refs like `@e5` that you use with other tools.
+
+```text
+// Tool input
+{
+  "interactiveOnly": true,
+  "maxDepth": 10
+}
+```
+
+| Parameter         | Type      | Description                                  |
+| ----------------- | --------- | -------------------------------------------- |
+| `interactiveOnly` | `boolean` | Only include interactive elements (optional) |
+| `maxDepth`        | `number`  | Maximum tree depth (optional)                |
+
+**Example output:**
+
+```text
+[document] Example Page
+  [banner]
+    [link @e1] Home
+    [link @e2] About
+  [main]
+    [heading @e3] Welcome
+    [textbox @e4] Search...
+    [button @e5] Submit
+```
+
+### `browser_click`
+
+Click an element using its ref from the snapshot.
+
+```text
+{
+  "ref": "@e5",
+  "button": "left",
+  "clickCount": 1,
+  "modifiers": ["Control", "Shift"]
+}
+```
+
+| Parameter    | Type                            | Description                                    |
+| ------------ | ------------------------------- | ---------------------------------------------- |
+| `ref`        | `string`                        | Element ref from snapshot (required)           |
+| `button`     | `"left" \| "right" \| "middle"` | Mouse button (optional)                        |
+| `clickCount` | `number`                        | Number of activations, 2 for double (optional) |
+| `modifiers`  | `string[]`                      | Modifier keys (optional)                       |
+
+### `browser_type`
+
+Type text into an input element.
+
+```text
+// Tool input
+{
+  "ref": "@e4",
+  "text": "search query",
+  "clear": true,
+  "delay": 50
+}
+```
+
+| Parameter | Type      | Description                               |
+| --------- | --------- | ----------------------------------------- |
+| `ref`     | `string`  | Element ref from snapshot (required)      |
+| `text`    | `string`  | Text to type (required)                   |
+| `clear`   | `boolean` | Clear existing content first (optional)   |
+| `delay`   | `number`  | Delay between keystrokes in ms (optional) |
+
+### `browser_press`
+
+Press keyboard keys.
+
+```text
+// Tool input
+{
+  "key": "Enter",
+  "modifiers": ["Control"]
+}
+
+// Key combinations
+{ "key": "Control+a" }
+{ "key": "Control+c" }
+```
+
+| Parameter   | Type       | Description                                                       |
+| ----------- | ---------- | ----------------------------------------------------------------- |
+| `key`       | `string`   | Key name (e.g., "Enter", "Tab", "Escape", "Control+a") (required) |
+| `modifiers` | `string[]` | Modifier keys (optional)                                          |
+
+### `browser_select`
+
+Select an option from a dropdown. Provide one of `value`, `label`, or `index`.
+
+```text
+// Tool input - by value
+{
+  "ref": "@e10",
+  "value": "option-value"
+}
+
+// Tool input - by label
+{
+  "ref": "@e10",
+  "label": "Option Text"
+}
+
+// Tool input - by index
+{
+  "ref": "@e10",
+  "index": 0
+}
+```
+
+### `browser_scroll`
+
+Scroll the page or a specific element.
+
+```text
+// Tool input
+{
+  "direction": "down",
+  "amount": 300,
+  "ref": "@e15"
+}
+```
+
+| Parameter   | Type                                  | Description                                           |
+| ----------- | ------------------------------------- | ----------------------------------------------------- |
+| `direction` | `"up" \| "down" \| "left" \| "right"` | Scroll direction (required)                           |
+| `amount`    | `number`                              | Pixels to scroll, default 300 (optional)              |
+| `ref`       | `string`                              | Element to scroll, scrolls page if omitted (optional) |
+
+### `browser_hover`
+
+Hover over an element to trigger hover effects.
+
+```text
+// Tool input
+{
+  "ref": "@e7"
+}
+```
+
+### `browser_back`
+
+Go back in browser history.
+
+```text
+// Tool input (no parameters required)
+
+```
+
+### `browser_dialog`
+
+Handle browser dialogs (alert, confirm, prompt). Click an element that triggers a dialog and handle it.
+
+```text
+// Tool input
+{
+  "triggerRef": "@e5",
+  "action": "accept",
+  "text": "response"
+}
+```
+
+| Parameter    | Type                    | Description                                 |
+| ------------ | ----------------------- | ------------------------------------------- |
+| `triggerRef` | `string`                | Element that triggers the dialog (required) |
+| `action`     | `"accept" \| "dismiss"` | How to handle the dialog (required)         |
+| `text`       | `string`                | Text for prompt dialogs (optional)          |
+
+### `browser_wait`
+
+Wait for an element to reach a specific state.
+
+```text
+// Tool input
+{
+  "ref": "@e20",
+  "state": "visible",
+  "timeout": 30000
+}
+```
+
+| Parameter | Type                                                | Description                        |
+| --------- | --------------------------------------------------- | ---------------------------------- |
+| `ref`     | `string`                                            | Element ref to wait for (optional) |
+| `state`   | `"visible" \| "hidden" \| "attached" \| "detached"` | State to wait for (optional)       |
+| `timeout` | `number`                                            | Max wait time in ms (optional)     |
+
+### `browser_tabs`
+
+Manage browser tabs.
+
+```text
+// List all tabs
+{ "action": "list" }
+
+// Open new tab
+{ "action": "new", "url": "https://example.com" }
+
+// Switch to tab by index
+{ "action": "switch", "index": 0 }
+
+// Close tab by index
+{ "action": "close", "index": 1 }
+```
+
+### `browser_drag`
+
+Drag an element to a target location.
+
+```text
+// Tool input
+{
+  "sourceRef": "@e10",
+  "targetRef": "@e20"
+}
+```
+
+| Parameter   | Type     | Description                    |
+| ----------- | -------- | ------------------------------ |
+| `sourceRef` | `string` | Element to drag (required)     |
+| `targetRef` | `string` | Drop target element (required) |
+
+### `browser_evaluate`
+
+Execute JavaScript in the page context. Use as an escape hatch when other tools don't cover your use case.
+
+```text
+// Tool input
+{
+  "script": "document.title",
+  "returnValue": true
+}
+```
+
+| Parameter     | Type      | Description                             |
+| ------------- | --------- | --------------------------------------- |
+| `script`      | `string`  | JavaScript to execute (required)        |
+| `returnValue` | `boolean` | Whether to return the result (optional) |
+
+### `browser_close`
+
+Close the browser and clean up resources.
+
+```text
+// Tool input (no parameters required)
+
+```
+
+## How refs work
+
+The `browser_snapshot` tool returns an accessibility tree with element refs like `@e1`, `@e2`, etc. These refs are stable identifiers you use with other tools:
+
+1. Call `browser_snapshot` to see the page structure
+2. Find the element you want to interact with
+3. Use its ref with interaction tools like `browser_type` or `browser_scroll`.
+
+```text
+// 1. Get snapshot
+// Returns: [textbox @e4] Search... [link @e5] Home
+
+// 2. Type in the search box
+{ "tool": "browser_type", "input": { "ref": "@e4", "text": "mastra" } }
+
+// 3. Navigate to home
+{ "tool": "browser_goto", "input": { "url": "https://example.com" } }
+```
+
+## Related
+
+- [MastraBrowser](https://mastra.ai/reference/browser/mastra-browser): Base class reference
+- [StagehandBrowser](https://mastra.ai/reference/browser/stagehand-browser): AI-powered alternative
+- [Browser overview](https://mastra.ai/docs/browser/overview): Conceptual guide
+- [agent-browser guide](https://mastra.ai/docs/browser/agent-browser): Usage guide

package/.docs/reference/browser/mastra-browser.md

@@ -0,0 +1,284 @@
+# MastraBrowser class
+
+The `MastraBrowser` class is the abstract base class for browser automation providers. It defines the common interface for launching browsers, managing thread isolation, streaming screencasts, and handling input events.
+
+You don't instantiate `MastraBrowser` directly. Instead, use a provider implementation:
+
+- [`AgentBrowser`](https://mastra.ai/reference/browser/agent-browser): Deterministic browser automation using refs
+- [`StagehandBrowser`](https://mastra.ai/reference/browser/stagehand-browser): AI-powered browser automation using natural language
+
+## Usage example
+
+```typescript
+import { Agent } from '@mastra/core/agent'
+import { AgentBrowser } from '@mastra/agent-browser'
+
+const browser = new AgentBrowser({
+  headless: true,
+  viewport: { width: 1280, height: 720 },
+  scope: 'thread',
+})
+
+export const browserAgent = new Agent({
+  name: 'browser-agent',
+  instructions: 'You can browse the web to find information.',
+  model: 'openai/gpt-5.4',
+  browser,
+})
+```
+
+## Constructor parameters
+
+**headless** (`boolean`): Whether to run the browser in headless mode (no visible UI). (Default: `true`)
+
+**viewport** (`{ width: number; height: number }`): Browser viewport dimensions. Controls the size of the browser window. (Default: `{ width: 1280, height: 720 }`)
+
+**timeout** (`number`): Default timeout in milliseconds for browser operations. (Default: `10000`)
+
+**cdpUrl** (`string | (() => string | Promise<string>)`): CDP WebSocket URL, HTTP endpoint, or sync/async provider function. When provided, connects to an existing browser instead of launching a new one. HTTP endpoints are resolved to WebSocket internally. Can't be used with scope: 'thread' (automatically uses shared scope).
+
+**scope** (`'shared' | 'thread'`): Browser instance scope across threads. 'shared' means all threads share a single browser instance. 'thread' means each thread gets its own browser instance (full isolation). (Default: `'thread' (or 'shared' when cdpUrl is provided)`)
+
+**onLaunch** (`(args: { browser: MastraBrowser }) => void | Promise<void>`): Callback invoked after the browser reaches 'ready' status.
+
+**onClose** (`(args: { browser: MastraBrowser }) => void | Promise<void>`): Callback invoked before the browser is closed.
+
+**screencast** (`ScreencastOptions`): Configuration for streaming browser frames.
+
+**screencast.format** (`'jpeg' | 'png'`): Image format for screencast frames.
+
+**screencast.quality** (`number`): Image quality (1-100). Only applies to JPEG format.
+
+**screencast.maxWidth** (`number`): Maximum width for screencast frames.
+
+**screencast.maxHeight** (`number`): Maximum height for screencast frames.
+
+**screencast.everyNthFrame** (`number`): Capture every Nth frame to reduce bandwidth.
+
+## Properties
+
+The following properties (`id`, `name`, `provider`) are abstract and must be defined by concrete provider implementations:
+
+**id** (`string`): Unique identifier for this browser instance. Abstract - defined by provider.
+
+**name** (`string`): Human-readable name of the browser provider (e.g., 'AgentBrowser', 'StagehandBrowser'). Abstract - defined by provider.
+
+**provider** (`string`): Provider identifier (e.g., 'vercel-labs/agent-browser', 'browserbase/stagehand'). Abstract - defined by provider.
+
+**headless** (`boolean`): Whether the browser is running in headless mode.
+
+**status** (`BrowserStatus`): Current browser status: 'pending', 'launching', 'ready', 'error', 'closing', or 'closed'.
+
+## Methods
+
+### Lifecycle
+
+#### `ensureReady()`
+
+Ensures the browser is launched and ready for use. Automatically called before tool execution. Implemented in the base class.
+
+```typescript
+await browser.ensureReady()
+```
+
+#### `close()`
+
+Closes the browser and cleans up all resources. Implemented in the base class with race-condition-safe handling.
+
+```typescript
+await browser.close()
+```
+
+#### `isBrowserRunning()`
+
+Checks if the browser is currently running.
+
+```typescript
+const isRunning = browser.isBrowserRunning()
+```
+
+**Returns:** `boolean`
+
+### Thread management
+
+#### `setCurrentThread(threadId)`
+
+Sets the current thread ID for browser operations. Used internally by the agent runtime.
+
+```typescript
+browser.setCurrentThread('thread-123')
+```
+
+#### `getCurrentThread()`
+
+Gets the current thread ID.
+
+```typescript
+const threadId = browser.getCurrentThread()
+```
+
+**Returns:** `string`
+
+#### `hasThreadSession(threadId)`
+
+Checks if a thread has an active browser session.
+
+```typescript
+const hasSession = browser.hasThreadSession('thread-123')
+```
+
+**Returns:** `boolean`
+
+#### `closeThreadSession(threadId)`
+
+Closes a specific thread's browser session. For 'thread' scope, this closes that thread's browser instance. For 'shared' scope, this clears the thread's state.
+
+```typescript
+await browser.closeThreadSession('thread-123')
+```
+
+### Tools
+
+#### `getTools()`
+
+Returns the browser tools for use with agents. Each provider returns different tools based on its paradigm.
+
+```typescript
+const tools = browser.getTools()
+```
+
+**Returns:** `Record<string, Tool>`
+
+### Screencast
+
+#### `startScreencast(options?, threadId?)`
+
+Starts streaming browser frames. Returns a `ScreencastStream` that emits frame events.
+
+```typescript
+const stream = await browser.startScreencast({ format: 'jpeg', quality: 80 }, 'thread-123')
+
+stream.on('frame', frame => {
+  console.log('Frame received:', frame.data.length, 'bytes')
+})
+
+stream.on('stop', reason => {
+  console.log('Screencast stopped:', reason)
+})
+```
+
+**Returns:** `Promise<ScreencastStream>`
+
+### Input injection
+
+#### `injectMouseEvent(params, threadId?)`
+
+Injects a mouse event into the browser. Used by Studio for live interaction.
+
+```typescript
+await browser.injectMouseEvent({
+  type: 'mousePressed',
+  x: 100,
+  y: 200,
+  button: 'left',
+  clickCount: 1,
+})
+```
+
+#### `injectKeyboardEvent(params, threadId?)`
+
+Injects a keyboard event into the browser. Used by Studio for live interaction.
+
+```typescript
+await browser.injectKeyboardEvent({
+  type: 'keyDown',
+  key: 'Enter',
+  code: 'Enter',
+})
+```
+
+### State
+
+#### `getState(threadId?)`
+
+Gets the current browser state including URL and tabs.
+
+```typescript
+const state = await browser.getState('thread-123')
+console.log('Current URL:', state.currentUrl)
+console.log('Tabs:', state.tabs)
+```
+
+**Returns:** `Promise<BrowserState>`
+
+```typescript
+interface BrowserState {
+  currentUrl: string | null
+  tabs: BrowserTabState[]
+  activeTabIndex: number
+}
+
+interface BrowserTabState {
+  id: string
+  url: string
+  title: string
+}
+```
+
+#### `getCurrentUrl(threadId?)`
+
+Gets the current page URL.
+
+```typescript
+const url = await browser.getCurrentUrl()
+```
+
+**Returns:** `Promise<string | null>`
+
+## Browser scope
+
+The `scope` option controls how browser instances are shared across conversation threads:
+
+| Scope      | Description                                 | Use case                                 |
+| ---------- | ------------------------------------------- | ---------------------------------------- |
+| `'shared'` | All threads share a single browser instance | Cost-efficient for non-conflicting tasks |
+| `'thread'` | Each thread gets its own browser instance   | Full isolation for concurrent users      |
+
+```typescript
+// Shared browser for all threads
+const sharedBrowser = new AgentBrowser({
+  scope: 'shared',
+})
+
+// Isolated browser per thread
+const isolatedBrowser = new AgentBrowser({
+  scope: 'thread',
+})
+```
+
+When using `cdpUrl` to connect to an external browser, the scope automatically falls back to `'shared'` since you can't spawn new browser instances.
+
+## Cloud browser providers
+
+Connect to cloud browser services using the `cdpUrl` option:
+
+```typescript
+// Static CDP URL
+const browser = new AgentBrowser({
+  cdpUrl: 'wss://browser.example.com/ws',
+})
+
+// Dynamic CDP URL (e.g., session-based)
+const browser = new AgentBrowser({
+  cdpUrl: async () => {
+    const session = await createBrowserSession()
+    return session.wsUrl
+  },
+})
+```
+
+## Related
+
+- [AgentBrowser](https://mastra.ai/reference/browser/agent-browser): Deterministic browser automation
+- [StagehandBrowser](https://mastra.ai/reference/browser/stagehand-browser): AI-powered browser automation
+- [Browser overview](https://mastra.ai/docs/browser/overview): Conceptual guide to browser automation