In this lab you will start learning how to use a very valuable programming tool called the debugger. Program debuggers work by allowing you to step through your program and examine what is happening at each step. They also allow you to specify and stop at specific points where you suspect an error (bug) may be occurring.
Just as a medical doctor can sometimes tell what is wrong with a patient just by looking at them, sometimes we can deduce what is wrong with a program just by examining its output. However when a diagnosis is not obvious, a doctor uses tools and tests to look inside the person to see what is wrong. The program debugger is the computer scientist's most important tool for looking "inside" a computer program. As you develop larger and more powerful programs, the debugger will become a crucial tool in diagnosing the causes of errors in your programs. By starting to use and learn the debugger now, you will be better equipped to find and understand bugs in your future programs.
But the debugger does not replace thinking. You can
track down the point at which the error occurs but will
probably have to think about why it occurs.
- Set up a new eclipse project for each lab (detailed instructions)
- Copy the files DrawingPanel.java, IfGrid.java, IfGridEx3.java and IfGridEx4.java into your project folder.
- Double click the IfGrid.java file for viewing in the editor panel then run the IfGrid program to make sure it works.
- You are now going to set a "breakpoint" at the first executable line in the program. A "breakpoint" is a term used by the debugger to indicate a point in the code where you want the debugger to stop temporarily. In the bar at the left side of the editor panel, double-click next to line 7. This will set a breakpoint at that line. It should look like this:
The breakpoint is indicated by the blue circle. You can
insert as many breakpoints in your program as you want, but
for now we just need one as the place to start examining our
program.
- Click the debug icon
to run your program in the
debugger.
- It will ask you to confirm changing to the "Debug
perspective".
- Check "Remember my decision" and click Yes. The
debug perspective should look like this:
The "debug perspective" is simply another arrangement of
display panels within Eclipse that is intended to be useful
for debugging. The editing and console panels are
still there, but we now also have a Debug panel, a Variables
panel, and others. In the upper right corner are
buttons that allow you to switch back and forth between the
original Java Perspective and the Debug perspective.
When you clicked the debug icon, the program was started, and it ran until it reached your breakpoint at line 7. This line is the current execution point and is highlighted in green. The program is temporarily suspended at this point until you give a debugger command to continue executing. Note that line 7 has not yet been executed. It is important to remember that the current execution point always shows the next line to be executed.
- We are now going to execute line 7 of your
program. Click the Step
Over icon
in the debug panel. Line 7
creates a drawing panel which will appear on your
screen. Look at the drawing panel now and after each
of the following steps.
- Click the Step Over icon again. Line 8 sets the background color of the drawing panel to blue.
- Note: if you ever click the wrong thing, you can always
click the Terminate
icon
and start a new debugging run. - Click the Step Over
icon until you reach line 20. Now look at the
Variables panels.
Which statement is about to be executed after you do the
next Step Over?
Each active variable in your program is shown along with
its current value. You may have to scroll down to see
what I have shown. You can also hover the mouse over
any active variable in the editor panel to see its current
value.
- Continue clicking Step
Over until you return back to the start of the
while (y < 10) loop. The variables defined inside
the loop such as cornerX will not be displayed because
they are not active, but x and y are active and you'll notice that y's
value was just changed to 1.
- Continue clicking Step Over until y reaches 3.
Capture a screen shot of Eclipse at this point (on Windows: Alt+PrntScr) (on Macs: Command+Shift+4) and paste it into your solutions document.
It would be much too tedious to step through this entire
program one line at a time. To become efficient with a
debugger you need to learn to use breakpoints to quickly
navigate to a point where you think your error might occur.
There aren't any errors in this code, but let's say
something was going wrong when the color was set to green.
You can set a breakpoint at that point in the code and then
tell the debugger to resume execution until it reaches that
point. Do the following:
- Set a breakpoint at line 21 that sets the color to green. (Double-click at that line in the bar at the left side of your code.)
- Click the Resume
icon
in the Debug
panel. This resumes execution until the next
breakpoint is reached. - Notice in the Variables panel that the variable x is now 4. Why is x now 4? Write your answer in the solutions document. In the Drawing Panel you can visually see how far it has run.
- Click Resume again. It will run through the entire y-for-loop until it reaches line 21 again.
- Continue clicking Resume until the variable y reaches 5 (as shown in the Variables panel).
- Capture a screen shot of the Drawing panel at this point and paste it into your solutions document
- Look at the DrawingPanel. The values of x and y
are 4 and 5. Why is the green square at x = 4 and y
= 5 not displayed? Clicking Step Over until that
square appears on the DrawingPanel may help answer this
question. Write your answer in the solutions
document.
Note: Breakpoint locations remain marked in your program until you remove them, even if you save your program and come back the next day. They are ignored when you run your program normally, so you don't necessarily need to remove them. However if you choose to, you can remove them simply by double-clicking on each breakpoint icon. You can also use the pulldown menu: Run -> Remove All Breakpoints
Now try running the program called IfGridEx3.java. I had intended the program to print a large green square with a 2 square yellow border, as shown below but I made a few errors that cause it to not quite work. First run it using the plain Java perspective to see what it looks like now. Your task will be to use the debugger to find the location of the errors and then you can fix them. You might be able to spot the problems by just looking at the code, but please go through this exercise using the debugger.
Using the debugger continue stepping through this code to discover why it sometime fails to set a color. Make sure you understand what is happening. It will be helpful to look at the DrawingPanel screen, too. Thinking about why the color is wrong in the first square may help.
- The debugger will tell you where the problem is happening but not why. To fix the error you will have to rethink the solution. The current solution has the correct elements but arranged incorrectly. Use the skills you used in the previous exercise to do this.
- Fix any errors and continue debugging until your program
produces the desired output as described in the method
comment and also shown above.
- hint : which if
does the else get
matched to? There are a number of ways to solve this: you
could rewrite the nested if
to be a single if
with &&
operators, or you could add some else statements to
match earlier ifs.
Copy your corrected
if code and a screen shot of the Drawing
panel into
your solutions document.
Run the IfGridEx4.java
program. I intended to have an image that looked like:
Instead, it seems that I missed coloring 4 squares.
One way to make debugging more efficient (less step by step
clicking) is to identify the conditions when things fail. In
this case, it seems that the program does the wrong thing
for the following combinations of x & y : (2,0), (2,9),
(7,0) and (7,9).
Eclipse has the ability to specify conditional breakpoints
which stop execution when a particular condition is
satisfied.
Set a breakpoint at the first if statement. Then
right click on the breakpoint and select the breakpoint
properties:
Next select the Conditional option and specify the condition that must be satisfied for the breakpoint to be activated in the box below. For example, here is the condition for stopping when y == 9 and x == 9 (no if statement is need, just an expression that results in a true or false value):
You should write a condition for one of the errant points mentioned above.
Now debug and/or resume debugging. The program will only
stop at the conditional breakpoint when the condition is
met. Check the x and y values to make sure. Now that we are
close to the point where the bug happens, step slowly
through the program looking for incorrect behavior. Hint:
did a color get set? Second hint: which if does the else get matched with
(careful with the {}'s) ? Once you find the problem, you can
correct the code. There are a number of ways to fix this:
adding an else in
the right place is one way to address the problem.
In your solutions document
provide a screen snapshot of the breakpoint properties
window that you used.
You can can switch back and forth between the Debug
Perspective and the normal Java Perspective using the 
buttons in the upper right corner. If you have
rearranged the panels you can also right-click on these
buttons to reset the perspective to its normal arrangement.
Save your
solutions document to your USB flash drive and submit it.
- Set a breakpoint on the if statement.
- Right click on it and select Breakpoint Properties...
- Select Hit Count and enter a value of 100.
- It will now stop at the 100th time it reaches this
breakpoint (which will be the last square)
- Using breakpoint properties can be very handy in complex situations!