Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
browserbase avatar

Browser To Api

  • 1.6k installs
  • 3.7k repo stars
  • Updated August 3, 2026
  • browserbase/skills

browser-to-api is an agent skill that turn a website's observable http traffic into a best-effort openapi 3.1 spec by analyzing a `browser-trace` capture. use when the user wants to discover/extract api endpoints from a

About

browser-to-api is an agent skill from browserbase/skills that turn a website's observable http traffic into a best-effort openapi 3.1 spec by analyzing a `browser-trace` capture. use when the user wants to discover/extract api endpoints from a browser session, b. # Browser to API Replay-driven API discovery. Consume a `browser-trace` capture, pair its CDP request / response events, templatize observed URLs, infer JSON schemas from samples, and emit an **OpenAPI 3.1** document plus a human-readable coverage report. This skill **does not capture traffic**. It is purely offline post-processing on top of `bro Developers invoke browser-to-api during ship/testing work for testing & qa tasks. The skill documents triggers, prerequisites, and step-by-step workflows grounded in SKILL.md. Compatible with Claude Code, Cursor, and Codex agent runtimes that load marketplace skills.

  • browser-trace → .o11y/<run>/cdp/network/{requests,responses}.jsonl
  • browser-to-api → .o11y/<run>/api-spec/index.html + openapi.yaml + client.mjs
  • The user wants an OpenAPI document for a third-party or undocumented website API.
  • The user has a `browser-trace` run and wants endpoints + schemas extracted from it.
  • The user is building a client/SDK against a site that doesn't publish a spec.

Browser To Api by the numbers

  • 1,597 all-time installs (skills.sh)
  • +26 installs in the week ending Aug 5, 2026 (Skillselion tracking)
  • Ranked #468 of 2,153 Testing & QA skills by installs in the Skillselion catalog
  • Security screen: HIGH risk (skills.sh audit)
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
At a glance

browser-to-api capabilities & compatibility

