Utilisez des points d'arrêt pour mettre en pause votre code JavaScript. Ce guide explique chaque type de point d'arrêt disponible dans DevTools, ainsi que les cas d'utilisation et la configuration de chaque type. Pour un tutoriel interactif sur le processus de débogage, consultez Premiers pas avec le débogage JavaScript dans les outils pour les développeurs Chrome.
Présentation des cas d'utilisation de chaque type de point d'arrêt
Le type de point d'arrêt le plus connu est le point d'arrêt par ligne de code. Toutefois, la configuration de points d'arrêt par ligne de code peut être inefficace, en particulier si vous ne savez pas exactement où chercher ou si vous travaillez avec un grand codebase. Vous pouvez gagner du temps lors du débogage en sachant comment et quand utiliser les autres types de points d'arrêt.
| Type de point d'arrêt | Utilisez-le lorsque vous souhaitez : |
|---|---|
| Ligne de code | Mettez en pause sur une région exacte de code. |
| Ligne de code conditionnelle | Mettez en pause une région de code exacte, mais uniquement lorsque l'une des autres conditions est vraie. |
| Logpoint | Consignez un message dans la console sans suspendre l'exécution. |
| DOM | Mettez en pause le code qui modifie ou supprime un nœud DOM spécifique ou ses enfants. |
| XHR | Mettre en veille lorsqu'une URL XHR contient un format de chaîne |
| Écouteur d'événements | Mettez en pause le code qui s'exécute après le déclenchement d'un événement, tel que click. |
| Exception | Mettez en pause la ligne de code qui génère une exception interceptée ou non. |
| Fonction | Mettez en pause chaque fois qu'une fonction spécifique est appelée. |
| Trusted Type (Type approuvé) | Suspendre en cas de non-respect des Trusted Types. |
Points d'arrêt de ligne de code
Utilisez un point d'arrêt par ligne de code lorsque vous connaissez la région de code exacte que vous devez examiner. DevTools toujours s'arrête avant l'exécution de cette ligne de code.
Pour définir un point d'arrêt sur une ligne de code dans DevTools :
- Cliquez sur le panneau Sources.
- Ouvrez le fichier contenant la ligne de code à laquelle vous souhaitez arrêter l'exécution.
- Accédez à la ligne de code.
- À gauche de la ligne de code se trouve la colonne de numéro de ligne. Cliquez dessus. Une icône bleue s'affiche au-dessus de la colonne des numéros de ligne.