# browserbase/browser-trace
Capture une trace complète du protocole DevTools de toute automatisation de navigateur — flux CDP, captures d'écran et dumps DOM — puis découpe le flux en compartiments par page consultables. Utilisez cette compétence lorsque vous souhaitez déboguer une exécution ayant échoué, auditer l'activité réseau/console/DOM, attacher une trace à une session en cours, ou fournir des résumés structurés par page à une boucle d'agent afin que sa prochaine itération apprenne de la précédente.
## Comment ça fonctionne
1. **Capture** : Lancez l'automatisation de votre navigateur et activez la trace via le protocole CDP.
2. **Enregistrement** : Le système enregistre chaque événement (requêtes réseau, messages console, mutations DOM).
3. **Découpage** : Le flux est automatiquement segmenté en pages (URL unique) pour faciliter l'analyse.
4. **Export** : Vous pouvez exporter la trace sous forme de rapport structuré ou la réinjecter dans un agent IA.
## Utilisation typique
```bash
# Exemple de commande pour démarrer une trace
browserbase trace --output ./mon-projet/trace.json
Configuration requise
- Environnement : Navigateur Chromium (via Puppeteer, Playwright, ou CDP natif).
- Dépendances : Aucune, la compétence gère automatiquement les connexions.
Formats de sortie
| Format | Description |
|---|---|
| JSON | Trace complète avec événements et métadonnées |
| Résumé | Synthèse textuelle par page |
| Screenshots | Images PNG des états de page |
Exemple d'analyse
// Pseudocode d'analyse d'une trace
const trace = await loadTrace('./trace.json');
trace.pages.forEach((page) => {
console.log(`Page : ${page.url}`);
console.log(`Erreurs console : ${page.consoleErrors.length}`);
console.log(`Requêtes réseau : ${page.networkRequests.length}`);
});
Notes importantes
- Les traces peuvent être volumineuses ; utilisez le filtrage par type d'événement pour réduire la taille.
- Les compartiments par page respectent les changements d'URL, y compris les fragments (
#). - Cette compétence s'intègre nativement avec les boucles d'agents comme Claude Code ou Cursor.
Pour toute question ou rapport de bogue, veuillez consulter le dépôt browserbase/browser-trace.