Wie finde ich heraus, welche JavaScript-Ereignisse ausgelöst wurden?

Question

Ich habe eine Auswahlliste:

<select id="filter"> 
    <option value="Open" selected="selected">Open</option> 
    <option value="Closed">Closed</option> 
</select> 

Als ich Closed die Seite neu geladen wählen. In diesem Fall zeigt es geschlossene Tickets (statt geöffnet). Es funktioniert gut, wenn ich es manuell mache.

Das Problem ist, dass die Seite neu geladen nicht, wenn ich Closed mit Watir wählen:

browser.select_list(:id => "filter").select "Closed" 

die in der Regel bedeutet, dass einige JavaScript-Ereignis nicht ausgelöst wird. Ich kann Ereignisse mit Watir feuern:

browser.select_list(:id => "filter").fire_event "onclick" 

aber ich muss wissen, welches Ereignis ausgelöst wird.

Gibt es eine Möglichkeit herauszufinden, welche Ereignisse für ein Element definiert sind?

Answer 1

Sieht aus wie Firebug (Firefox Add-on) hat die Antwort:

• offen Firebug
• Rechtsklick auf das Element in HTML Registerkarte
• klicken Log Events
• Register Konsole
• Klick aktivieren In der Registerkarte "Konsole" beibehalten (andernfalls wird die Registerkarte "Konsole" nach dem erneuten Laden der Seite gelöscht)
• 01 auswählen(manuell)

• wird es so etwas wie dies in Registerkarte Konsole sein:

  ... 
  mousemove clientX=1097, clientY=292 
  popupshowing 
  mousedown clientX=1097, clientY=292 
  focus 
  mouseup clientX=1097, clientY=292 
  click clientX=1097, clientY=292 
  mousemove clientX=1096, clientY=293 
  ... 
  

Quelle: Firebug Tip: Log Events

Answer 2

Ich dachte, ich hinzufügen möchte, dass Sie dies auch in Chrome tun :

Ctrl +Umschalt +I (Entwicklertools)> Quellen> Event Listener Breakpoints (rechts).

Sie können auch alle Ereignisse anzeigen, die bereits angehängt wurden, indem Sie mit der rechten Maustaste auf das Element klicken und dann seine Eigenschaften anzeigen (das Feld rechts).

Zum Beispiel:

Rechtsklick auf die upvote Taste nach links

Wählen Sie inspizieren Element

Reduzieren Sie den Artikel in Abschnitt (Abschnitt auf der rechten Seite - Doppelwinkel)

Erweitern Sie den Ereignis-Listener Option

Jetzt können Sie die Ereignisse sehen an den upvote gebunden

Nicht sicher, ob es als firebug Option ganz so mächtig ist, aber war genug für die meisten meiner Sachen.

Eine weitere Option, die ein bisschen anders, aber überraschend genial ist visuelles Ereignis: http://www.sprymedia.co.uk/article/Visual+Event+2

Er hebt alle Elemente auf einer Seite, die gebunden wurden, und hat popovers die Funktionen zeigt, die aufgerufen werden. Ziemlich raffiniert für ein Lesezeichen! Es gibt auch ein Chrome-Plugin, wenn das mehr dein Ding ist - nicht sicher über andere Browser.

AnonymousAndrew auch monitorEvents(window);here

Answer 3

Bezüglich Chrome hingewiesen, die monitorEvents Kasse() über die API-Befehlszeile.

• Öffnen Sie die Konsole über Menü> Extras> JavaScript-Konsole.
• Geben Sie monitorEvents(window);

• Ansicht der Konsole mit Ereignissen überflutet

  ... 
  mousemove MouseEvent {dataTransfer: ...} 
  mouseout MouseEvent {dataTransfer: ...} 
  mouseover MouseEvent {dataTransfer: ...} 
  change Event {clipboardData: ...} 
  ... 
  

Es gibt andere Beispiele in der documentation. Ich vermute, diese Funktion wurde nach der vorherigen Antwort hinzugefügt.