comment deboguer une partie de javascript?

comment deboguer une partie de javascript? - Javascript/Node.js - Programmation

Marsh Posté le 08-01-2015 à 10:49:34    

Bonjour tout le monde
 
sur la page d’accueil d'un site privatif que j'anime pour ma famille et autres
 
j'avais mis en affichage en haut de la page une partie de javascript qui affiche la date et une image selon le jour
 
la séquence de code html pour l'affichage de l'image est donc une chaine de caractères dans une variable
 
depuis quelques temps, le fichier index a subi des outrages du aux éditeurs utilisés qui n'ont pas converti le codage caractère toujours pareil
et vraisemblablement des fautes de typo ont du s’introduire de sorte
 
la page s'affiche bien sous IE
mais toute la partie du code javascript ne produit aucun affichage sous firefox
 
quel petit soft et/ou autre outil pourrait m'aider a trouver ou au moins situer l'endroit qui fait planter sous firefox?
 
par avance merci

Reply

Marsh Posté le 08-01-2015 à 10:49:34   

Reply

Marsh Posté le 08-01-2015 à 12:48:30    

firebug lite, notpad++ peut être?
 
qu'en pensez-vous?
 
autres idées? :cry:

Reply

Marsh Posté le 08-01-2015 à 14:25:54    

Ben la console par défaut donne déjà des infos, après l'extension firebug pour firefox permet un debugage plus poussé oui...
 
...après ans plus d'info difficile d'aider. ^^


---------------
D3
Reply

Marsh Posté le 08-01-2015 à 16:33:06    

mechkurt merci
 
il doit manquer quelque part un // ou ' ou ;
 
une fois j'ai utilisé un éditeur qui a pas du utiliser le même codage de caractère et ca a chamboulé tout le fichier et toute sa mise en page
 
ca a provoqué ensuite pleins de dysfonctionnements qui se résorbent a force mais je viens de découvrir encore celui là
 
ce qui serait bien c'est de pouvoir identifier la ligne où firefox se bloque pour ensuite zapper toute l’interprétation du script
 
car sous IE plus permissif ca pose pas le problème
 
je vois pas de quelle console tu parles
j'ai ouvert aussi le module firebug mais je suis pas à l'aise et je vois rien, dans l'onglet javascript il me met le code avec pleins de points rouges pour des blancs à priori
 
j'ai aussi le contenu des variables sur la droite, par exemple la date est ok mais elle s'affiche plus car le code est dans sa globalité exclu du fait qu'il manque un caractère quelque part je pense (erreur de syntaxe)
 
quelles genres d'infos supplémentaires seraient utiles?

Reply

Marsh Posté le 08-01-2015 à 17:32:27    

Si c'est un problème de syntaxe, ton éditeur de texte devrait déjà te le signaler (si tu en utilises un au minimum correct).
Sinon tu peux toujours coller ta source js dans un validateur type celui la (trouvé via google) :
http://esprima.org/demo/validate.html
 
Sinon tu as la solution de commenter des grandes portions de codes avec des /* [...] */, pour essayer de trouver d’où ça vient puis d'affiner...


---------------
D3
Reply

Marsh Posté le 08-01-2015 à 18:08:57    

il me semblait que les commentaires javascript était // devant une ligne ?
 
je viens justement d'enlever une ' dans une ligne commentée et le script
dans firebug s'est coloré alors que tout a l'heure c'etait plus curieux
 
ca l'air correct niveau syntaxe je trouve pas le caractere qui fait clocher
 
en revanche dans la fenêtre des variables espion ca va pas on dirait
 
j'ai définit une variable tableau mois où chacune des entrées est la chaine du mois en francais
de sorte que mois[month] devrait afficher JANVIER
 
or dans firebug month a bien la valeur 0 mais mois lui a l'air d'avoir undefined
 
idem pour la variable qui contient chaine de caractère de code html pour l'image
 
elle a ""
 
voila par exemple le passage qui correspond a la date


var mois=new Array("JANVIER","FEVRIER","MARS","AVRIL","MAI","JUIN","JUILLET","AOUT",
    "SEPTEMBRE","OCTOBRE","NOVEMBRE","DECEMBRE" );
 
      document.write("<I><U>"+jour[day]+" "+val+" "+mois[month]+" "+an+"</U></I>" );

Message cité 1 fois
Message édité par tintin34 le 08-01-2015 à 18:12:21
Reply

