conditional | SweetVision

19
Apr/070

Debugging using Conditional breakpoints with Firefox and Firebug.

Some times you have an error inside a loop that can be a real pain to get to. You certainly don’t want to put a breakpoint inside a loop and hit F10 a few thousand times until you get to the error condition. In this article, I would like to talk about a few tools in Firebug for Firefox to make debugging in these situations much easier and faster. Note, if you are not familiar with debugging, you may want to read my previous Firebug article

First, there is Continue. Continue is the function that will tell the debugger to continue executing the script until it encounters another breakpoint. In Firebug, Continue is the blue arrow pointing to the right in the upper right of Firebug. You can also use the F8 key to continue. You can use continue inside a loop to skip to your breakpoint in the next iteration of the loop.

Perhaps the most important tool for debuging inside of loops is the conditional breakpoint. You can set a condition on a breakpoint so it will only break when a specified condition is true. Giving the following code (open debug loops example):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
1: &lt;SCRIPT LANGUAGE="JavaScript"&gt;

2:

3: function init(){

4:  var myArray = new Array(99);

5:

6:  for(i = 0; i&lt;99; i++){

7:      myArray[i] = i*2;

8:  }

9:

10:     myBody = document.getElementsByTagName("body").item(0);

11:     for(i = 0; i&lt;=99; i++){

12:         myBody.innerHTML += myArray[i];

13:         myBody.innerHTML += "&lt;br /&gt;";

14:     }

15: }

16:

17: &lt;/SCRIPT&gt;

18: &lt;BODY onload="init();"&gt;

19:

20: &lt;/BODY&gt;

21: &lt;/HTML&gt;

I could put a breakpoint on line 12, but I would have to hit F8 (Continue) 99 times to get to the end of the loop, which can get tiresome. Something much less tiresome and much more efficient is to attach a condition to the breakpoint. A condition can be added to a breakpoint by right clicking on it. Right clicking on a break point will bring up a pop up that will allow you to enter a condition for the breakpoint. In the case of the code above I am going to use ‘i=99′, so my code execution will break when the variable ‘i’ is equal to 99.

By using conditional breakpoints you can easily conquer errors in your loops, find those pesky random values that break everything, and save time getting to the core of the issue.