For example there is a button. It is wrapped by <div>
.
When pressing to this button, there is Javascript function call happen, then another function, then calling by ajax to the server and if it's OK, Javascript redirecting this page to another page.
It's hard to debug.
Is it possible to "catch" this event? I.e. to know, what function is called after the click on the button? Button doesn't have attribute onclick
i.e. event listener is connected in Javascript.
And if it's not possible then is it possible to make trace? That is to look at all functions calls, which is called after which?
It would be better in visual way, though in textual is also good:)
In the debugger window, you can set breakpoints in the JavaScript code. At each breakpoint, JavaScript will stop executing, and let you examine JavaScript values. After examining values, you can resume the execution of code (typically with a play button).
What makes JavaScript great is also what makes it frustrating to debug. Its asynchronous nature makes it easy to manipulate the DOM in response to user events, but it also makes it difficult to locate problems.
Yeah - this sort of thing is not as simple is you would like.
Google Chrome has an Event Listeners panel. Right-click your button, then select Inspect Element. Make sure the correct element is selected, then check the Event Listeners panel on the right.
You can also use the debugger
keyword to set a breakpoint in the call stack somewhere. Then use your favorite javascript debugger (built-in dev tools in Safari, Google Chrome & IE8, firebug for Firefox). In each of these, there's a call stack that'll allow you to navigate through the current call stack.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With