14.2 Techniques de débogage

Lorsqu'un programme ne compile pas (erreur de syntaxe), qu'il ne fait pas ce qu'il faut ou qu'il ne le fait pas bien (erreur de logique), il faut le déboguer.

Si vous désirez devenir une bonne développeuse ou un bon développeur, vous devez devenir habile en débogage :-)

Le débogage d'un programme implique l'utilisation de plusieurs stratégies pour vous aider à trouver ce qui ne va pas dans le code et ainsi réussir à trouver une solution.

Je vous en nomme ici quelques-unes que vous pouvez utiliser seules ou en combinaison. L'ordre de cette liste n'a pas d'importance. C'est souvent le contexte qui vous dictera laquelle ou lesquelles seront les plus intéressantes.

• Trace manuelle de ce que le programme fait (on fait semblant qu'on est l'ordinateur en exécutant dans notre tête les lignes de code une à une).
• Technique du canard en plastique ou, en anglais, rubber duck debugging : il s'agit d'expliquer à voix haute ce que le programme fait. Vous pouvez le faire devant un canard en plastique, comme le nom de la technique le suggère, ou devant un collègue. Vous serez surpris de voir à quel point c'est efficace!
• Consulter un fichier journal (log file) dans lequel les détails d'une erreur pourraient être affichées. Différents fichiers journaux sont à votre disposition :
  • le fichier journal du serveur HTTP ou de PHP. Sous Apache ou Nginx, ce fichier porte un nom du genre error_log, error.log, httpd-error.log, php_error_log, php_errors.log ou php-fpm.error. Par exemple, dans un environnement AMPPS sous Windows, le chemin du fichier est C:\Program Files\Ampps\apache\logs\error.log.
  • le fichier journal de votre application.
    • Dans un projet PHP vanille, c'est à vous de déterminer son nom et son emplacement.
    • Dans un projet WordPress, il s'appelle par défaut debug.log. Son nom et son emplacement peuvent être configurés à l'aide de la constante WP_DEBUG_LOG.
    • Dans un projet Laravel, il s'appelle laravel.log et il est placé dans le dossier storage/logs. Il est possible de configurer l'application pour que la date du jour fasse partie du nom  du fichier.
• Vérifier ce que le navigateur voit. Par exemple, si votre code tente de mettre le titre en couleur, un mauvais fonctionnement peut venir :
  • du code PHP ou JavaScript qui n'a pas bien généré les balises HTML
  • du code PHP ou JavaScript qui n'a pas bien ajouté une règle CSS
  • de la règle CSS qui est mal rédigée
  • d'un problème au niveau du cache du navigateur.

  Pour voir ce que le navigateur voit, vous pouvez utiliser l'une ou l'autre de ces techniques :

  • Inspecter les éléments HTML et CSS à l'aide des outils de développement de votre navigateur.
  • Afficher le code source de la page (clic droit sur la page Web / Afficher le code source de la page) afin de visualiser ce qui est chargé en mémoire (code HTML, fichiers JavaScript, fichiers CSS).
• Utiliser un outil de validation, par exemple le validateur HTML du W3C afin de vous assurer que le problème ne vient pas d'une erreur HTML.
• Faire des énormités, par exemple utiliser une règle CSS qui met le fond rouge ou ajouter un X dans le titre de la page, afin de vous assurer que vous travaillez dans le bon fichier et dans la bonne section du code.
• Mettre des parties du code en commentaire afin de mieux cibler les parties qui posent problème.
• Comparer le code problématique avec un autre programme qui fonctionne ou avec les extraits de code présentés dans les notes de cours.
• Utiliser un débogueur côté client pour le code JavaScript.
• Utiliser un débogueur côté serveur pour le code PHP, par exemple le débogueur PhpStorm.
• Afficher des informations à l'écran ou les enregistrer dans un fichier journal afin de vous aider à suivre ce qui a été exécuté dans le programme.

Pour plus d'information

« The Debugging Golden Rule ». Dev. https://dev.to/gonedark/the-debugging-golden-rule-7cb