How to Set a JavaScript Breakpoint from Code in Chrome

How to set a JavaScript breakpoint from code in Chrome?

You can use debugger; within your code. If the developer console is open, execution will break. It works in firebug as well.

How to set breakpoints on each line of code?

Open the Devtools Sources panel. Open the Content scripts tab, and browse to the extension script you want to debug.

Sample Image

How to set breakpoints in inline Javascript in Google Chrome?

Use the sources tab, you can set breakpoints in JavaScript there. In the directory tree underneath it (with the up and down arrow in it), you can select the file you want to debug. You can get out of an error by pressing resume on the right-hand side of the same tab.

Chrome console - breakpoint over whole file

I think this will be of use to you. I've recently been doing some work on the JavaScript Breakpoint Collection Chrome Extension created by Matt Zeunert, which allows you to inject breakpoints into your code at runtime - including breaking on property access/modifications, functions, scrolling events, etc. You can break on any arbitrary objects as well as the predefined ones using the console API.

Check out the project here.

How to add breakpoints in your inline javascript in chrome

Another way can be using the dynamic script method.
Chrome provides simple parser command which can tag dynamically loaded JS.

<script type="text/javascript">
[...]
//# sourceURL=dynamicScript.js
</script>

This line tells the chrome debugger that this whole script inside the script tag should be interpreted as a dynamicScript.js file. You can find the file on the debugger list and easily set up breakpoints or check the code.

Note : @ is replaced by # to avoid errors on unsupported browsers

Breakpoints in Dynamic JavaScript

Is there a way to set breakpoints for every js line in the chrome dev tools?

Once your code breaks, there's a button beside "resume script execution" called "step over next function call" or F10, which will resume step by step.



Related Topics



Leave a reply



Submit