27

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.

3
  • 1
    Not an answer to your question, of course, but you can put a breakpoint on the inner statement and continue from the outer one, in this specific case.
    – Ben Zotto
    Commented May 21, 2010 at 19:38
  • Yes, that is true. But for normal debugging, I would need to set a breakpoint on every single line to get the behavior I desire. Commented May 21, 2010 at 19:48
  • 1
    That's the feature I was looking for, too. I think this would be great addition to Firebug. Commented Jul 1, 2010 at 8:14

5 Answers 5

11

Yes you can

At least in FireFox (25+) and Chrome (30+).

In FireFox this feature is called "Black boxing" and will be available with FireFox 25. It let's do exactly what you where looking for:

Nick Fitzgerald and Chris Heilmann: "New Features of Firefox Developer Tools: Episode 25"

This feature was also introduced to Chrome (v30+) although it's tougher to find/configure. It's called "skip through sources with particular names" and Collin Miller did an excellent job in describing how to configure it:

Collin Miller: "Tips and Tricks: Ignoring library code while debugging in Chrome"

I'm using it in Chrome right now. It works like a charm and saves me so much time.

5
  • 4
    Great find! Thank you for revisiting this question, and improving everyone's debugging experience. I want to accept this as the answer, but I can't until FF 25 and Chrome 30 are released. Thank you! Commented Sep 27, 2013 at 21:47
  • Verified! Chrome 30 is released. Thank you for finding this new feature! Commented Oct 3, 2013 at 20:45
  • @ScottRippey You're welcome! Glad I could help. And thank you for coming back and accept my answer :)
    – flu
    Commented Oct 7, 2013 at 9:13
  • Just a quick follow up ... @flu THANK YOU again! This works perfectly, and has been saving me SO much time. Very happy they added this feature. Commented Jan 23, 2014 at 6:46
  • Both of your links point to the same page. Could you update/fix the firefox link when you get a chance? I'm sure I can find it on the googlies, but it would be extra helpful for it to be in this answer as well for others that find this page looking for this answer. Thank you very much, and of course, thank you for the answer! I was looking for this solution as well.
    – Soundfx4
    Commented May 7, 2015 at 22:25
2

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.

1
  • 1
    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. Commented Jun 29, 2010 at 20:25
1

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

2
  • 1
    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.
    – Ben Zotto
    Commented May 21, 2010 at 19:42
  • 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. Commented May 21, 2010 at 19:53
1

At least Firebug's JavaScript debugger has an option to "step over" which still does 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 being called.

0

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.

3
  • 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
    Commented Jun 28, 2010 at 5:33
  • 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. Commented Jun 29, 2010 at 20:28
  • 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
    Commented Jun 30, 2010 at 2:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.