JavaScript: come impostare un punto di interruzione condizionale negli strumenti del debugger di Chrome

100

Ho questo semplice file js, che stampa continuamente la data.

Utilizzo gli strumenti del debugger di Google Chrome (F12)

La mia domanda è: è possibile impostare un punto di interruzione condizionale in Google Chrome ??

Nel mio codice, voglio impostare un punto di interruzione se il valore dei secondi è uguale a 50 ??

s = date.getSeconds();

Questo è il jsfiddle dove si trova la mia fonte

(Non sono sicuro del motivo per cui non funziona in jsfiddle)

Ad ogni modo la mia domanda è: è possibile impostare un punto di interruzione condizionale negli strumenti del debugger di Chrome ??

javascript google-chrome

— Pawan
fonte

+1 perché non sapevo che fosse possibile fino a quando non sono andato a controllare la documentazione per rispondere a questa domanda. Grazie!

— Theraot

Risposte:

141

Sì, è possibile.

Fare clic con il pulsante destro del mouse sul marker del punto di interruzione e selezionare "Modifica punto di interruzione ..." lì è possibile impostare la condizione.

Dagli Strumenti per sviluppatori di Chrome su Breakpoints su developers.google.com (enfasi mia):

Nota: tutti i punti di interruzione che hai impostato vengono visualizzati in Punti di interruzione nella barra laterale di destra. Facendo clic sulla voce si salta alla riga evidenziata nel file sorgente. Dopo aver impostato un punto di interruzione, fare clic con il pulsante destro del mouse sull'indicatore del punto di interruzione del tag blu per impostare un'istruzione condizionale per quel punto di interruzione . Digita un'espressione e il punto di interruzione verrà sospeso solo se la condizione è vera.

— Theraot
fonte

Grazie, ho fatto come hai detto, modificato il punto di interruzione e impostato if (s == 50) ma perché non si ferma a quella condizione ??

— Pawan

@PreethiJain scrive solo la condizione "s == 50" (senza virgolette). A proposito, sono riuscito a far funzionare jsfiddle su: jsfiddle.net/nVpXN/6

— Theraot

Non è nemmeno necessario aggiungere un punto di interruzione per cominciare. Fai clic con il pulsante destro del mouse su una riga e fai clic "Aggiungi punto di interruzione condizionale ..." .

— Martin Ender

Cavolo, è il 2017 e sto imparando nuove cose di base su Chrome. #Grandiosità

— The Qodesmith

Questo controllerà semplicemente l'istruzione a questo punto nell'esecuzione del codice e quindi si interromperà se è così, lo stesso di un punto di interruzione all'interno di un'istruzione if. Penso che l'OP volesse sapere se il debugger controlla l'esecuzione di ciascuna istruzione se la condizione è soddisfatta e se è il debugger si interrompe su questa riga. Questo comportamento è molto più utile poiché non devi giocare a fare il detective per scoprire quando una variabile fa qualcosa di inaspettato.

— ejectamenta

Dai un'occhiata alla debuggerdichiarazione. Fondamentalmente richiama tutti gli strumenti di debugger disponibili e in Chrome si comporta come se l'interprete incontrasse un punto di interruzione.

Il tuo codice sarebbe:

s = date.getSeconds();
if (s == 50) {
   debugger;
}

Da riferimento :

[debugger] Richiama qualsiasi funzionalità di debug disponibile. Se non è disponibile alcuna funzionalità di debug, questa istruzione non ha effetto.

— madfriend
fonte

Anche se questo è in realtà più nello spirito del modo originale in cui è stata posta la domanda originale, ed è un'ottima informazione; Penso che la vera domanda riguardasse Chrome Tools, non ECMAscript. Detto ciò; c'è un avvertimento che dovrebbe essere aggiunto: rimuovere tutte le debuggerchiamate nel codice di produzione. (Sono abbastanza sicuro che il linting genererà un errore se il debugger è in giro, ma vale la pena richiamarlo ogni volta che viene sollevato l'argomento).

— Crispen Smith

non hai bisogno dell'istruzione del debugger, puoi anche avere un'istruzione vuota all'interno dell'if e aggiungere semplicemente un punto di interruzione lì.

— ejectamenta

Puoi impostare un punto di interruzione condizionale in Google Chrome, seguendo questi passaggi:

1.Fai clic con il pulsante destro del mouse sul punto di interruzione in cui vuoi fermarti, per favore continua

2.fai clic su "Aggiungi punto di interruzione condizionale", verrà visualizzato un testo, lì puoi aggiungere una condizione (il risultato sarà "vero" se la condizione è soddisfatta, altrimenti "falso"), il colore del punto di interruzione diventerà arancione dopo l'aggiunta della condizione, chk su

3. Ricarica la stessa pagina che puoi vedere che il punto di interruzione funzionerà se la condizione è soddisfatta come

— Deepan Raj
fonte