How to check if an event was fired or not?

Question

I'm using Chrome DevTools to debug JavaScript. In my script I bound a click event to an element using the jQuery bind() method. How to check if that event was fired or not?

Edit
Sorry because I wasn't so specific, I know that I can use console.log() or set a breakpoint inside the event listener body. What I'm talking about here is an out of box feature of the Chrome DevTools that allows you to check that without using the console, e.g a tab that contains all the events that were fired with related information.

Answer 1

Regarding Chrome, checkout the monitorEvents() via the command line API.

• Open the console via Menu > Tools > JavaScript Console.
• Enter monitorEvents(window);

• View the console flooded with events

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

There are other examples in the documentation. I'm guessing this feature was added after the previous answer.

Answer 2

Use console.log() for more user friendly check (console must be opened of course to see the result):

$("#myElement").bind("click", function() {
   console.log("Fired!");
});

Or you can alert it, which is much more anoying tho:

$("#myElement").bind("click", function() {
   alert("Fired!");
});