Mozilla released Firefox 1.5 at the end of November last year and one of its features is on auto-update mode. I note that I am now running 188.8.131.52 that was released on the 1st of February 2006.
According to the release notes, Firefox comes with faster browsing, automatic updates, tabbed browsing, improved popup blocking, integrated search, stronger security, live bookmarks, accessibility, customisability and next generation web support.
Laudable as all these features are, we are just going to focus on developer goodies, particularly in the area of customisability.
Out of the box, Firefox 1.5 comes with the DOM inspector, but only if you choose custom installation and then tick developer tools. Once installed, the DOM inspector is visible on the tools menu or CTRL/SHIFT/I.
Reinstallation seems to be the only way to activate the DOM inspector, but all the local settings seem to be preserved. Once the DOM inspector is installed, it is possible to examine any web page in a structured manner. An example is shown here:
Ever since the early betas of Firefox, it has been customisable. There are four ways of enhancing Firefox: plugins, search-engines, themes and extensions.
A plugin is a mechanism for consuming and rendering a resource type with the most common being Acrobat and Flash.
Firefox has a search box on the right of the toolbar that provides a Google search by default. However, as you can see from the screenshot, it can be extended it with a number of different searches.
Searches can be displayed either with a normal web page or with a SearchSidebar extension. Searches are extremely simple to develop (six XML tags) and a local search toolbar for Trademe is available from www.berm.co.nz.
This provides the web developer with 3 useful tools:
1. A resizable console at the bottom of the screen for examining HTML and XML elements. While most of this functionality is available in the DOM inspector, the Firebug console feels more comfortable on older web pages laid out using tables.
Firebug has a little icon on the status line similar to MS-IE that says whether the page render was valid and error-free. Clicking on the error icon opens Firebug to show further details.
3. For the brave Ajax developers, Firebug has a trace window for XML HTTP requests.
Web Developer Toolbar
This extension provides a rich toolbar that provides a number of really useful ways of changing the behaviour of the browser without changing the HTML code. A web developer toolbar is added to the browser with 12 drop-down menus.
Each drop-down menu averages over 12 items, so there are over 150 menu items to use and it would not be appropriate to describe them all here. A couple of the items hook into WAI and section 508 accessibility checks for US government work, but the rules apply equally to the quality control of any public website. There are also links for validating CSS, HTML and RSS feeds, as well as checking hyperlink existence.
Several of the browser options allow testing of web pages without changing the HTML. These include turning on and off cookie support for session checking, checking print-specific style layout without printing, disabling styles, populating form fields and switching between GETS and POSTS.
Any sort of software development without runtime diagnostics can be a little tedious. Dump and trace statements are all very well, but a developer needs to be able to step through code, set breakpoints and look at the current value of variables.
Unfortunately, the Mozilla site seems unable to keep the links of this extension up to date with their latest version of the browser, but it is possible to download the latest version from http://getahead.ltd.uk
International standards support