Outils de dépannage JavaScript dans Internet Explorer

Translate

J'utilise beaucoup Firebug et la console Mozilla JS, mais de temps en temps, je rencontre un bogue JavaScript uniquement pour IE, qui est vraiment difficile à localiser (ex:erreur à la ligne 724, lorsque le code HTML source ne contient que 200 lignes).

J'adorerais avoir un outil JS léger (à lafirebug) pour Internet Explorer, quelque chose que je peux installer en quelques secondes sur le PC d'un client si je rencontre une erreur puis que je désinstalle. Certains outils Microsoft nécessitent un temps de téléchargement et de configuration important.

Des idées?

This question and all comments follow the "Attribution Required."

Toutes les réponses

Translate

Vous pourriez trouverFirebug Liteutile pour cela.

Son bookmarklet devrait être particulièrement utile lors du débogage sur la machine d'un utilisateur.

La source
Translate

Depuis Internet Explorer 8, IE propose un ensemble d'outils assez impressionnant pour le débogage JavaScript, le profilage, etc. Comme la plupart des autres navigateurs, les outils de développement sont accessibles en appuyant sur F12 sur votre clavier.

Onglet Script

L'onglet Script est probablement ce qui vous intéressera, bien que les onglets Console, Profiler et Réseau soient également largement utilisés lors du débogage des applications.

enter image description here

Depuis l'onglet Script, vous pouvez:

  • Formater JavaScript pour le rendre plus lisible
  • Passer de la source à la source de diverses ressources sur la page
  • Insérer des points d'arrêt
  • Déplacez-vous dans et sur des lignes de code tout en parcourant son exécution
  • Regarder les variables
  • Inspectez la pile d'appels pour voir comment le code a été exécuté
  • Basculer les points d'arrêt
  • et plus...

Onglet Console

L'onglet console est idéal lorsque vous devez exécuter du code arbitraire contre l'application. J'utilise cela pour vérifier le retour de certaines méthodes, ou même pour tester rapidement des solutions pour obtenir des réponses sur Stack Overflow.

enter image description here

Onglet Profiler

Le profil est génial si vous recherchez des processus de longue durée ou si vous essayez d'optimiser votre code pour fonctionner plus facilement ou faire moins d'appels à des méthodes gourmandes en ressources. Ouvrez n'importe quelle page et cliquez sur "Démarrer le profilage" dans l'onglet Profiler pour démarrer l'enregistrement.

Pendant que le profileur fonctionne, vous pouvez vous déplacer dans la page en effectuant des actions courantes. Lorsque vous pensez que vous avez suffisamment enregistré, cliquez sur "Arrêter le profilage". Vous verrez alors un résumé de toutes les fonctions exécutées, ou une arborescence d'appels. Vous pouvez rapidement trier ces données selon différentes colonnes:

enter image description here

Onglet Réseau

L'onglet réseau enregistrera le trafic sur votre site / application. C'est très pratique pour trouver des fichiers qui ne sont pas téléchargés, suspendus ou pour suivre les données demandées de manière asynchrone.

Dans cet onglet, vous pouvez également passer d'une vue récapitulative à une vue détaillée. Dans la vue détaillée, vous pouvez inspecter les en-têtes envoyés avec les demandes et les réponses. Vous pouvez afficher les informations sur les cookies, vérifier le calendrier des événements, etc.

enter image description here

Je ne fais pas vraiment justice aux outils de développement IE - il y a beaucoup de terrain non couvert. Je vous encourage cependant à les consulter et à les intégrer à votre développement.

La source
Translate

je recommanderaisCompagnon JS.

Ceci est la version gratuite deBarre de débogagemais je trouve cela plus facile à utiliser et j'ai les fonctionnalités dont j'ai besoin. Idéal pour tester de petits extraits de code JavaScript dans IE de la même manière que je le fais avec Firebug dans Firefox.

EDIT 5 ans plus tard: J'utilise maintenant les outils de développement intégrés à Internet Explorer.

La source
Translate

IE 8 est censé avoir de meilleurs outils, mais la barre d'outils IE Developer est plutôt bonne.

La source
Afra Lee
Translate

J'utilise les deuxDébogueur de script MicrosoftetFireBug Lite, en fonction de ce que je débogue. Les deux sont d'excellents outils - essayez-les tous les deux et cousez avec ce avec quoi vous êtes à l'aise.

La source
Translate

Dans IE8, appuyez simplement sur F12!

La source
Translate
  1. Allez dans Outils-> Options Internet… -> Avancé-> Activer le débogage de script (Internet Explorer)

puis attachez le débogueur Visual Studio lorsqu'une erreur se produit.

Si vous utilisez IE 8, installez la barre d'outils du développeur car elle dispose d'un débogueur intégré.

La source