truc2geek

2015/03/08

Processing : debug

Filed under: Processing, Programmation — Étiquettes : , — truc2geek @ 21:13

Coder c’est bien, mais on  va forcément avoir des bugs et ça, c’est mal. Alors, quand notre chemin vers la lumière d’un code parfait est obscurci par ces obstacles qui sont les entreprises égoïstes que fait sans fin, surgir l’oeuvre du malin, la question se pose : que faire?
La suggestion du jour : lâcher la souris et apprécier une fois de plus ce film culte : Pulp Fiction.
Et ensuite, on debugge…

application de test

On va se baser sur un code très simple, qui n’a rien d’intéressant en lui-même, il sert juste de prétexte.
On prend le code du jeu de serpent, on supprime tout ce qui est inutile, et on introduit un bug dans le code.
Voici le code de la méthode avancer() de la classe Serpent :
01.png

Dans le cas où le serpent se déplace vers la droite, il ne fera pas demi-tour en arrivant sur le bord de la fenêtre, il continuera sa route en-dehors de la fenêtre.

Voici le lien vers le sketche, App_v1.7z.

démo du bug :

debug : 1e méthode

On peut utiliser la fonction print, ou println, par exemple comme ça :
02.png

démo :

Si on agrandit la « zone de sortie », on a ceci : ce n’est pas très clair, et on a seulement une partie des données, les données précédentes ont été supprimées :
03.png

Bref, pas très pratique…

2e méthode : un « mode debug »

L’idée, c’est de pouvoir activer et désactiver une sorte de « mode debug » pendant l’exécution du sketche, pour que les données de debug soient écrites seulement aux moments où c’est important. Les données intéressantes ne seront plus noyées parmi les autres.

Au niveau du code :
une variable globale, de type booléen, initialisée à false :
04.png

La touche « 1 » nous permettra d’activer le mode debug, puis de le désactiver, on ajoute donc quelques lignes dans la fonction keyPressed() :
05.png

Ensuite dans la fonction avancer(), on n’exécute les instructions « print » que si le mode debug est activé :
06.png

démo :

Les données utiles au debug n’ont été écrites qu’au moment voulu, comme prévu.
Un extrait de la zone de sortie :
07.png

On voit bien ici que le « serpent » a dépassé les 200 pixels de largeur de la fenêtre, sans faire demi-tour.

Voici le lien vers cette version de l’application.

3e méthode : un fichier texte

Ecrire les données de debug dans un fichier texte, c’est mieux :

  • pas besoin de se faire ##### à agrandir la « zone de sortie » de Processing
  • on peut les conserver pour comparer les résultats de tests différents

On va créer un nouvel onglet, nommé « fTest », et coder une fonction test01(). Pour prendre un exemple réaliste, on va tester la fonction random() de processing, 100 fois par exemple.

08.png

On modifie la fonction setup() : appeler la fonction test01() et placer noLoop(), qui comme son nom l’indique, a pour effet de désactiver le fonctionnement en boucle de Processing : la fonction draw() sera appelée une seule fois.

10.png

On lance l’exécution du sketche, voici le début et la fin du fichier « FichierDebug.txt » généré :


Voici le lien vers cette version, la v3, de cette application.

3e méthode bis : le fichier texte couplé au mode debug

Il faut créer des fonctions distinctes pour ouvrir le fichier texte, écrire dedans, et le fermer :
13.png

Dans la fonction ecrireFicDebug(), l’action d’écrire dans le fichier ne sera exécutée que si le mode Debug est activé.

On adapte le code de la méthode avancer() de la classe Serpent :
15.png
Remarque : partout où on appelle la fonction ecrireFicDebug(), on n’a plus besoin de tester si le mode Debug est activé : c’est l’intérêt d’avoir placé ce test directement dans la fonction ecrireFicDebug().

Autres modifs du code :

  • la variable de type PrintWriter doit désormais être de portée publique, pour que les trois fonctions ouvrirFicDebug(), fermerFicDebug() et ecrireFicDebug() puissent l’utiliser.
  • dans setup(), on commente l’appel à test01() et l’instruction noLoop().

16.png

Démo :

J’ai appuyé sur la touche 1 juste avant et juste après que le carré arrive à droite de la fenêtre.
Dans le fichier texte généré, on a bien les informations de debug seulement pour le moment qui nous intéresse : x vaut 182 sur le premier log :
18.png

Voici l’extrait le plus intéressant du fichier généré, quand le carré sort de la fenêtre :
17.png

Voici le lien vers cette version, la v4, de cette application.

App v5 : fichier horodaté

Il s’agit d’une petite modif : on ajoute la date et l’heure courantes dans le nom du fichier :
19.png

On teste, le fichier est bien généré avec la date et l’heure :
20.png

Voici le lien vers cette version, la v5, de cette application.

Advertisements

Laisser un commentaire »

Aucun commentaire pour l’instant.

RSS feed for comments on this post. TrackBack URI

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s

Créez un site Web ou un blog gratuitement sur WordPress.com.

%d blogueurs aiment cette page :