Débogage JavaScript événements avec Firebug
J'ai besoin de définir un point d'arrêt pour certains cas, mais je ne sais pas, où est-il défini, parce que j'ai géant tas de minimiser code JavaScript, donc je ne peux pas trouver manuellement.
Est-il possible de faire en quelque sorte de définir un point d'arrêt, par exemple à l'événement click d'un élément avec l'ID registerButton
, ou trouver quelque part la fonction qui est lié à cet événement?
J'ai trouvé l'add-on Firefox Javascript Deobfuscator, qui montre en cours d'exécution JavaScript, ce qui est agréable, mais le code que j'ai besoin de débogage à l'aide de jQuery, donc il y a beaucoup d'appels de fonction, même sur le plus simple des cas, donc je ne peux pas l'utiliser non plus.
Est-il un débogueur faite spécialement pour jQuery?
Quelqu'un sait certains outil qui transforme minifiés JavaScript de retour dans formaté code de type tour function(){alert("aaa");v=3;}
de retour dans
function() {
alert("aaa");
v = 3;
}
Vous devez vous connecter pour publier un commentaire.
Eh bien, il pourrait être trop d'ennuis que cela vaut la peine, mais il semble que vous avez trois choses à faire:
De rapetisser la source. J'aime cet outil en ligne pour un accès rapide et sale. Il suffit de coller votre code et cliquez sur le bouton. N'a jamais let me down, même sur le plus funky de JavaScript.
Tous jQuery événement liants acheminés à
"jQuery.event.add"
(voici à quoi il ressemble dans le non-bâti source), de sorte que vous besoin de trouver la méthode et de définir un point d'arrêt là.Si vous avez atteint jusqu'ici, tout ce que vous devez faire est d'inspecter la pile des appels au point d'arrêt pour voir qui a appelé ce. Notez que depuis que vous êtes à l'intérieur spot dans la bibliothèque, vous aurez besoin de vérifier quelques sauts (depuis le code appelant
"jQuery.event.add"
a probablement d'autres fonctions jQuery).Noter que 3) nécessite Firebug pour FF3. Si vous êtes comme moi et que vous préférez debug avec Firebug pour FF2, vous pouvez utiliser la vieille
arguments.callee.caller.toString()
méthode pour l'inspection de la pile des appels, l'insertion d'autant".caller
"s en tant que de besoin.Modifier: voir Également la "Comment débogage Javascript/jQuery cas des liaisons avec FireBug (ou un outil similaire)".
Vous pourriez être en mesure de s'en tirer avec:
L'astuce ci-dessus vous permettra de voir votre code de gestion des événements, et vous pouvez commencer la chasse vers le bas dans votre source, plutôt que d'essayer de définir un point d'arrêt dans jQuery source.
Tout d'abord remplacer minifiés jquery ou de toute autre source que vous utilisez avec formaté. Une autre astuce utile que j'ai trouvé est à l'aide de profils dans firebug. Le testeur affiche les fonctions qui sont en cours d'exécution et vous pouvez cliquer sur l'un et y aller pour définir un point d'arrêt.
Juste une mise à jour:
Google Chrome (le outils de dev) de soutenir toutes sortes de points d'arrêt, ainsi que pause sur l'Événement.
Tous événements avec orientation du périphérique changements et minuteries
Vous pouvez voir une vidéo avec une présentation de toutes les fonctionnalités de Google IO.
Il y a également intégré dans le deminifier/unminimizer/prettifier qui vous aidera à définir des points d'arrêt manuellement sur compressés les fichiers javascript.
Ce que vous pourriez faire est d'obtenir le minifiés de code, vous aurez accès à cela. De-minifier le code comme par le Croissant-Frais de (1) l'option ou de toute méthode que vous préférez.
Puis téléchargez et installez le Violoneux - tous les développeurs web devraient avoir cet incroyable outil installé.
Puis à l'aide de Fiddler, vous pouvez intercepter le navigateur de l'appel à la minified.js fichier avec le local unminified.js vous avez sur votre disque local.
Fiddler fondamentalement intercepte votre navigateur demande un fichier spécifique et peut servir jusqu'à un autre fichier de votre navigateur. Ainsi, vous pouvez maintenant regarder des nations unies-minifiés code.
Facile.
Une autre option est d'utiliser Firefox et obtenir le Venkman débogueur installé sur il - beaucoup mieux que Firebug à mon humble avis - et la Venkman débogueur a un "pretty print" une option qui peut visuellement de l'onu-minify la minifiés code au moment de l'exécution. Stick à votre point de rupture où l'on veut...
Une autre mise à jour: Il y a maintenant une extension firebug qui embellit JavaScript:
https://addons.mozilla.org/en-US/firefox/addon/javascript-deminifier/
Il fonctionne parfaitement pour moi dans Firefox 12.0.
Du crédit à cette réponse pour les taches il.
Vous pouvez utiliser le
debugger
commande n'importe où dans un fichier javascript. Lorsque l'interprète des hits de cette déclaration, si un débogueur est disponible (comme Firebug), alors elle est déclenchéetrouver la ligne, et placez un point d'arrêt. Puis de recharger le site /la page. Puis firebug se met automatiquement en pause l'exécution de l'instruction lorsqu'un point d'arrêt est atteint.
Ce sera de faire le travail.
http://jsbeautifier.org/
Vous pouvez également faire une recherche Google pour un javascript formatage automatique de la requête.