Marsh Posté le 09-01-2015 à 09:20:07    

tintin34 a écrit :

il me semblait que les commentaires javascript était // devant une ligne ?


/* permet d'ouvrir une zone commenté et */ permet de la fermer, ça te permet de commenter des parties entières de code sans avoir a mettre // devant chaque ligne...

tintin34 a écrit :

je viens justement d'enlever une ' dans une ligne commentée et le script
dans firebug s'est coloré alors que tout a l'heure c'etait plus curieux
 
ca l'air correct niveau syntaxe je trouve pas le caractere qui fait clocher
 
en revanche dans la fenêtre des variables espion ca va pas on dirait
 
j'ai définit une variable tableau mois où chacune des entrées est la chaine du mois en francais
de sorte que mois[month] devrait afficher JANVIER
 
or dans firebug month a bien la valeur 0 mais mois lui a l'air d'avoir undefined
 
idem pour la variable qui contient chaine de caractère de code html pour l'image
 
elle a ""
 
voila par exemple le passage qui correspond a la date


var mois=new Array("JANVIER","FEVRIER","MARS","AVRIL","MAI","JUIN","JUILLET","AOUT",
    "SEPTEMBRE","OCTOBRE","NOVEMBRE","DECEMBRE" );
 
      document.write("<I><U>"+jour[day]+" "+val+" "+mois[month]+" "+an+"</U></I>" );



Essayes de mettre des console.log('la_variable_que_je_veux_tracer = '+la_variable_que_je_veux_tracer); un peu partout, tu as un peut être un problème de "scope" (en gros une variable définis dans une fonction ne peut pas être appelé dans une autre).


---------------
D3
Reply

Marsh Posté le 09-01-2015 à 11:49:46    

peux-tu me montrer plus précisément comment on utilise console.log avec message_voeux ou mois[month]
 
j'ai bien pensé à ce que tu dis pour la visibilité des variables mais je trouve pas le soucis
 
