Ecrogal Dans quel état j'erre ?
Age : 31
Date d'inscription : 14/12/2008
Nombre de messages : 486
Localisation : Créteil
Groupe : Admins
|
Sujet: [Aide] Identifier facilement les erreurs dans un script Ven 2 Jan - 23:31 |
|
|
Identifier facilement les erreurs dans un script
Informations concernant le tutoriel |
---|
Auteur : | Ecrogal | Description : | Il est souvent difficile d'identifier les problèmes dans un script, et ce d'autant plus que l'affichage des templates n'est pas très clair. Nous allons voir dans ce tutoriel comment identifier facilement les erreurs dans un script. | Exemple : | ø | Défaut(s) : | Aucun. | Notes : | ø |
________________________
Exemple de script bogué
Nous allons travailler sur un exemple de script contenant un bogue. Il s'agit d'un petit script en Javascript qui consiste simplement à concaténer quelques variables puis écrire sur l'écran cette fameuse variable. Voici le script :
- Code:
-
<script language="javascript" type="text/javascript"> var variable_bidon_debut = 'Tux '; var variable_bidon_fin = ' le meilleur'; var variable_bidon = variable_bidon_debut+'c'est'+variable_bidon_fin;
document.write(variable_bidon); </script> L'erreur vous saute certainement aux yeux (non ? ), mais imaginons que ce script fasse plusieurs dizaines de lignes et pourquoi pas, comme on aime le faire en Javascript, sans aucun retour à la ligne ni indentation. C'est tout de suite plus difficile...
Utiliser la console d'erreur de Firefox
Comme vous ne le savez sans doute pas, il existe une console d'erreur intégrée à Firefox (et ses dérivés). Cette console est accessible via le menu Outils et dont le raccourci est Ctrl + Maj + J.
Voici un petit aperçu de ce qu'on peut obtenir :
[info]Étant sous Debian, le navigateur ne s'appelle pas Firefox mais Iceweasel (ou «belette glacée»). Ces navigateurs sont néanmoins (presque) les mêmes, tout du moins c'est ce que nous allons dire dans ce tutoriel. [/info] Bref, si on récapitule, on a l'erreur suivante :
- Citation :
- Erreur : missing ; before statement
Fichier Source : http://porcepic.xoo.it/index.php Ligne : 154, Colonne : 42 Code Source : var variable_bidon = variable_bidon_debut+'c'est'+variable_bidon_fin; On peut apercevoir une petite flèche verte (que j'ai essayé de retranscrire en soulignant le texte qu'elle pointe) qui montre où se situe l'erreur.
Maintenant, on peut identifier beaucoup plus rapidement le bogue : on a simplement oublié d'échapper un guillemet !
La coloration syntaxique : un outil fort sympathique
Un autre outil qui peut vous être intéressant : la coloration syntaxique offerte par certains logiciels.
Un exemple de page HTML colorée syntaxiquement
Voici deux exemples de logiciels qui peuvent vous être utiles :
- Notepad++ (Windows) : l'éditeur de texte incontournable ;
- gedit (GNU/Linux) : un éditeur de texte sous Gnome qui nous suffit amplement.
Maintenant, il suffit simplement de copier/coller notre script dans notre éditeur : l'avantage de la coloration syntaxique, c'est qu'elle bogue quand on a fait une erreur.
[attention]Si vous utilisez Notepad++, enregistrez le fichier en .js, en .html ou en .php afin d'avoir la coloration syntaxique en Javascript.[/attention] Bref, voilà ce que j'obtiens sous gedit :
[ok]Un petit rappel si vous aviez oublié (!) comment ouvrir un fichier avec gedit. Il suffit simplement d'écrire dans la console : - Code:
-
gedit nom_fichier [/ok]
On voit là encore que le bogue provient d'un guillemet non échappé !
Résolution du bogue
Parce qu'il ne faut quand même pas mourir bête, voilà comment il faut corriger ce bogue :
- Code:
-
<script language="javascript" type="text/javascript"> var variable_bidon_debut = 'Tux '; var variable_bidon_fin = ' le meilleur'; var variable_bidon = variable_bidon_debut+'c\'est'+variable_bidon_fin;
document.write(variable_bidon); </script> Et voilà, c'est terminé ! ________________________ |
|