How can I set breakpoints in an external JS script in Firebug

Question

I can easily set breakpoints in embedded JS functions, but I don't see any way of accessing extarnal JS scripts via Firebug unless I happen to enter them during a debug session. Is there a way to do this w/o having to 'explore' my way into the script?

@Jason: This is a good point, but in my case I do not have easy access to the script. I am specifically talking about the client scripts which are invoked by the ASP.Net Validators that I would like to debug. I can access them during a debug session through entering the function calls, but I could not find a way to access them directly.

Answer 1

Clicking on the line number in the left hand margin should create a break point for you (a red circle should appear).

All loaded scripts should be available from the firebug menu - click where it says the name of the current file should show a drop down with all files listed.

Answer 2

Place "debugger;" in your external script file on the line you want to break on (without the quotes, obviously).

Answer 3

After you place a break point in them, you can also call them by name in the firebug console, and see the output of (or step through) any intermediate functions. This can help when the main entry point calls many other helper functions, and you are really just concerned with how these helpers are working.

That being said, I don't knwo anything about ASP.Net validators, so its possible this doesn't apply.

Answer 4

Putting the "debugger;" line also does the trick for the Chrome debugger.

Answer 5

To view and access external JavaScript files (*.js) from within Firebug:

1. Click on the 'Script' tab.
2. Click on the 'all' drop down in the upper left hand corner above the script code content window.
3. Select 'Show Static Scripts'.
4. Click on the dropdown button just to the right of what now says 'static' (By default, it should show the name of your current web page). You should now see a list of files associated with the current web page including any external JS files.
5. Select the JavaScript file you are interested in and it's code will display in the content window. From there, you should be able to set breakpoints as normal.

Answer 6

umm.... I click the script tag, then I click the all and select show static. According to this there should be a dropdown to the right of where it says "static" but there isn't anything. I know I have done this before without even giving it a thought... Is it possible it doesn't work if the scripts are served from a localhost or something?