views:

109

answers:

4

While stepping through a script that uses jQuery, I just want to test the code I wrote. I don't want to step into the jQuery file -- I'm not debugging jQuery, just my own file.

Are there any ways to tell a debugger to not step into the jQuery file? I use Visual Studio + Internet Explorer, as well as Firefox + Firebug for stepping through code ... and both seem to love to step through dozens of jQuery statements.

For example, say I have a script like this:

$("div").each(function() {
   $(this).hide();
});

This is technically a single statement -- therefore "Step Over" will execute all code at once, which will skip over the inner "hide" statement. However, "Step Into" will take me to the jQuery code, and I will have to step dozens of lines of code before it takes me to the "hide" statement.

I would like to have the debugger completely ignore the jQuery code, so I can easily step through just my own code and never step through the jQuery code.

In C#, this is possible by using the [DebuggerStepThrough()] attribute on a class. But that doesn't help with JavaScript.

+1  A: 

At least firebug's javascript debugger has an option to "step over" which sill not descend into function calls. However, you will have to choose between "step (into)" and "step over" manually depending on what kind of function is called.

ThiefMaster
+1  A: 

F10 should step over the function calls, F11 should step into the function calls. This works in VS as well as firebug.

derek
I suspect the OP is asking about going in one step from the outer "each" statement but then seeing the next statement as the one inside the closure. That would seem to be the natural desire here while stepping.
quixoto
quixoto is right. The example above is technically just 1 statement, so if I press F10, the entire block will be executed.However, if I press F11, hundreds of jQuery statements will be executed before I enter my "function() { $(this).hide() }", so I will sit there hitting F11 until I see the execution come back to my script.There should be a way to ignore the jQuery code altogether.
Scott Rippey
+2  A: 

Pretty sure the answer is "no, this feature does not exist".

What's your motivation here, though? It looks to me like setting a breakpoint on Line 2 and creating a watch for the "resultset" of Line 1 whilst you're there will get you what you're likely to want.

wombleton
Yes, setting breakpoints would be easy for this example. But I usually have large script files that are hundreds of lines, usually nested jQuery style, and I don't want to set a breakpoint on every single line. My motivation is that I want to be able to step through and debug my code, without going in and out of other source files.
Scott Rippey
A: 

The answer is rather simple, you just have to refactor the function out. I can't recall

$("div").each(function() {
   doThis(this);
});

function doThis(object) {
   $(this).hide();
}

Will almost certainly work with a halfway decent debugger.

Chris
Oops, brain fart, replace object in the parameter with div or item or something and then replace the this in $(this).hide(); with whatever you call it.
Chris
This behaves the exact same way as the example I already gave. If the debugger is on Line 1, and you "Step Into", you will step into a dozen jQuery lines before "doThis". If you "Step Over", you will also step over the "doThis" function.
Scott Rippey
You should be able to set a break point on the hide statement though.Also, if you're debugging JS, use Firefox and Firebug if you aren't already.
Chris