MonitorEvents

From FirebugWiki

(Difference between revisions)
Jump to: navigation, search
(Added description of syntax, hint for needing help and linked back to Command Line API)
(Extended description)
Line 7: Line 7:
monitorEvents(object[, types])
monitorEvents(object[, types])
</source>
</source>
 +
 +
== Parameters ==
 +
=== object ===
 +
Object to log events for. '''(required)'''
 +
 +
=== types ===
 +
Event type(s) to log. This can be a single event type or an array of event types.
 +
 +
Besides supporting all normal events Firebug and Web Inspector offer a bunch of event groups, which combine several event types.
 +
 +
==== Event groups ====
 +
{| class="wikitable" style="width:100%; vertical-align:top;"
 +
|- bgcolor=lightgrey
 +
! style="width:100px;" | Group || Included events in Firebug || Included events in Web Inspector
 +
|-
 +
| <code>composition</code> || <code>composition</code>, <code>compositionend</code>, <code>compositionstart</code> || -
 +
|-
 +
| <code>contextmenu</code> || <code>contextmenu</code> || -
 +
|-
 +
| <code>control</code> || - || <code>blur</code>, <code>change</code>, <code>focus</code>, <code>reset</code>, <code>resize</code>, <code>scroll</code>, <code>select</code>, <code>submit</code>, <code>zoom</code>
 +
|-
 +
| <code>drag</code> || <code>dragdrop</code>, <code>dragenter</code>, <code>dragexit</code>, <code>draggesture</code>, <code>dragover</code> || -
 +
|-
 +
| <code>focus</code> || <code>blur</code>, <code>focus</code> || -
 +
|-
 +
| <code>form</code> || <code>change</code>, <code>input</code>, , <code>reset</code>, <code>select</code><code>submit</code> || -
 +
|-
 +
| <code>key</code> || <code>keydown</code>, <code>keypress</code>, <code>keyup</code> || <code>keydown</code>, <code>keypress</code>, <code>keyup</code>, <code>textInput</code>
 +
|-
 +
| <code>load</code> || <code>abort</code>, <code>beforeunload</code>, <code>error</code>, <code>load</code>, <code>unload</code> || -
 +
|-
 +
| <code>mouse</code> || <code>click</code>, <code>dblclick</code>, <code>mousedown</code>, <code>mousemove</code>, <code>mouseup</code>, <code>mouseout</code>, <code>mouseover</code> || <code>click</code>, <code>dblclick</code>, <code>mousedown</code>, <code>mousemove</code>, <code>mouseup</code>, <code>mouseout</code>, <code>mouseover</code>, <code>mousewheel</code>
 +
|-
 +
| <code>mutation</code> || <code>DOMSubtreeModified</code>, <code>DOMNodeInserted</code>, <code>DOMNodeRemoved</code>, <code>DOMNodeRemovedFromDocument</code>, <code>DOMNodeInsertedIntoDocument</code>, <code>DOMAttrModified</code>, <code>DOMCharacterDataModified</code> || -
 +
|-
 +
| <code>paint</code> || <code>paint</code>, <code>resize</code>, <code>scroll</code> || -
 +
|-
 +
| <code>scroll</code> || <code>overflow</code>, <code>underflow</code>, <code>overflowchanged</code> || -
 +
|-
 +
| <code>text</code> || <code>text</code> || -
 +
|-
 +
| <code>touch</code> || - || <code>touchcancel</code>, <code>touchend</code>, <code>touchmove</code>, <code>touchstart</code>
 +
|-
 +
| <code>ui</code> || <code>DOMActivate</code>, <code>DOMFocusIn</code>, <code>DOMFocusOut</code> || -
 +
|-
 +
| <code>xul</code> || <code>popupshowing</code>, <code>popupshown</code>, <code>popuphiding</code>, <code>popuphidden</code>, <code>close</code>, <code>command</code>, <code>broadcast</code>, <code>commandupdate</code> || -
 +
|-
 +
| <code>clipboard</code> || <code>cut</code>, <code>copy</code>, <code>paste</code> || -
 +
|}
 +
 +
