Browser Trace
Enregistre une trace CDP en lecture seule d'une exécution de navigateur et la divise en buckets consultables par page
Testé · Fonctionne
Ce que fait
Attache un second client Chrome DevTools Protocol en lecture seule à une session d'automatisation de navigateur, enregistre le flux CDP complet plus les captures d'écran et les dumps DOM en NDJSON, puis découpe le flux en buckets JSONL réseau/console/DOM/page par page avec une vue d'ensemble summary.json. Se déclenche lorsque l'utilisateur souhaite déboguer une exécution d'automatisation de navigateur échouée, auditer l'activité réseau/console, attacher une trace à une session en cours, ou réinjecter des résumés par page dans une boucle d'agent. Nécessite le CLI `browse` (Browserbase) pour la partie de capture en direct ; le bisecteur et les outils de requête fonctionnent uniquement sur la bibliothèque standard Node.
Rapport de test
Cloned la compétence, confirmé que les 8 scripts + REFERENCE/EXAMPLES existent (vérification ponctuelle de 3 scripts, HTTP 200). Analyse de sécurité propre : la seule utilisation de child_process lance le CLI `browse` local via des tableaux d'arguments (pas de chaîne de shell, pas de curl|sh, pas de base64, pas d'exfiltration de secrets). Impossible d'exécuter la partie de capture en direct (CLI `browse` non installé), mais le bisecteur est purement stdlib Node, j'ai donc construit manuellement un flux CDP synthétique de 10 événements sur deux pages et exécuté bisect-cdp.mjs + query.mjs pour de vrai : il a correctement divisé en pages/000 (example.com) et pages/001 (app.example.com/login), attribué les 3 échecs par page (network.failed + console.error à pid0, runtime.exception à pid1), et écrit un summary.json par page avec des regroupements de domaines et des comptes network byType — correspondant exactement à la forme documentée. Vérifié que le package npm `browse` (dernière version 0.9.5) est le CLI Browserbase que la documentation référence.
Testé le: 2026-07-21 · Claude Code 2.x (agent harness)
Installation
git clone --depth 1 https://github.com/mxyhi/ok-skills.git /tmp/browser-trace-src mkdir -p ~/.claude/skills cp -R /tmp/browser-trace-src/browser-trace ~/.claude/skills/browser-trace # Live capture requires the Browserbase CLI: npm install -g browse (provides `browse cdp`) # Local runs need Chrome launched with --remote-debugging-port=9222; remote runs need BROWSERBASE_API_KEY # Optional: jq for ad-hoc querying of the bisected JSONL files # The bisect-cdp.mjs / query.mjs analysis scripts need only Node 18+ (no npm install, no browse CLI)
Commandes et exemples de prompts
/browser-traceEnregistre une trace CDP en lecture seule d'une exécution de navigateur et la divise en buckets consultables par page
Les skills se déclenchent sur des demandes en langage courant — aucune commande à retenir. Après installation, des prompts comme ceux-ci l'activent (en anglais) :
Capture a trace of this failing browser runAudit network and console activity from the last runAttach a trace to my in-progress automation session