Skills

Browser Trace

Capture a full DevTools-protocol trace of any browser automation, CDP firehose...

Install

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

What it does

Capture a full DevTools-protocol trace of any browser automation, CDP firehose, screenshots, and DOM dumps, then bisect the stream into per-page searchable buckets. Use when the user wants to debug a failed run, audit network/console/DOM activity, attach a trace to an in-progress session, or feed structured per-page summaries back into an agent loop so its next iteration learns from the last one.

Browser Trace

Attach a second, read-only CDP client to a browser session that is already being driven by your main automation. The trace records the full DevTools firehose to NDJSON, polls for screenshots and DOM dumps in parallel, and slices everything into a directory tree that bash tools can search.

This skill does not drive pages, it only listens. Pair it with the browser skill, browse, Stagehand, Playwright, or anything else that speaks CDP.

When to use

  • The user wants to debug a browser-automation run (failing form, missing element, hung navigation, JS exception).
  • The user has a running automation and wants to attach a trace mid-flight without restarting it.
  • The user wants to split a CDP firehose into network / console / DOM / page buckets.
  • The user wants screenshots + DOM snapshots over time, joined to CDP events by timestamp.

If the user just wants to drive the browser, use the browser skill instead.

Setup check

node --version                                  # require Node 18+
which browse || npm install -g browse
which jq     || true                                # optional, used only for ad-hoc querying

Verify browse cdp exists:

browse --help | grep -q "^\s*cdp " || echo "browse cdp not available, update browse"

How it works

Every Chrome DevTools target accepts multiple concurrent CDP clients. Your main automation is one client; this skill adds a second one that only enables observation domains (Network, Console, Runtime, Log, Page) and never sends action commands.

The tracer has three pieces:

Read the whole SKILL.md on GitHub

More in Testing