web-dev-qa-db-fra.com

Comment mettre fin à l'exécution du script lors du débogage dans Google Chrome?

Lorsque vous parcourez le code JavaScript dans le débogueur Google Chrome, comment puis-je arrêter l'exécution du script si je ne souhaite pas continuer? Le seul moyen que j'ai trouvé est de fermer la fenêtre du navigateur.

Un clic sur "Recharger cette page" lance le reste du code et soumet même des formulaires comme si vous appuyiez sur F8 "Continuer".

UPDATE:

Lorsque vous appuyez sur F5 (Actualiser) lorsqu'un script est en pause:

  • Google Chrome (v22) exécute le script. Si le script soumet une requête HTTP, la réponse HTTP pour cette requête est affichée. La page d'origine n'est pas actualisée.
  • IE 9 vient de geler. Toutefois, IE dispose d'une option "Arrêter le débogage" qui, lorsqu'elle est activée (à condition que vous n'ayez pas appuyé sur F5 auparavant), continue à exécuter le script en dehors du débogueur.
  • Firebug se comporte de manière identique à Chrome.

Fermer puis rouvrir la fenêtre du navigateur n’est pas toujours le moyen le plus simple car cela va tuer l’état de la session du navigateur, ce qui peut être important. Tous vos points d'arrêt sont également perdus.

PDATE (Jan 2014):

Actualiser pendant le débogage:

  • Chrome v31: permet aux scripts de s'exécuter et s'arrête sur d'autres points d'arrêt (mais ne soumet pas de demandes ajax), puis s'actualise.
  • IE 11: l'actualisation ne fait rien, mais vous pouvez appuyer sur F5 pour continuer.
  • Firefox v26: permet aux scripts de s'exécuter, mais ne s'arrête pas sur les points d'arrêt suivants, soumet des requêtes ajax, puis s'actualise.

Genre de progrès!

Accédez à la même page lors du débogage:

  • Chrome v31: identique à Rafraîchir.
  • IE 11: les scripts sont terminés, une nouvelle session de navigateur est lancée (comme pour fermer et rouvrir à nouveau).
  • Firefox v26: rien ne se passe.

Aussi juacala a suggéré une solution de contournement efficace. Par exemple, si vous utilisez jQuery, l'exécution de delete $ à partir de la console arrêtera l'exécution dès qu'une méthode jQuery est rencontrée. Je l'ai testé dans tous les navigateurs ci-dessus et je peux confirmer qu'il fonctionne.

MISE À JOUR (mars 2015):

Enfin, après plus de 2 ans et près de 10 000 vues, Alexander K. donnait la bonne réponse. Google Chrome dispose de son propre gestionnaire de tâches qui peut supprimer un processus de tabulation sans fermer l'onglet lui-même, en gardant tous les points d'arrêt et autres éléments intacts.

Je suis même allé jusqu'à BrowserStack.com pour le tester dans Chrome v22 et j'ai constaté que cela fonctionnait ainsi même à cette époque.

La solution de contournement de Juacala est toujours utile lors du débogage dans IE ou Firefox.

PDATE (Jan 2019):

Enfin, Chrome Dev Tools a ajouté un moyen approprié d’arrêter l’exécution du script, ce qui est bien (même s’il est un peu caché). Reportez-vous à la réponse de James Gentes pour plus de détails.

182
srgstm

Dans Chrome, il existe un "Gestionnaire de tâches", accessible via Shift+ESC ou à travers

Menu → Plus d'outils → Gestionnaire de tâches

Vous pouvez sélectionner votre tâche de page et la terminer en appuyant sur le bouton "Terminer le processus".

175
Alexander K

À compter de avril 2018, vous pouvez arrêter des boucles infinies dans Chrome :

  1. Ouvrez le panneau Sources .
  2. Cliquez sur Pause . Le bouton devient Reprendre l'exécution du script .
  3. Suspendre Reprendre l’exécution du script puis sélectionner Arrêter l’appel JavaScript actuel .
67
James Gentes

Une façon de le faire est de suspendre le script, regardez le code qui suit où vous êtes actuellement arrêté, par exemple:

var something = somethingElse.blah;

Dans la console, procédez comme suit:

delete somethingElse;

Puis jouez le script: cela provoquera une erreur fatale lorsqu’il essaiera d’accéder à somethingElse et le script mourra. Voilà, vous avez terminé le script.

EDIT: À l'origine, j'ai supprimé une variable. Cela ne suffit pas. Vous devez supprimer une fonction ou un objet pour lequel JavaScript tente d'accéder à une propriété.

37
juacala

En vous référant à la réponse donnée par @scottndecker à la question suivante question , chrome fournit désormais une option "Désactiver JavaScript" sous Outils de développement:

  • Vertical ... en haut à droite
  • Paramètres
  • Et sous "Préférences", allez à la section "Débogueur" tout en bas et sélectionnez "Désactiver JavaScript".

La bonne chose est que vous pouvez arrêter et réexécuter à nouveau simplement en cochant/décochant.

4
theFreedomBanana

Bonne question ici. Je pense que vous ne pouvez pas terminer l'exécution du script. Bien que je ne l'aie jamais cherché, j'utilise le débogueur chrome pendant assez longtemps au travail. Je définis généralement des points d'arrêt dans mon code javascript, puis je débogue la partie de code qui m'intéresse. Lorsque je termine le débogage de ce code, je lance généralement le reste du programme ou actualise le navigateur.

Si vous souhaitez empêcher l'exécution du reste du script (par exemple, en raison de AJAX appels à effectuer) , vous ne pouvez supprimer que ce code dans la console à la volée, empêchant ainsi l'exécution de ces appels , vous pouvez alors exécuter le code restant sans problème.

J'espère que ça aide!

P.S: J'ai essayé de trouver une option pour mettre fin à l'exécution dans certains tutoriels/guides comme les suivants, mais je ne l'ai pas trouvée. Comme je l'ai dit précédemment, il n'y a probablement aucune option de ce type.

http://www.codeproject.com/Articles/273129/Beginner-Guide-to-Page-and-Script-Debugging-with-C

http://www.nsbasic.com/app/tutorials/TT10.htm

3

Si vous rencontrez cela en utilisant l'instruction debugger,

debugger;

... alors je pense que la page continuera à fonctionner indéfiniment jusqu'à ce que le runtime de js donne, ou la prochaine pause. En supposant que vous soyez en mode de pause sur erreur (la bascule icône-pause), vous pouvez vous assurer qu'une pause se produit en effectuant les opérations suivantes:

debugger;throw 1;

ou peut-être appeler une fonction inexistante:

debugger;z();

(Bien sûr, cela n’aide en rien si vous essayez d’exploiter des fonctions, mais vous pourriez peut-être ajouter dynamiquement un throw 1 ou z() ou un élément du panneau Sources, ctrl-S pour enregistrer puis ctrl-R pour rafraîchir ... ceci peut toutefois ignorer un point d'arrêt, mais peut fonctionner si vous êtes en boucle.)

Si vous faites une boucle et prévoyez de déclencher à nouveau l'instruction debugger, vous pouvez simplement taper throw 1 à la place.

throw 1;

Ensuite, lorsque vous appuierez sur Ctrl-R, le prochain lancer sera touché et la page s'actualisera.

(testé avec Chrome v38, vers avril 2017)

3
ninjagecko

Vous pouvez le faire, mais vous devez d'abord préparer votre code.

Instructions pour arrêter l'exécution de scripts dans Google Chrome Outils de développement:

(1) Préparez d’abord votre code en créant une variable :

var devquit=0;
$(document).ready({
    //the rest of your code

(2) Tout lieu où vous voudrez peut-être arrêter, testez la valeur de cette variable:

//Lotsa code
if (devquit > 0) return false;

(3) Suspendre l'exécution du script juste avant la ou les lignes de test ci-dessus.

(4) Passer à la console

(5) Type:

> devquit
0
> devquit=1   <=== only this line is necessary
> devquit
1

(6) Continuer l'exécution du script. Le script va return false lorsqu'il exécute le test de l'étape (2) ci-dessus


Remarques:

(A) Cette astuce fonctionne avec les variables globales et les objets, mais pas avec les variables locales. Notez que ceci:
newVar = 'never used before';
crée une nouvelle propriété de l'objet window (fonctionne avec l'astuce ci-dessus), :
var newVar = 'never used before';
crée une variable locale (ne fonctionne PAS avec l'astuce ci-dessus!)

(B) Donc, vous pouvez toujours utiliser cette astuce avec du code déjà en marche si vous avez soit une variable globale ou un objet qui renverra false s'il a une valeur donnée.

(C) En un clin d'œil, vous pouvez utiliser l'astuce de juacala et supprimer un élément du DOM (sous l'onglet Eléments) qui provoquera une erreur javascript. Par exemple, supposons que vous ayez le code var cartype = $('#cartype').val(); Si vous supprimez l'élément avec ID = cartype avant cette ligne de code, le js se brisera sur cette ligne. Cependant, l'élément sera toujours manquant lorsque vous essayez de réexécuter le code. décrit ci-dessus vous permet d'exécuter et de réexécuter le code à l'infini.


Plus de notes:

(a) Insérer un point d'arrêt dans le code: tapez simplement debugger; sur une ligne seule. Si DevTools est ouvert, le script passera dans le débogueur à ce stade. Si DevTools n'est pas ouvert, le code ignorera l'instruction.

(b) Vous voulez éviter de sauter dans la bibliothèque jQuery lors du débogage de code? Blackbox il. Voir instructions de la boîte noire pour Chrome - ou - pour Firefox


Gratitude (s'il vous plaît visitez et upvote):

Débogage Javascript ligne par ligne avec Google Chrome

Est-il possible de modifier les valeurs des variables javascript lors du débogage dans Google Chrome?

2
cssyphus

Si vous avez une boucle non autorisée, mettez le code en pause dans le débogueur Google Chrome (le petit bouton "||" dans l'onglet Sources).

Revenez à Chrome lui-même, ouvrez le "Gestionnaire des tâches" (Maj + Échap), sélectionnez votre onglet, cliquez sur le bouton "Terminer le processus".

Vous recevrez le message Aww Snap puis vous pourrez recharger (F5).

Comme d’autres l’ont noté, recharger la page au moment de la pause revient à redémarrer la boucle non autorisée et peut provoquer des blocages désagréables si le débogueur se verrouille également (puis dans certains cas, le redémarrage de chrome ou même le débogueur a besoin d’un bouton "Stop" Nb: La réponse acceptée est obsolète en ce que certains aspects sont apparemment apparemment faux. Si vous me refusez, expliquez:).

1
www-0av-Com

Il existe de nombreuses solutions appropriées à ce problème, comme mentionné ci-dessus dans ce message, mais j'ai trouvé un petit hack qui peut être inséré dans le script ou collé dans la console Chromes (débogueur) pour y parvenir:

jQuery(window).keydown(function(e) { if (e.keyCode == 123) debugger; });

Cela entraînera une pause de l'exécution lorsque vous appuierez sur F12.

0
Murtaza Hussain

Ouvrez l'onglet source dans "Outils de développement", cliquez sur un numéro de ligne dans un script en cours d'exécution, cela créera un point d'arrêt et le débogueur s'y arrêtera.

0
Todd

Vous pouvez vous arrêter sur n'importe quel modèle XHR que je trouve très utile lors du débogage de ce type de scénarios.

Par exemple, j'ai donné un point d'arrêt sur un modèle d'URL contenant "/"

enter image description here

0
Abhi