Browser

CDP-Skripte zum Starten von Chrome, Navigieren, Ausführen von JS, Screenshots und Auswählen von DOM-Elementen (macOS)

von iamzhihuix · iamzhihuix/happy-claude-skills

Getestet · Funktioniert ★ 8.4/10

Browser — CDP-Skripte zum Starten von Chrome, Navigieren, Ausführen von JS, Screenshots und Auswählen von DOM-Elementen (macOS)

Was es kann

Eine Reihe von Node.js puppeteer-core-Skripten, die einen echten Chrome über das DevTools Protocol auf Port 9222 steuern: Chrome starten, Tabs navigieren, JavaScript auf der gerenderten Seite ausführen, Viewport-Screenshots erstellen und DOM-Elemente interaktiv auswählen. Wird ausgelöst bei Anfragen zum Browsen oder Scrapen einer Website, zum Erstellen eines Seiten-Screenshots, zum Automatisieren eines Browsers oder zum Extrahieren des gerenderten DOM. Da es JS gegen die live gerenderte Seite ausführt, liest es Inhalte, die rohe HTTP-Fetches übersehen; beachten Sie, dass die Skripte macOS Chrome-Pfade fest codieren und start.js Ihren laufenden Chrome beendet.

Testbericht

Das Repo geklont und `npm install` ausgeführt (puppeteer-core, 0 Schwachstellen, postinstall chmod machte alle 5 Skripte +x). Um zu vermeiden, dass `killall 'Google Chrome'` von start.js den Live-Browser des Benutzers stört, startete ich einen isolierten Headless Chrome auf :9222 mit einem temporären Profil und führte nav.js/eval.js/screenshot.js direkt aus – alles funktionierte (Titel, Linkzählungen, IIFE-Objektextraktion, PNG nach tmp). AUSGABE: Auf der JS-gerenderten quotes.toscrape.com/js passte der Baseline-`curl` des rohen HTML zu 0 Zitaten und 0 Autoren, während nav.js+eval.js 10 Zitate und den Autor "Albert Einstein" aus dem gerenderten DOM extrahierte – ein entscheidender, zitierfähiger Unterschied. Installation/Docs abgewertet, weil start.js macOS-only-Pfade fest codiert und den laufenden Chrome zwangsweise beendet, worauf die Docs nur in einem Codekommentar hinweisen; keine Malware, curl|sh oder Exfiltration gefunden.

Getestet am: 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>'

Befehle & Beispiel-Prompts

/browserCDP-Skripte zum Starten von Chrome, Navigieren, Ausführen von JS, Screenshots und Auswählen von DOM-Elementen (macOS)

Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):

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

Vollständiger Testbericht (Englisch) →