ca a déjà correctement fonctionné (et aujourd'hui firefox affiche rien alors que IE oui)
 
le contenu des variables n'affiche rien dans la fenêtre firebug mais peut etre parce que je l'utilise mal
 
j'ai déjà eu des cas où la moindre erreur typo ou de syntaxe fait stopper l’interprétation des scripts sous firefox, c'est pour ca que je pense à ce genre de chose, ou alors un soucis avec le cache peut etre
 
 
pour précision ci après le code simplifié de la page, comme tu pourras le voir, le seul script qui est dans le corps est justement celui qui pose probleme et il ne contient pas de fonctions :pt1cable:  
 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 
 
<HTML>
 
<HEAD>
 
 <TITLE> </TITLE>
 
 
<link rel="shortcut icon" href="favicon.ico" >
<link rel="icon" href="favicon.png" type="image/png" >
     
 
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css; charset=ISO-8859-1">
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
 
 
<STYLE type="text/css">
</STYLE>
 
<SCRIPT LANGUAGE="JavaScript" src="eeeee.js">
<!--
//-->
</script>
 
<SCRIPT language="JavaScript">
<!--
</SCRIPT>
 
 
         
</HEAD>
 
<BODY BGCOLOR="lavender">
 
 
<script language="JavaScript">
<!--
     
      var thisday=new Date();
 
      var val=thisday.getDate();
      var day=thisday.getDay();
      var month=thisday.getMonth();
      var an=thisday.getYear();
      an=1900+an%1900;
 
      var message_annexe = "";
      var message_voeux = "";
 
 
     // CONDITIONS D AFFICHAGE DES BANDEROLES
 
 
 
     // Janvier :  
     // ---------------------------------------------
 
     if (month == 0) {
        message_voeux = '<IMG SRC="IMAGE/ELEM/DIVERS/2015.jpg" ALIGN=CENTER><BR>';
        };
 
   
      document.write(message_annexe);
 
       
      // Date du jour
      var jour=new Array("DIMANCHE","LUNDI","MARDI","MERCREDI","JEUDI","VENDREDI","SAMEDI" );
      var mois=new Array("JANVIER","FEVRIER","MARS","AVRIL","MAI","JUIN","JUILLET","AOUT",
    "SEPTEMBRE","OCTOBRE","NOVEMBRE","DECEMBRE" );
 
      document.write("<I><U>"+jour[day]+" "+val+" "+mois[month]+" "+an+"</U></I>" );
      document.write("<BR><BR>" );  
 
 
      // Message de Voeux
      document.write(message_voeux+"<BR>" );
           
      document.write(message_annexe+"<BR>" );      
 
//-->
</script>
 
</BODY>
</HTML>


Message édité par tintin34 le 09-01-2015 à 11:52:41
Reply

Marsh Posté le 09-01-2015 à 12:01:00    

Ton bloc fonctionne très bien :
http://jsfiddle.net/v5g8xy28/
 
Je soupçonne plutôt des problèmes avec ces lignes :

Code :
  1. <SCRIPT LANGUAGE="JavaScript" src="eeeee.js">
  2. <!--
  3. //-->
  4. </script>
  5. <SCRIPT language="JavaScript">
  6. <!--
  7. </SCRIPT>


vires les complétement et retestes
 
si ca vas mieux essaye de rajouter juste <SCRIPT TYPE="text/javascript" src="eeeee.js"></script>
 
si ca rebugc'est que y'a un problème avec ton fichier eeeee.js
 


---------------
D3
Reply

Marsh Posté le 09-01-2015 à 12:17:45    

ok merci je vais orienter mes recherches vers eeeee.js pour commencer
 
j'ai en effet apercu une syntax error dans firebug , pour précisions il n'y a pas de lien entre la partie qui s'affiche pas et eeeee.js
 
pour autre info dans le script que j'ai cité plus haut il y a pleins d'autres if construits de manière identique pour tous les autres mois
 
dont 1 où la chaine de code html est assez longue
le if qui teste le mois de janvier arrive dans l’interprétation en dernier
 
je pense aussi que je peux laisser celui de janvier et rajouter tous les autres 1 par un et suivant ce que tu me dis en fonction du fait que celui de janvier fonctionnerait ou non cela indiquerait le if qui pourrait aussi poser problème avec un caractère en trop ou en moins dans la chaine

Reply

Marsh Posté le 09-01-2015 à 12:17:45   

Reply

Marsh Posté le 09-01-2015 à 14:34:37    

Si un truc fait bugger le javascript dans eeeee.js, il se peut fortement qu'aucun javascript ne s’exécute sur la page, c'est pourquoi je te conseilles d'essayer sans, ça te permettrait d'orienter tes recherches.
 
Essayes de coller tout ton script inline dans http://jsfiddle.net/ ou http://codepen.io/
 
Ce sera plus simple pour debuuger ton code "en live" puicque chaque modif est instantanément interprété (et si c'est une erreur de syntaxe, il y a de grande chance que codepen te la detectes).


---------------
D3
Reply

Marsh Posté le 10-01-2015 à 13:01:08    

mechkurt merci encore de m'aider
 
j'ai un peu avancé (donc uniquement pour Firefox qui pose le soucis)
1) si on enlève tous les balises script de l'en-tete
==> ca fonctionne toujours pas
 
2) si on enlève en plus la partie de variables qui utilise une fonction qui est dans eeeee.js et entre autre le IF du moi de mai
==> ce qui ressemble au bloc que j'avais donné plus haut ca fonctionne
 
3) si maintenant on remet dans l'en-tete l'appel à eeeee.js uniquement
==> ca fonctionne
 
4) et si on remet la partie de variable dans le script du corps qui utilise les fonctions de eeeee.js
==> plus d'affichage
 
5) j'ai fait faire l'analyse dans le lien que tu as proposé, il y a pas l'air d'avoir d'erreur
 
