# browserbase/skills architecture

> Architecture diagram of the GitHub repository browserbase/skills, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/browserbase/skills
- Repository: https://github.com/browserbase/skills

## Overview

Browserbase Skills is a Claude Code plugin: users request browser automation or research, Claude applies a task-specific skill, and scripts or agent workflows produce browser results, traces, reports, or generated artifacts. The principal analysis path is browser automation → trace capture → trace analysis → an OpenAPI specification. The README documents the broader skill capabilities; the sampled sources show selected implementations and helpers, so unsampled capabilities are represented at their existing skill-directory paths.

Main entry points: [`skills/browser-trace/scripts/bisect-cdp.mjs`](https://github.com/browserbase/skills/blob/main/skills/browser-trace/scripts/bisect-cdp.mjs) (Trace analysis), [`skills/autobrowse/scripts`](https://github.com/browserbase/skills/tree/main/skills/autobrowse/scripts) (Autobrowse), [`skills/autobrowse/scripts/codegen.mjs`](https://github.com/browserbase/skills/blob/main/skills/autobrowse/scripts/codegen.mjs) (Automation codegen), [`skills/autobrowse/codegen/runners/lib/tsx-runner.mjs`](https://github.com/browserbase/skills/blob/main/skills/autobrowse/codegen/runners/lib/tsx-runner.mjs) (Code runner)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browser["Browser automation"]
  node_browser_skill["Browser skill"]
  node_functions_skill["Functions skill"]
  node_ui_test["UI testing"]
  node_autobrowse["Autobrowse"]
  node_codegen["Automation codegen<br/>[codegen.mjs]"]
  node_code_runner["Code runner<br/>[tsx-runner.mjs]"]
end

subgraph group_trace["Trace and API"]
  node_trace_capture["Trace capture"]
  node_trace_analysis["Trace analysis<br/>[bisect-cdp.mjs]"]
  node_trace_query["Trace query<br/>[query.mjs]"]
  node_api_discovery["API discovery"]
  node_api_emission["OpenAPI emission<br/>[emit.mjs]"]
end

subgraph group_generation["Agent and tool generation"]
  node_prompt_optimizer["Prompt optimizer"]
  node_webmcp_generator["WebMCP generator"]
  node_webmcp_authoring["WebMCP authoring"]
end

subgraph group_research["Research workflows"]
  node_company_research["Company research"]
  node_event_prospecting["Event prospecting"]
  node_competitor_research["Competitor analysis"]
  node_partial_merge["Research merge<br/>[merge_partials.mjs]"]
  node_report_compile["Report compiler<br/>[compile_report.mjs]"]
end

subgraph group_safety["Safety and access"]
  node_safe_browser["Safe browser"]
  node_cookie_sync["Cookie sync<br/>[cookie-sync.mjs]"]
end

node_user(("User"))
node_claude(("Claude Code"))
node_browserbase["Browserbase"]
node_browse_cli["browse CLI"]
node_results["Reports and artifacts"]

node_user -->|"requests task"| node_claude
node_claude -->|"automates browser"| node_browser_skill
node_claude -->|"deploys functions"| node_functions_skill
node_claude -->|"tests interface"| node_ui_test
node_claude -->|"captures trace"| node_trace_capture
node_trace_capture -->|"bisects stream"| node_trace_analysis
node_trace_analysis -->|"enables search"| node_trace_query
node_trace_analysis -->|"supplies capture"| node_api_discovery
node_api_discovery -.->|"emits specification"| node_api_emission
node_api_emission -->|"writes artifacts"| node_results
node_claude -->|"improves automation"| node_autobrowse
node_autobrowse -.->|"generates code"| node_codegen
node_codegen -->|"verifies script"| node_code_runner
node_code_runner -->|"runs against"| node_browserbase
node_claude -->|"optimizes prompts"| node_prompt_optimizer
node_claude -->|"authors init scripts"| node_webmcp_generator
node_claude -->|"adds site tools"| node_webmcp_authoring
node_claude -->|"builds agents"| node_safe_browser
node_safe_browser -->|"gates browser access"| node_browserbase
node_claude -->|"syncs cookies"| node_cookie_sync
node_cookie_sync -->|"syncs context"| node_browserbase
node_claude -->|"researches companies"| node_company_research
node_claude -->|"finds prospects"| node_event_prospecting
node_claude -->|"analyzes competitors"| node_competitor_research
node_competitor_research -->|"merges research"| node_partial_merge
node_partial_merge -.->|"provides findings"| node_report_compile
node_report_compile -->|"writes reports"| node_results
node_claude -->|"uses CLI"| node_browse_cli
node_browse_cli -->|"connects to"| node_browserbase

click node_browser_skill "https://github.com/browserbase/skills/tree/main/skills/browser"
click node_functions_skill "https://github.com/browserbase/skills/tree/main/skills/functions"
click node_ui_test "https://github.com/browserbase/skills/tree/main/skills/ui-test"
click node_trace_capture "https://github.com/browserbase/skills/tree/main/skills/browser-trace/scripts"
click node_trace_analysis "https://github.com/browserbase/skills/blob/main/skills/browser-trace/scripts/bisect-cdp.mjs"
click node_trace_query "https://github.com/browserbase/skills/blob/main/skills/browser-trace/scripts/query.mjs"
click node_api_discovery "https://github.com/browserbase/skills/tree/main/skills/browser-to-api/scripts"
click node_api_emission "https://github.com/browserbase/skills/blob/main/skills/browser-to-api/scripts/emit.mjs"
click node_autobrowse "https://github.com/browserbase/skills/tree/main/skills/autobrowse/scripts"
click node_codegen "https://github.com/browserbase/skills/blob/main/skills/autobrowse/scripts/codegen.mjs"
click node_code_runner "https://github.com/browserbase/skills/blob/main/skills/autobrowse/codegen/runners/lib/tsx-runner.mjs"
click node_prompt_optimizer "https://github.com/browserbase/skills/blob/main/skills/optimize-agent-prompt/scripts/optimize_agent_prompt.mjs"
click node_webmcp_generator "https://github.com/browserbase/skills/tree/main/skills/webmcp-gen/scripts"
click node_webmcp_authoring "https://github.com/browserbase/skills/tree/main/skills/add-webmcp/scripts"
click node_safe_browser "https://github.com/browserbase/skills/blob/main/skills/safe-browser/templates/claude-agent-sdk/hn-scraper-demo.mjs"
click node_cookie_sync "https://github.com/browserbase/skills/blob/main/skills/cookie-sync/scripts/cookie-sync.mjs"
click node_company_research "https://github.com/browserbase/skills/tree/main/skills/company-research/scripts"
click node_event_prospecting "https://github.com/browserbase/skills/tree/main/skills/event-prospecting/scripts"
click node_competitor_research "https://github.com/browserbase/skills/tree/main/skills/competitor-analysis/scripts"
click node_partial_merge "https://github.com/browserbase/skills/blob/main/skills/competitor-analysis/scripts/merge_partials.mjs"
click node_report_compile "https://github.com/browserbase/skills/blob/main/skills/competitor-analysis/scripts/compile_report.mjs"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_browser_skill,node_functions_skill,node_ui_test,node_autobrowse,node_codegen,node_code_runner,node_user,node_browserbase toneBlue
class node_trace_capture,node_trace_analysis,node_trace_query,node_api_discovery,node_api_emission toneAmber
class node_prompt_optimizer,node_webmcp_generator,node_webmcp_authoring toneMint
class node_company_research,node_event_prospecting,node_competitor_research,node_partial_merge,node_report_compile toneRose
class node_safe_browser,node_cookie_sync,node_claude,node_browse_cli,node_results toneIndigo
```

## Components

### Browser automation

- [Browser skill](https://github.com/browserbase/skills/tree/main/skills/browser): `skills/browser`
- [Functions skill](https://github.com/browserbase/skills/tree/main/skills/functions): `skills/functions`
- [UI testing](https://github.com/browserbase/skills/tree/main/skills/ui-test): `skills/ui-test`
- [Autobrowse](https://github.com/browserbase/skills/tree/main/skills/autobrowse/scripts): `skills/autobrowse/scripts`
- [Automation codegen](https://github.com/browserbase/skills/blob/main/skills/autobrowse/scripts/codegen.mjs): `skills/autobrowse/scripts/codegen.mjs`
- [Code runner](https://github.com/browserbase/skills/blob/main/skills/autobrowse/codegen/runners/lib/tsx-runner.mjs): `skills/autobrowse/codegen/runners/lib/tsx-runner.mjs`

### Trace and API

- [Trace capture](https://github.com/browserbase/skills/tree/main/skills/browser-trace/scripts): `skills/browser-trace/scripts`
- [Trace analysis](https://github.com/browserbase/skills/blob/main/skills/browser-trace/scripts/bisect-cdp.mjs): `skills/browser-trace/scripts/bisect-cdp.mjs`
- [Trace query](https://github.com/browserbase/skills/blob/main/skills/browser-trace/scripts/query.mjs): `skills/browser-trace/scripts/query.mjs`
- [API discovery](https://github.com/browserbase/skills/tree/main/skills/browser-to-api/scripts): `skills/browser-to-api/scripts`
- [OpenAPI emission](https://github.com/browserbase/skills/blob/main/skills/browser-to-api/scripts/emit.mjs): `skills/browser-to-api/scripts/emit.mjs`

### Agent and tool generation

- [Prompt optimizer](https://github.com/browserbase/skills/blob/main/skills/optimize-agent-prompt/scripts/optimize_agent_prompt.mjs): `skills/optimize-agent-prompt/scripts/optimize_agent_prompt.mjs`
- [WebMCP generator](https://github.com/browserbase/skills/tree/main/skills/webmcp-gen/scripts): `skills/webmcp-gen/scripts`
- [WebMCP authoring](https://github.com/browserbase/skills/tree/main/skills/add-webmcp/scripts): `skills/add-webmcp/scripts`

### Research workflows

- [Company research](https://github.com/browserbase/skills/tree/main/skills/company-research/scripts): `skills/company-research/scripts`
- [Event prospecting](https://github.com/browserbase/skills/tree/main/skills/event-prospecting/scripts): `skills/event-prospecting/scripts`
- [Competitor analysis](https://github.com/browserbase/skills/tree/main/skills/competitor-analysis/scripts): `skills/competitor-analysis/scripts`
- [Research merge](https://github.com/browserbase/skills/blob/main/skills/competitor-analysis/scripts/merge_partials.mjs): `skills/competitor-analysis/scripts/merge_partials.mjs`
- [Report compiler](https://github.com/browserbase/skills/blob/main/skills/competitor-analysis/scripts/compile_report.mjs): `skills/competitor-analysis/scripts/compile_report.mjs`

### Safety and access

- [Safe browser](https://github.com/browserbase/skills/blob/main/skills/safe-browser/templates/claude-agent-sdk/hn-scraper-demo.mjs): `skills/safe-browser/templates/claude-agent-sdk/hn-scraper-demo.mjs`
- [Cookie sync](https://github.com/browserbase/skills/blob/main/skills/cookie-sync/scripts/cookie-sync.mjs): `skills/cookie-sync/scripts/cookie-sync.mjs`

### Other components

- **User**
- **Claude Code**
- **Browserbase**
- **browse CLI**
- **Reports and artifacts**

## Connections

- User → Claude Code: requests task (evidence: `README.md`)
- Claude Code → Browser skill: automates browser (evidence: `README.md`)
- Claude Code → Functions skill: deploys functions (evidence: `README.md`)
- Claude Code → UI testing: tests interface (evidence: `README.md`)
- Claude Code → Trace capture: captures trace (evidence: `README.md`)
- Trace capture → Trace analysis: bisects stream (evidence: `README.md`)
- Trace analysis → Trace query: enables search (evidence: `README.md`)
- Trace analysis → API discovery: supplies capture (evidence: `README.md`)
- API discovery → OpenAPI emission: emits specification (evidence: `skills/browser-to-api/scripts/emit.mjs`)
- OpenAPI emission → Reports and artifacts: writes artifacts (evidence: `skills/browser-to-api/scripts/emit.mjs`)
- Claude Code → Autobrowse: improves automation (evidence: `README.md`)
- Autobrowse → Automation codegen: generates code
- Automation codegen → Code runner: verifies script
- Code runner → Browserbase: runs against
- Claude Code → Prompt optimizer: optimizes prompts (evidence: `README.md`)
- Claude Code → WebMCP generator: authors init scripts (evidence: `README.md`)
- Claude Code → WebMCP authoring: adds site tools (evidence: `README.md`)
- Claude Code → Safe browser: builds agents (evidence: `README.md`)
- Safe browser → Browserbase: gates browser access (evidence: `README.md`)
- Claude Code → Cookie sync: syncs cookies (evidence: `README.md`)
- Cookie sync → Browserbase: syncs context (evidence: `README.md`)
- Claude Code → Company research: researches companies (evidence: `README.md`)
- Claude Code → Event prospecting: finds prospects (evidence: `README.md`)
- Claude Code → Competitor analysis: analyzes competitors (evidence: `README.md`)
- Competitor analysis → Research merge: merges research (evidence: `skills/competitor-analysis/scripts/merge_partials.mjs`)
- Research merge → Report compiler: provides findings
- Report compiler → Reports and artifacts: writes reports (evidence: `skills/competitor-analysis/scripts/compile_report.mjs`)
- Claude Code → browse CLI: uses CLI (evidence: `README.md`)
- browse CLI → Browserbase: connects to (evidence: `README.md`)