Debugging Chrome-Erweiterung mit Zugriff auf chrome.devtools api

Question

Ich bin Anfänger in Chrome-Erweiterungen Entwicklung. Ich muss vorhandene Erweiterung (angularjs-batarang) erweitern, aber ich habe einige Probleme mit dem Debuggen.

manifest.json hat Einträge:

"background": { 
    "page": "background.html" 
    }, 
    "devtools_page": "devtoolsBackground.html" 

Die Frage ist: Wie devtools_page zu debuggen? Ich fügte hinzu manifest.json zusätzlichen Eintrag "options_page": "devtoolsBackground.html" und wenn ich diese Erweiterung zu Chrome hinzufügen habe ich die Möglichkeit, options Seite von chrome://extensions laufen. Es funktioniert, weil die Anwendung an Haltepunkten stoppt. Leider habe ich keinen Zugriff auf chrome.devtools API. Also ist es keine Lösung.

Wie kann ich dies debuggen und Zugriff auf diese API haben?

Answer 1

Um die Entwickler-Tools für eine devtools Seite zu öffnen, habe ich die folgenden Schritte in der Regel folgen:

1. öffnen die Entwicklertools.
2. Entfernen Sie die Entwickler-Tools, falls noch nicht geschehen (über die Schaltfläche in der unteren linken Ecke).
3. Drücken Ctrl +Umschalt +J die Entwicklertools der Entwickler-Tools zu öffnen.
4. Optional: Fühlen Sie sich frei, um die Entwickler-Tools wieder andocken, wenn man es aus „<top frame>“ zu devtoolsBackground.html 2.
5. wechseln Schritt abgedockt hatte (oder was auch immer Namen, den Sie haben für Ihren devtools gewählt). (example)
6. Jetzt können Sie die Registerkarte Konsole verwenden, um mit der API chrome.devtools zu spielen.