Java Reference
In-Depth Information
figure 18-21
debugging in firefox with firebug
Firefox's story is an interesting one because its toolset is relatively new to the browser. For many
years, Firefox did not have native developer tools. Instead, developers relied upon a Firefox
extension called Firebug, which was the first suite of browser‐based developer tools. The tools we
use in every browser today are directly inspired by Firebug.
Even though Firefox has its own set of built‐in tools, they still lack a lot of features found in Firebug
(and other browsers' tools). So for this section, you need to download and install the Firebug
extension.
on the web page and follow the instructions. In most cases, you will not need to restart Firefox.
You can access Firebug by clicking the Firebug icon in the toolbar (Figure 18-22). You can also access
a dropdown menu by clicking the down arrow next to the Firebug icon to reveal additional settings.
Many panels are disabled by default, so clicking on the Enable All Panels option is very useful.
The JavaScript debugger is contained in the Script tab, and it is made up of two panels. The left
panel contains the source code, and the right panel contains three different views to choose from:
Watch, Stack, and Breakpoints.
Setting Breakpoints
Creating breakpoints in Firebug is easy; simply left‐click the line number or the gutter. Breakpoints
are denoted by a red circle in the gutter.