== Examples ==
 +
<source lang="javascript">
 +
monitorEvents(document.body)
 +
</source>
 +
 +
This will monitor all events occurring to the <code>&lt;body&gt;</code> element.
 +
 +
<source lang="javascript">
 +
monitorEvents(document.getElementsByTagName("input")[0], "keydown")
 +
</source>
 +
 +
This will monitor all <code>keydown</code> events occurring to the first <code>&lt;input&gt;</code> element.
 +
 +
<source lang="javascript">
 +
monitorEvents(document.getElementById("interactive"), "mouse")
 +
</source>
 +
 +
This will monitor all mouse events (<code>click</code>, <code>dblclick</code>, <code>mousedown</code>, <code>mousemove</code>, <code>mouseup</code>, <code>mouseout</code> and <code>mouseover</code>) occurring to the element with the id  <code>interactive</code>.
 +
 +
<source lang="javascript">
 +
monitorEvents(document.getElementById("interactive"), ["mouse", "keyup", "keydown"])
 +
</source>
 +
 +
This will monitor all mouse events (<code>click</code>, <code>dblclick</code>, <code>mousedown</code>, <code>mousemove</code>, <code>mouseup</code>, <code>mouseout</code> and <code>mouseover</code>) plus all <code>keyup</code> and <code>keydown</code> events occurring to the element with the id <code>interactive</code>.
== See also ==
== See also ==
 +
* [[unmonitorEvents]]
* [[Command Line API]]
* [[Command Line API]]

Revision as of 12:58, 5 July 2012

This article is incomplete. Please help to add more information to it. If you're not registered yet, you can ask for an account.

Turns on logging for all events dispatched to an object. The optional argument types may define specific events or event types to log.

Contents

Syntax

monitorEvents(object[, types])

Parameters

object

Object to log events for. (required)

types

Event type(s) to log. This can be a single event type or an array of event types.

Besides supporting all normal events Firebug and Web Inspector offer a bunch of event groups, which combine several event types.

Event groups

Group Included events in Firebug Included events in Web Inspector
composition composition, compositionend, compositionstart -
contextmenu contextmenu -
control - blur, change, focus, reset, resize, scroll, select, submit, zoom
drag dragdrop, dragenter, dragexit, draggesture, dragover -
focus blur, focus -
form change, input, , reset, selectsubmit -
key keydown, keypress, keyup keydown, keypress, keyup, textInput
load abort, beforeunload, error, load, unload -
mouse click, dblclick, mousedown, mousemove, mouseup, mouseout, mouseover click, dblclick, mousedown, mousemove, mouseup, mouseout, mouseover, mousewheel
mutation DOMSubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMNodeRemovedFromDocument, DOMNodeInsertedIntoDocument, DOMAttrModified, DOMCharacterDataModified -
paint paint, resize, scroll -
scroll overflow, underflow, overflowchanged -
text text -
touch - touchcancel, touchend, touchmove, touchstart
ui DOMActivate, DOMFocusIn, DOMFocusOut -
xul popupshowing, popupshown, popuphiding, popuphidden, close, command, broadcast, commandupdate -
clipboard cut, copy, paste -

Examples

monitorEvents(document.body)

This will monitor all events occurring to the <body> element.

monitorEvents(document.getElementsByTagName("input")[0], "keydown")

This will monitor all keydown events occurring to the first <input> element.

monitorEvents(document.getElementById("interactive"), "mouse")

This will monitor all mouse events (click, dblclick, mousedown, mousemove, mouseup, mouseout and mouseover) occurring to the element with the id interactive.

monitorEvents(document.getElementById("interactive"), ["mouse", "keyup", "keydown"])

This will monitor all mouse events (click, dblclick, mousedown, mousemove, mouseup, mouseout and mouseover) plus all keyup and keydown events occurring to the element with the id interactive.

See also

Personal tools