Is there any way I can put a break point on chrome developer tool so that the screen is paused when I click submit button? In precise how to break on submit action?
Right click the breakpoints pane (you need to have some breakpoints to see the option), and you ll find, "Remove All Breakpoints".
# Open the Issues tab Open DevTools. Click the Go to Issues button in the yellow warning bar. Alternatively, select Issues from the More tools menu. Once you're on the Issues tab, click the Reload page button if necessary.
An XHR (XMLHttpRequest) breakpoint breaks code execution when an XHR request is dispatched so that you can examine the current state of the program. You can break on all requests or on those that include a specific URL.
I posted a very similar answer that details how to enable specific event listener breakpoints in Google Chrome Dev Tools.
In the dev tools, go to the Sources
tab, and look in the right-hand column with the expandable/collapsible sub-panes. Expand the one called Event Listener Breakpoints
. Under here are expandable checkbox selections that allow you to tick any events that you wish to listen for. Once you check any of them, Chrome will break in JS code as soon as an event of that type occurs.
You specifically want the submit
event under the Control
group. Expand Control
, and tick submit
, as shown in the image below (the box on Control
is added automatically to indicate that some, but not all, of the items under it are ticked). Chrome's dev tools should then hit a dynamic breakpoint immediately any time a submit event occurs.
Fun fact: I still had submit
ticked when I clicked the button to post this answer, and Chrome hit a breakpoint :).
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