Chrome, Node.js und Electron per CDP debuggen

Einschalten

Darstellung › Netzwerk-Targets aktivieren wählen.
Über das + neben Netzwerk-Targets in der Seitenleiste ein host:port hinzufügen, zum Beispiel localhost:9229.
Eine Seite oder einen Prozess auswählen: Rechts öffnen sich die DevTools.

Voreingestellt sind localhost:9229 und localhost:9333. Port 9222 gehört Tapscopes eigenem CDP-Endpunkt; nimm für deine Targets einen anderen. Tapscope prüft jede Adresse alle paar Sekunden und zeigt sie als offline, wenn nichts antwortet.

Chrome mit Debug-Port starten

Chrome braucht mit Debug-Port einen eigenen Profilordner:

"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --remote-debugging-port=9229 --user-data-dir=/tmp/tapscope-chrome

Seine Tabs erscheinen unter Chrome mit ihren Titeln. Das Kontextmenü bietet Neu laden, In den Vordergrund holen, Tab schließen, Neuen Tab öffnen …, URL kopieren und CDP-URL kopieren.

Node.js

node --inspect=9230 app.js

localhost:9230 als Netzwerk-Target hinzufügen. Node.js-Prozesse öffnen sich in den DevTools für Node, mit Console, Sources, Memory und Performance.

Electron

Die App mit einem Debug-Port für ihre Fenster starten (--remote-debugging-port=9333) und für den Hauptprozess mit --inspect=9230. Beide Ports lassen sich als Netzwerk-Targets hinzufügen.

config.json

Die Liste steht in ~/.tapscope/config.json und lässt sich dort bearbeiten, solange die App geschlossen ist:

{
  "devices": {
    "enableNetworkTargets": true,
    "networkTargets": ["localhost:9229", "localhost:9333"]
  }
}

Sicherheit

Um einen anderen Rechner zu debuggen, leite seinen Port stattdessen über SSH weiter und füge das lokale Ende hinzu:

ssh -L 9229:localhost:9229 user@build-host

Tapscopes eigener Endpunkt auf Port 9222 lauscht nur auf 127.0.0.1.