How to add breakpoints in your inline javascript in chrome

Question

I want to debug my javascript code and able to successfully place breakpoints at required places under sources tab.

However, I have run into an issue where I want to debug my inline javascript code. Do we have any chrome debugging tool feature using which I can debug my inline javascript code.

I am fine with using Firebug too for debugging purpose.

PS: By inline javascript code, I mean JS code inside body tag and in the same file.

Answer 1

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