Browser

Scripts CDP pour démarrer Chrome, naviguer, exécuter du JS, faire des captures d'écran et sélectionner des éléments DOM (macOS)

par iamzhihuix · iamzhihuix/happy-claude-skills

Testé · Fonctionne ★ 8.4/10

Browser — Scripts CDP pour démarrer Chrome, naviguer, exécuter du JS, faire des captures d'écran et sélectionner des éléments DOM (macOS)

Ce que fait

Un ensemble de scripts Node.js puppeteer-core qui pilotent un vrai Chrome via le protocole DevTools sur le port 9222 : démarrer Chrome, naviguer dans les onglets, évaluer du JavaScript dans la page rendue, prendre des captures d'écran du viewport et sélectionner interactivement des éléments DOM. Se déclenche sur les requêtes de navigation ou de scraping d'un site web, de capture d'écran d'une page, d'automatisation d'un navigateur ou d'extraction du DOM rendu. Parce qu'il exécute du JS sur la page rendue en direct, il lit du contenu que les requêtes HTTP brutes manquent ; notez que les scripts codent en dur les chemins Chrome macOS et start.js tue votre Chrome en cours d'exécution.

Rapport de test

Dépôt cloné et `npm install` exécuté (puppeteer-core, 0 vulnérabilités, postinstall chmod a rendu les 5 scripts +x). Pour éviter que `killall 'Google Chrome'` de start.js ne perturbe le navigateur en direct de l'utilisateur, j'ai lancé un Chrome headless isolé sur :9222 avec un profil temporaire et exécuté nav.js/eval.js/screenshot.js directement — tout a fonctionné (titre, nombre de liens, extraction d'objet IIFE, PNG vers tmp). SORTIE : sur quotes.toscrape.com/js rendu en JS, le `curl` de base du HTML brut a trouvé 0 citations et 0 auteurs, tandis que nav.js+eval.js ont extrait 10 citations et l'auteur "Albert Einstein" du DOM rendu — une différence décisive et notable. Installation/docs pénalisés car start.js code en dur des chemins macOS uniquement et tue de force le Chrome en cours d'exécution, ce que la documentation ne fait qu'insinuer dans un commentaire de code ; aucun malware, curl|sh, ou exfiltration trouvé.

Testé le: 2026-07-31 · Claude Code 2.x (agent harness)

Installation

git clone --depth 1 https://github.com/iamzhihuix/happy-claude-skills.git /tmp/browser-src
mkdir -p ~/.claude/skills
cp -R /tmp/browser-src/skills/browser ~/.claude/skills/browser
npm install --prefix ~/.claude/skills/browser
# Requires macOS + Google Chrome desktop at /Applications/Google Chrome.app (paths hardcoded in scripts/start.js).
# WARNING: start.js runs `killall 'Google Chrome'` then relaunches Chrome on :9222; it closes your existing Chrome windows.
# --profile rsyncs your real Chrome profile (cookies/logins) into ~/.cache/browser-tools.
# Scripts: start.js [--profile] | nav.js <url> [--new] | eval.js '<expr>' | screenshot.js | pick.js '<msg>'

Commandes et exemples de prompts

  • /browserScripts CDP pour démarrer Chrome, naviguer, exécuter du JS, faire des captures d'écran et sélectionner des éléments DOM (macOS)

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) :

  • Take a screenshot of this webpage
  • Scrape the product listings from this page
  • Extract the DOM structure of this site