À l'aide de Firefox, comment puis-je surveiller tous les événements qui sont déclenchés?
J'essaie de déboguer une page Web qui fait un usage intensif des événements, et j'ai donc besoin de surveiller tous les événements qui sont déclenchés.
La plupart des événements sont liés à l'aide de jQuery. Il serait donc particulièrement utile de trouver un moyen de surveiller spécifiquement ces événements uniquement.
Bien sûr, vous pouvez très bien faire avec Firebug , la console et l'onglet scripts où vous pouvez ajouter des points d'arrêt et des montres, mais vous voulez le faire plus intelligemment/plus facilement évidemment.
Il existe un plugin Firebug soigneux appelé EventBug qui enregistre simplement tous les événements et les regroupe par type d'événement afin que vous puissiez développer et voir ce qui les a déclenchés.
EventBug ne le fait pas en temps réel, vous devez cependant vous rafraîchir.
Une autre façon consiste à utiliser la fonctionnalité "Journaliser les événements" contre n'importe quel élément DOM dans Firebug. Cela le fait en temps réel et vous pouvez également voir quels événements de commande sont déclenchés/déclenchés.
Essaye ça:
- Activer/désactiver Firebug
- Cliquez avec le bouton droit sur l'élément dans l'onglet HTML, si vous souhaitez voir tous les événements, cliquez avec le bouton droit sur
<body> - Choisissez
Log Eventsdans le menu contextuel - Assurez-vous que l'onglet Console est activé
- Cliquez pour activer le mode 'Persister' dans l'onglet Console (sinon l'onglet Console s'effacera une fois la page rechargée)
- Vous devrez peut-être sélectionner
Closed(manuellement) - Voila! regarder le flux d'événements dans l'onglet console
Voici ce que vous voyez avec les événements de journal:
Il vaut également la peine d'essayer le module complémentaire FireQuery pour Firebug pour voir quels éléments du DOM sont associés à des événements jQuery et ce qu'ils sont.
Et comme le mentionne la réponse de benvie, cela est également possible dans les outils de développement de webkit.
Cela a été introduit il y a quelques versions mais à partir de Firefox 35, les événements associés à un élément peuvent être vus sur l'inspecteur: à côté de l'élément dont vous souhaitez voir les événements (s'il y en a), il y aura une icône avec le ' Lettres EV. Cliquez dessus et vous verrez une petite fenêtre contextuelle avec les événements pour cet élément.
Plus d'informations: http://flailingmonkey.com/view-dom-events-in-firefox-developer-tools/
Cela n'existe pas dans Firebug je crois, et le problème sous-jacent est le manque de support ou le manque d'exposition au niveau de l'API. Alternativement, il n'y a que quelques façons de s'abonner aux événements DOM: Element.prototype.addEventListener (et window.addEventListener et document.addEventListener et XMLHttpRequest.addEventListener et quelques autres) à part les propriétés `` onevent '' qui sont observables et interceptables.
Mais en réalité, le débogueur WebKit et le débogueur Chromium (qui est un webkit avec des points supplémentaires) permettent de déboguer et d'observer les écouteurs attachés. Parfois, il est plus facile de déboguer les bogues d'un navigateur dans un autre navigateur avec une meilleure exposition de l'état de l'application/de l'exécution, même lorsque ce navigateur ne présente pas le bogue.
https://developers.google.com/chrome-developer-tools/docs/elements