François Poteau

Débugger Javascript sous Internet explorer 6

IE6 n'est toujours pas mort malgré ses 4% de part de marché au niveau mondial. Debugger prend du temps, encore plus lorsqu'il s'agit d'IE6, la tentation devient alors grande d'abandonner ce navigateur désuet à son sort et de condamner ses utilisateurs à "Changer de navigateur ou démerdez vous".

Je vous avoue que me contente généralement d'assurer le fonctionnement de l'application sans perdre de temps sur les éventuels défauts d'affichage, du moins tant que ceux-ci ne dérangent pas la lecture du contenu.

Débugger du JS sous IE6 restent une mission très déplaisantes sans les outils appropriées.

Les outils

Internet Explorer 6

Si vous n'avez pas de machine sous Windows XP intégrant IE 6, la solution la plus fiable pour débugger votre application Web est l'utilisation d'une machine virtuelle. Windows 7 Pro & intégrale permettent l'installation d'un Windows XP Mode grâce au Windows Virtual PC fournis par Microsoft. Pour les autres, il y a VMware qui vous permettra également de virtualiser XP et IE6.

Cette solution vous permettra d'utiliser Microsoft Visual Web Developer.

il vous faudra également activer les options de débogage (au moins ceux d'Internet Explorer):

Microsoft Visual Web Developer

Microsoft met également à disposition un accessoire gratuit très efficace quoiqu’un peu lourd à mon gout: Microsoft Visual Web Developer 2010 express.

Une fois l'installation terminée, vous accéderez aux debogage de votre script en ouvrant votre site internet depuis le menu "fichier". Lancer ensuite le debogage avec la petite flèche verte (F5).

Debugger avec Visual Web Developper

Ce programme offre bien davantage de précision quand aux erreurs rencontrés par le moteur JS que les traditionnelles informations données par IE qui se contentait de vous founir une ligne et un message d'erreur peu explicite:

Une fois configuré, il reste assez simple de suivre les erreurs affichées, Visual Web vous ouvre automatiquement les fichiers concernés par les erreurs, celle-ci sont d'ailleurs surlignées. Le pas à pas détaillées (F11) peut également vous aider à identifier méthodiquement votre erreur.

Un certain nombre de fonctionnalités sont également appréciable:

  • Accès à la valeur des variables locales
  • La possibilité d’insérer des espions
  • Une fenêtre permettant d'exécuter du code à la volée

Résumé

Visual Web Developper permet en somme d'expliciter les erreurs JavaScript sous IE6 et de gagner un temps considérable. Je détaillerais certaines de ses fonctionnalités avancées dans un prochain billet.

Mémos - Internet explorer 6, Tutorial, Développement web - 2 commentaires

>