c'est cette partie de code ci-après qui pose un soucis
et dans firebug, je suis pas certain d'avoir fait comme il faut pour l'utiliser mais on dirait qu'il y a un point rouge devant une ligne blanche qu'il a rajouté entre le else et { qui suit
:??:  


var jp = paques(an);
      var jr = jp - 7;
      var mp = 3;
      var mr = 3;
      if (jp <= 0) {
  mp -= 1;
 mr -= 1;
 jp += 31;
 jr = jp - 7;
 } else
 {
      if (jp <= 7)
 {var mr = 2 ;
   var jr = 31 -7 + jp;
 };
 };


 
PS: mon copier-coller du bout de code ci-dessus est bien indenté quand j'ecris ce message et visiblement une fois validé c'est tout décalè  :pfff:


Message édité par tintin34 le 10-01-2015 à 13:05:54
Reply

Marsh Posté le 11-01-2015 à 10:52:11    

pour le fichier eeeeee.js voila contenu
 


function quotient(a,b){
 
var r = 0;
r = (a - (a%b))/b;
 
return r
}
 
function paques(m){
var n = m - 1900;
var a = n % 19;
var b = quotient(7*a+1,19);
var c = (11*a-b+4)%29;
var d = quotient(n,4);
var e = (n - c + d + 31)%7;
var res = 25 - (c + e);
 
return res
}

Reply

Marsh Posté le 11-01-2015 à 11:18:00    

firebug semble dire aussi que paques est pas defini
 
comme si le fichier eeeee.js etait pas chargé sous firefox
 
:heink: :??:  
 
as tu une idée de ce qu'il se passe?
 
 
PS : lorsqu'on regarde l'onglet console de firebug il indiquerait une erreur de syntaxe à la ligne 1 colonne 8
cad juste après function
 
manque t'il une première ligne dans le fichier pour qu'il puisse etre inclus ou autre chose avant le mot function?


Message édité par tintin34 le 12-01-2015 à 10:40:09
Reply

Marsh Posté le 12-01-2015 à 10:47:58    

vu que j'avais simplifié le code du bloc que tu m'as dit fonctionner (et j'ai vérifié qu'en effet c'etait la cas je me rends compte qu'en effet je n'ai pas précisé que la partie des variable qui coince se situe dans le script donné plus haut
 
entre
var message_voeux = "";
 
 et
     // CONDITIONS D AFFICHAGE DES BANDEROLES


Message édité par tintin34 le 12-01-2015 à 10:49:17
Reply

Marsh Posté le 12-01-2015 à 11:09:09    

quotient() n'est pas dans la norme javascript
http://stackoverflow.com/questions [...] javascript


---------------
D3
Reply

Marsh Posté le 12-01-2015 à 11:19:09    

+ ajouter des ; après les return.

Reply

Marsh Posté le 12-01-2015 à 11:32:14    

ah oui pardon, j'avais pas copié / coller la fonction du dessus, oui c'est plus surement l’oublie des ; qui pose problème.


---------------
D3
Reply

Marsh Posté le 12-01-2015 à 17:52:14    

si il s'agit de mettre un ; apres r dans quotient et res dans paques ca ne change rien
 
je viens d'essayer ca fonctionne pas d’avantage et firebug dit toujours que paques est pas défini comme si le fichier était pas chargé
 :fou:

Reply

Marsh Posté le 12-01-2015 à 21:02:43    

est ce qu'il pourrait y avoir quelque chose à creuser avec ca:
 


language="JavaScript" et TYPE="text/javascript"


 
ou ca


<!--
//-->  


 
il est curieux que l'erreur de syntaxe dans eeeee.js se trouverait juste après le mot function comme s'il manquait quelque chose en début de fichier
 
ou bien dans la balise script qui est censée charger le fichier
 
après bien évidement que si ca s'est mal passé pour le chargement de la fonction paques je comprends que ca écarte le reste du code où il y a l'appel et les affichages d'images


Message édité par tintin34 le 12-01-2015 à 21:03:37
Reply

Marsh Posté le 13-01-2015 à 09:36:41    

Peut être que tu as un caractère invisible dans ton fichier eeeeeee.js :
 
http://www.wikiwand.com/fr/Indicat [...] des_octets => Problèmes liés à l'utilisation de l'indicateur d'ordre des octets


---------------
D3
Reply

Marsh Posté le 13-01-2015 à 10:29:58    

L'attribut "language" n'est plus nécessaire depuis le HTML 4.01 Tr voire même bien avant, il est remplacé par l'attribut "type".
Quant aux balises de commentaires je pense qu'à l'origine elles sont là à cause d'un problème de parsage des anciens navigateurs, avec les navigateurs récents et l'attribut type="text/javascript" je ne pense pas qu'elles aient quelque utilité.

Reply

Marsh Posté le 13-01-2015 à 10:44:29    

OK MaybeEijOrNot j'ai pris note des infos  
 
ca a l'air d'etre ca mechkurt :jap: j'ai enregistré sous les 3 fichiers eeeee.js appelés en début de page en utf-8 et la page d'accueil fonctionne maintenant  
 
les variables dans firebug se remplissent bien également
 
je vais voir à l'usage et tacherais de me souvenir de bien garder l'utf-8 comme base de codage
 
merci encore à tous
 
meilleurs voeux :)


Message édité par tintin34 le 13-01-2015 à 10:48:26
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed