Come impostare un breakpoint JavaScript dal codice in Chrome?

Voglio forzare il debugger di Chrome a interrompere una riga tramite codice , oppure usando una sorta di tag di commento come qualcosa del genere console.break().

Puoi usare debugger;nel tuo codice. Se la console per sviluppatori è aperta, l'esecuzione verrà interrotta. Funziona anche in firebug.

Impostare un listener di clic sui pulsanti e chiamare il debugger;

Esempio

$("#myBtn").click(function() {
 debugger;   
});

dimostrazione

http://jsfiddle.net/hBCH5/

Risorse sul debug in JavaScript

• http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/
• http://berzniz.com/post/78260747646/5-javascript-debugging-tips-youll-start-using-today

Puoi anche usare debug(function), per interrompere quando functionviene chiamato.

Riferimento API della riga di comando: debug

Come altri hanno già detto, debugger;è la strada da percorrere. Ho scritto un piccolo script che è possibile utilizzare dalla riga di comando in un browser per impostare e rimuovere il punto di interruzione proprio prima della chiamata della funzione: http://andrijac.github.io/blog/2014/01/31/javascript-breakpoint/

Nella scheda "Script", vai dove si trova il tuo codice. A sinistra del numero di riga, fai clic su. Questo imposterà un breakpoint.

Immagine dello schermo:

Sarai quindi in grado di tracciare i tuoi punti di interruzione nella scheda a destra (come mostrato nello screenshot).

debugger è una parola chiave riservata di EcmaScript e ha fornito la semantica opzionale da ES5

Di conseguenza, può essere utilizzato non solo su Chrome, ma anche su Firefox e Node.js tramitenode debug myscript.js .

Lo standard dice :

Sintassi

DebuggerStatement :
    debugger ;

Semantica

La valutazione della produzione di DebuggerStatement può consentire a un'implementazione di causare un punto di interruzione quando viene eseguita in un debugger. Se un debugger non è presente o attivo questa affermazione non ha alcun effetto osservabile.

La produzione DebuggerStatement: debugger; è valutato come segue:

1. Se è disponibile e abilitata una funzione di debug definita dall'implementazione, allora
   1. Eseguire un'azione di debug definita dall'implementazione.
   2. Lascia che il risultato sia un valore di completamento definito dall'implementazione.
2. Altro
   1. Lascia che il risultato sia (normale, vuoto, vuoto).
3. Risultato di ritorno.

Nessuna modifica in ES6.

È possibile e ci sono molte ragioni per cui potresti voler fare questo. Ad esempio il debug di un ciclo infinito javascript vicino all'inizio del caricamento della pagina, che interrompe il corretto caricamento del set di strumenti per sviluppatori Chrome (o firebug).

Vedere la sezione 2 di

http://www.laurencegellert.com/2012/05/the-three-ways-of-setting-breakpoints-in-javascript/

oppure aggiungi semplicemente una riga contenente la parola debugger al tuo codice nel punto di test richiesto.

Punto di rottura :-

il punto di interruzione interromperà l'esecuzione e consentirà di esaminare i valori JavaScript.

Dopo aver esaminato i valori, è possibile riprendere l'esecuzione del codice (in genere con un pulsante di riproduzione).

Debugger: -

Il debugger; interrompe l'esecuzione di JavaScript e chiama la funzione di debug.

L'istruzione debugger sospende l'esecuzione, ma non chiude alcun file né cancella alcuna variabile.

Example:-
function checkBuggyStuff() {
  debugger; // do buggy stuff to examine.
};

Puoi anche impostare le debug(functionName)funzioni di debug.

https://developers.google.com/web/tools/chrome-devtools/javascript/breakpoints#function

Esistono molti modi per eseguire il debug del codice JavaScript. I seguenti due approcci sono ampiamente utilizzati per eseguire il debug di JavaScript tramite codice

1. Utilizzo console.log()per stampare i valori nella console del browser. (Questo ti aiuterà a capire i valori in determinati punti del tuo codice)

2. Parola chiave debugger. Aggiungi debugger;alle posizioni in cui desideri eseguire il debug, apri la console per gli sviluppatori del browser e vai alla scheda delle fonti.

Per ulteriori strumenti e modi in cui eseguire il debug del codice JavaScript, vengono forniti in questo collegamento da W3School .

Non consiglierei debugger;se vuoi semplicemente uccidere e interrompere il codice javascript, dal momento debugger;che congelerà temporaneamente il tuo codice javascript e non lo fermerà permanentemente.

Se vuoi uccidere e fermare correttamente il codice javascript al tuo comando usa quanto segue:

throw new Error("This error message appears because I placed it");