Full Form of DEB

What is DEB Full Form?

DEB is full form Debug Event Browser

What is Debug Event Browser?

[0:08] In this setup, I have a clickEventListener that I've added to the parent element, and it's going to logout ParentClicked when it's executed, and I've added this event listener in the capture phase.

[0:19] I'm also adding a clickEventListener to the button element which will logout ButtonClicked when it's clicked, and I'm not providing a capture value to this event listener, so it's going to be executed in the bubble phase.

[0:31] You can debug your event listener code in the same way that you would debug any code. You can add console statements. I'm going to logout the event. I can see that there. I could add debugger statements.

[0:48] Now when I click on the button, I'll see that my on parent clickEventHandler. I can now get a breakpoint in here. I can do things like inspect the disk context and the event. I can also remove the debugger statement and add my own breakpoints.

[1:04] I was to pause the execution of my application during myEventListener and I can inspect the event and also the disk context. In the sources panel, I can also go to the event listener breakpoint section.

[1:20] I can cause the browser to create breakpoints for categories of events or specific events. Here I can go in to the MouseEvents for the clickEvent. Now when I click on the button, my parent event listener added in the capture phase is being broken into first.

[1:37] I can see information about that. If I jump to next breakpoint, I can see that my button EventListener is being paused on as well. Using this I can step through all of the event listeners that were being executed as part of this event.