Like IE, Netscape Navigator 7 has a debugger of its own called Venkman. This provides all of the features and debugging power of the IE version; for example, we can step into, over, and out of our code, work with breakpoints, and access a call stack window.
Following is the main home page for Venkman:
To install Venkman, open NN 7+ and go to Venkman development page.
Click one of the links to install Venkman. This displays a screen similar to that shown in Figure 10-25.
Click Install and Venkman will be installed automatically. When it has been downloaded, we'll see the message shown in Figure 10-26.
We then need to click OK, close the browser, and reopen it. If we now look under the Tools ® Web Development menu we will see that an extra menu option has appeared. (See Figure 10-27.)
Click the Step Into icon on the debugger's toolbar and the code goes to the next line. The step over, step into, and step out commands work in a very similar way as they did in the IE debugger, but there are some differences. For example, the for loop head is just one step with Venkman whereas the MS debugger steps to the initialization first and then to the condition. Also, while the MS debugger runs over variable declarations, Venkman doesn't.
Keep stepping until we are in the writeTimesTable() function, as shown in Figure 10-30.
Notice that the window on the right-hand side in the middle, named Local Variables, has changed. It now shows under scope the variables within the scope of this function. In this function that's the counter, timesTable, and writeString variables. The current values of each variable are also shown, void in the case of variables yet to be assigned a value.
In the bottom-left corner are the Breakpoints and Call Stack windows. Currently it's just displaying the call stack but by clicking the breakpoint tab under the window we can switch to the breakpoint window and switch back with the call stack tab. Click the call stack tab to show the current state of the call stack, as shown in Figure 10-31.
As Figure 10-31 shows, there are two items in the call stack: the writeTimesTable() function call and the code that called it.
To set a breakpoint, we click the gray area in the source code window on the line where we want to set a breakpoint. (See Figure 10-32.)
In Figure 10-32, I clicked the gray area on the writeString = counter..... line, and the gray area has turned red with the letter B inside it to show it's a breakpoint. Also, the breakpoint has been listed in the Breakpoint window at the bottom-left of the screen. If we click the breakpoint again it will turn orange with the letter F to indicate this is a future break point. Clicking a third time removes the breakpoint. Alternatively, we could right-click the breakpoint listed in the breakpoint window and clear it there or indeed clear all breakpoints. Note that a future breakpoint is a breakpoint that is not set for this execution of the code but will be set next time the page is executed, for example, if we reload the page.
The final window we will mention is the File window, situated in Figure 10-32 in the top left corner. If we click the line, Navigator Window, it will open up a tree of currently loaded documents. In our case there is just one document, but there can be more than one if, for example, a frameset is loaded. This is the equivalent of the IE debugger's running documents window.
For NN 4.06+ browsers, the console that opens will be something like that shown in Figure 10-34.
Note that we've opened the console while the browser contained an empty page, in particular a page without errors, the main console screen is blank. Let's create a simple page with an error so that we can see what the console displays.
Save this as NN_ConsoleTest.htm and load it into a Netscape 4.06+ browser.
If our NN browser preferences are set to display errors in the console automatically (see Chapter 2), the console will appear as soon as the page is loaded. If not, open the console as described previously. The console will appear and display the error message shown in Figure 10-36.
For example, we could evaluate the following expression:
This displays an alert dialog box.
The dialog box displays 8 in the upper frame as follows:
And this creates two variables that display 55 in the upper frame as follows:
We just get the following message:
This limits the console's use in debugging.