Capabilities
browser trace → .o11y/<run>/cdp/network/{request · browser to api → .o11y/<run>/api spec/index.html · the user wants an openapi document for a third p · the user has a `browser trace` run and wants end · the user is building a client/sdk against a site
Use cases
orchestration
From the docs

What browser-to-api says it does

This skill **does not capture traffic**. It is purely offline post-processing on top of `browser-trace`'s `cdp/network/*.jsonl` buckets. The two skills compose:
SKILL.md
browser-trace → .o11y/<run>/cdp/network/{requests,responses}.jsonl
SKILL.md
browser-to-api → .o11y/<run>/api-spec/index.html + openapi.yaml + client.mjs
SKILL.md
npx skills add https://github.com/browserbase/skills --skill browser-to-api

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs1.6k
repo stars3.7k
Security audit2 / 3 scanners passed
Last updatedAugust 3, 2026
Repositorybrowserbase/skills

What it does

Turn a website's observable HTTP traffic into a best-effort OpenAPI 3.1 spec by analyzing a `browser-trace` capture. Use when the user wants to discover/extract API endpoints from a browser session, b

Who is it for?

Developers working on testing & qa during ship tasks.

Skip if: Tasks outside Testing & QA scope described in SKILL.md.

When should I use this skill?

Turn a website's observable HTTP traffic into a best-effort OpenAPI 3.1 spec by analyzing a `browser-trace` capture. Use when the user wants to discover/extract API endpoints from a browser session, b

What you get

Completed testing & qa workflow aligned with SKILL.md steps.

  • OpenAPI endpoint specification
  • Pipeline stage artifacts

By the numbers

  • Skill version 0.1.0
  • Five-stage pipeline: load, filter, normalize, infer, emit

Files

SKILL.mdMarkdownGitHub ↗

Browser to API

Replay-driven API discovery. Consume a browser-trace capture, pair its CDP request / response events, templatize observed URLs, infer JSON schemas from samples, and emit an OpenAPI 3.1 document plus a human-readable coverage report.

This skill does not capture traffic. It is purely offline post-processing on top of browser-trace's cdp/network/*.jsonl buckets. The two skills compose:

browser-trace    →  .o11y/<run>/cdp/network/{requests,responses}.jsonl
browser-to-api   →  .o11y/<run>/api-spec/index.html + openapi.yaml + client.mjs

When to use

  • The user wants an OpenAPI document for a third-party or undocumented website API.
  • The user has a browser-trace run and wants endpoints + schemas extracted from it.
  • The user is building a client/SDK against a site that doesn't publish a spec.
  • The user wants a coverage report showing which flows would broaden the spec.

If the user wants to capture traffic, send them to browser-trace first.

Two-step workflow

1. Capture with browser-trace (and optionally bodies via browse network on)

# Local example against an existing debuggable Chrome target
TARGET=9222

node ../browser-trace/scripts/start-capture.mjs "$TARGET" my-site
browse open about:blank --cdp "$TARGET"
browse network on                                    # capture request/response bodies
browse open https://example.com
# ...drive whatever flows you want covered...

# Snapshot the bodies dir BEFORE turning capture off (the temp dir is shared
# per-session, so subsequent `browse network on` runs would mix your bodies
# with whatever a future capture writes if you skip this step).
cp -r "$(browse network path | jq -r .path)" .o11y/my-site/cdp/network/bodies/
browse network off

node ../browser-trace/scripts/stop-capture.mjs my-site
node ../browser-trace/scripts/bisect-cdp.mjs my-site

browse network on is optional but strongly recommended — without it, the spec has no response-body schemas (the CDP firehose used by browse cdp does not embed bodies). With it, both request bodies (already captured by CDP) and response bodies are joined into the trace by CDP requestId.

2. Generate the spec

node scripts/discover.mjs --run .o11y/my-site
# → .o11y/my-site/api-spec/index.html          ← open this
#   .o11y/my-site/api-spec/client.mjs
#   .o11y/my-site/api-spec/openapi.yaml
#   .o11y/my-site/api-spec/openapi.json
#   .o11y/my-site/api-spec/report.md
#   .o11y/my-site/api-spec/confidence.json
#   .o11y/my-site/api-spec/samples/*.json
#   .o11y/my-site/api-spec/intermediate/*.jsonl

discover.mjs auto-detects <run>/cdp/network/bodies/. To use a body capture from elsewhere (e.g. didn't snapshot, want the live browse network dir), pass --bodies <path> explicitly.

3. Open the HTML report

After discover.mjs finishes, always open the generated HTML report:

open .o11y/my-site/api-spec/index.html

The report is a self-contained HTML file (no server needed) that shows each discovered operation as an expandable card with variables, client usage, request/response examples, and a generated client.mjs snippet at the bottom. This is the primary deliverable — always open it for the user.

CLI flags

FlagRequiredMeaning
--run <path>yesPath to a browser-trace run directory
--out <path>noOutput dir; default <run>/api-spec/
--bodies <path>nobrowse network capture dir to join into the trace (auto-detected from <run>/cdp/network/bodies/ when present)
--include <regex>noOnly include URLs matching regex (repeatable)
--exclude <regex>noExclude URLs matching regex (repeatable; in addition to defaults)
--origins <list>noComma-separated origin allow-list (e.g. api.example.com,example.com)
`--format <yaml\json\both>`
--title <string>noOpenAPI info.title. Default derived from primary origin
--redact <list>noExtra header names / JSON keys to redact (comma-separated)
--min-samples <n>noMinimum samples per endpoint to include. Default 1
--stage <name>noRun only one stage: load, filter, normalize, infer, emit

Output layout

<run>/api-spec/
├── index.html                visual report — open this (self-contained, no server)
├── client.mjs                zero-dep fetch client with typed functions per operation
├── openapi.yaml              machine-readable spec
├── openapi.json              mirror
├── report.md                 markdown summary + curl examples
├── confidence.json           per-endpoint confidence + normalization flags
├── samples/                  redacted request/response examples
│   └── <method>__<path-hash>.json
└── intermediate/             pipeline byproducts (paired/filtered/endpoints jsonl)

What you get from browse cdp and browse network

Two complementary capture sources:

SourceProvidesLimitation
browse cdp (used by browser-trace)request method/URL/headers/postData, response status/headers/mimeType, full event timingDoes not embed response bodies. Bodies must be pulled with Network.getResponseBody, which the firehose doesn't do.
browse network on (separate command)request bodies AND response bodies on disk, keyed by CDP requestIdCapture dir is shared per browse session; snapshot before another browse network on overwrites it.

discover.mjs will pull bodies from a browse network dir if you pass --bodies <path> (or stash them under <run>/cdp/network/bodies/, which is auto-detected). The matching is by requestIdbrowse network writes that into each request.json as id, and we join directly.

What changes when bodies are present:

  • ✅ Path templating, query-param schemas, status codes, content-types — same either way.
  • ✅ Request-body schemas — postData from CDP is enough; bodies dir is a nice-to-have for non-postData cases.
  • Response-body schemas — fully inferred from real samples. Without bodies you get { description, content: <mimeType> } skeletons.

The report flags every endpoint that has no response-body sample.

Automatic noise filtering

The normalize stage automatically classifies and drops infrastructure noise:

  • Tracking / analytics — paths containing /track, /pixel, /beacon, /impression, /pageview, /dag/v*
  • Bot defense — Akamai (/akam/), fingerprint payloads (sensor_data), obfuscated multi-segment paths
  • Session plumbing/session, /authenticate/start, cookie consent, A/B experiment endpoints
  • HTML page rendersGET requests returning text/html (the rendered page, not the API)

This typically drops 60-80% of captured traffic. The --include flag can rescue a false positive.

GraphQL / multiplexed endpoint decomposition

When a single endpoint (like /dapi/fe/gql) is called with different operationName values, the skill automatically splits it into separate logical operations. Each gets its own:

  • OpenAPI path entry (e.g. /dapi/fe/gql [Autocomplete])
  • Request/response schema inferred from only that operation's samples
  • Curl example and variables table in the report

Detection works on body fields (operationName, method, action) and query params (opname, op). This covers GraphQL (APQ and inline), JSON-RPC, and similar dispatch patterns.

Limitations

  • Coverage is bounded by the captured flow. Endpoints not exercised in the trace will not appear. The skill cannot prove completeness.
  • Schemas are inductive, not contractual. A field might be optional on the server even if every sample contained it.
  • Auth is observed, not specified. The skill records auth-shaped headers in an x-observed-auth extension but won't claim a security scheme.
  • Path templating is heuristic. Numeric / UUID / hex / slug patterns are detected per segment. Ambiguous URLs are flagged in confidence.json.
  • Redaction is best-effort. Default redactions cover common credentials, but app-specific secrets may slip through; use --redact for known custom headers/keys.

Best practices

1. Drive the flows you want documented. The richer the browser-trace, the richer the spec. 2. Use `--origins` for noisy sites. A marketing page hits dozens of analytics hosts; restrict to the API origin you care about. 3. Inspect `report.md` first. It has curl-ready examples and response samples for every discovered operation. 4. Bump `--min-samples` to 2+ when you want only confidently-shaped endpoints in the final doc — drop the long tail. 5. Pair with `browse network on` when response-body schemas matter. The CDP firehose alone has request bodies but not response bodies.

For pipeline internals and the file format reference, see REFERENCE.md.

Related skills

How it compares

Pick browser-to-api when UI-only sites need a documented OpenAPI surface; pick direct Playwright skills when ephemeral scripts suffice without an emitted contract.

FAQ

What does browser-to-api do?

Turn a website's observable HTTP traffic into a best-effort OpenAPI 3.1 spec by analyzing a `browser-trace` capture. Use when the user wants to discover/extract API endpoints from a browser session, b

When should I use browser-to-api?

During ship testing work for testing & qa.

Is browser-to-api safe to install?

Review the Security Audits panel on this listing before production use.

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.