Skills

Browser To API

Turn a website's observable HTTP traffic into a best-effort OpenAPI 3.1 spec by...

Install

npx skills add browserbase/skills --skill browser-to-api -g -a claude-code -y
Repository
browserbase/skills3.7k
Category
Engineering
Updated
8d ago
License
MIT
Context cost
Mediumabout 2,236 tokens
Runs scripts
Yes, review before use

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, build an OpenAPI doc from network traffic, or document a third-party site's XHR/fetch surface for client integration.

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
Read the whole SKILL.md on GitHub

More in Engineering