Avoiding JavaScript Library Code While Debugging

I was attempting to debug a piece of JavaScript code in SharePoint that was having issues.  Since I was unfamiliar with the codebase, I decided to try to figure out what code was running right after a certain button click using a tactic described in my blog post How to Start JavaScript Debugging at Just the Right Time.  The problem, however, is that I immediately jumped into a ton of SharePoint JavaScript library code for handling button click events that had nothing to do with the code for which I was looking.  There were about 80 calls before I got to the code I was looking for, and that was a lot of lines of code to step through.  However, there is a better way.

In the IE developer tools, a new tab appears for each JavaScript file you encounter while stepping through code.  So the first tab that opened up for me was a SharePoint JavaScript file.  If you are not concerned with the code in that file, you can right click on the tab and select the Library Code option. This marks the file as library code and the debugger will no longer break in that file when stepping through code (though it will still break if an exception occurs).

LibraryCode_thumb.png

If you need to unmark as library as library code you can either open it up again and do it from the tab, or you can use the files dropdown.

LibraryCodeList_thumb.png

On the right side of the files list there is an icon that looks like a keyhole with a red slash through it on any file that has been marked as library code.  You can just click on that icon to unmark the item as library code.  You can also mark items as library code from this list as well.