google-chrome-extension
Integrazione degli strumenti per sviluppatori

Suggerimento programmatico del punto di interruzione

Aggiungi l'istruzione debugger nello script di contenuto

var foo = 1;
debugger;

foo = 2;

Aprire lo strumento di sviluppo nella pagina Web in cui viene iniettato lo script di contenuto per vedere la pausa dell'esecuzione del codice su tali righe.

Debug della pagina di sfondo / script

Lo script in background è come qualsiasi altro codice JavaScript. Puoi eseguire il debug utilizzando gli stessi strumenti che esegui il debug di altri codici JavaScript in Chrome.

Per aprire gli Strumenti per sviluppatori di Chrome, vai su chrome://extensions e attiva la modalità sviluppatore :

Ora puoi eseguire il debug di qualsiasi estensione con una pagina di sfondo o uno script. Basta scorrere fino all'estensione che si desidera eseguire il debug e fare clic sul collegamento della pagina di sfondo per ispezionarlo.

Suggerimento: per ricaricare l'estensione, puoi premere F5 all'interno della finestra degli strumenti di sviluppo. È possibile inserire punti di interruzione nel codice di inizializzazione prima di ricaricarlo.

Suggerimento: facendo clic con il pulsante destro del mouse sul pulsante di azione dell'estensione e selezionando "Gestisci estensioni" si aprirà la pagina chrome://extensions spostata su tale estensione.

Debug della finestra popup

Hai 2 modi per eseguire il debug della finestra popup. Entrambi i modi sono utilizzando Chrome DevTools.

Opzione 1: fare clic con il pulsante destro del mouse sul pulsante di azione dell'estensione e selezionare Controlla popup

Opzione 2: apri la finestra popup, direttamente nel browser come una scheda.

Ad esempio, se l'ID dell'estensione è abcdefghijkmnop e il tuo file html è popup.html . Vai all'indirizzo e vai a:

chrome-extension://abcdefghijklmnop/popup.html

Ora vedi il poup nella scheda normale. E puoi premere F12 per aprire gli strumenti di sviluppo.