In IE I can set breakpoints and debug just fine.
In Chrome I'm able to view the script but I have no options to set a breakpoint in the code, nor is there a "scripts" tab to navigate to for debugging. I'm confused. (Restarted chrome multiple times). I tried also setting a "debugger;" flag in the code, but that didn't work in Chrome.
What I've found that works is the following (in Chrome 21.0.1180.79):
Open the dev tools (ctrl+shift+i), then click the "Sources" tab. Notice the small right pointing arrow in the grey bar, if you click this, it'll show all the .js files loaded.
Here's the trick. Refresh the page (F5) and now all the inline script is available in this section, so you can set breakpoints at your pleasure :)
Add a @sourceUrl comment to your script. Chrome will then list the script in the Scripts / Sources tab in the Chrome DevTools.
There is a pretty good writeup about @sourceUrl on HTML5Rocks: http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/#toc-sourceurl
Even though the comment is called @source*Url*, you can put anything you want as a Url. It just needs to be a human-readable string which you'll use to find your script in the list of scripts.
