By Craig Buckler

What’s New in Firebug 1.9

By Craig Buckler

Firebug is the world’s best-known browser development console. All browsers offer decent debugging facilities these days but they all owe a debt of gratitude to Firebug. Even developers who have switched browsers keep Firefox installed because Firebug is so damn good!

If you have Firebug installed in Firefox 5.0 or greater you should have received version 1.9 during the past few days. If not, head over to for information and download links. Here are some of the new gems you’ll find…

Configurable Docking

Until now, Firebug has either appeared at the bottom of the window or in its own pop-out. It’s now possible to dock it on the top, bottom, left or right of the browser — which is great if you’re using a wide-screen monitor.

To change the position, click the down arrow next to Firebug’s icon followed by “Firebug UI Location”.

Firebug UI location

Improved Error Reporting

It’s important to know which JavaScript file and line which caused an error but Firebug can now highlight the exact location of syntax issues.

Firebug syntax errors

Copy JSON From Ajax Responses

If you’re implementing any type of Ajax functionality, Firebug’s essential. It’s always been possible to view and expand JSON data but you can now copy the whole payload with a right-click.

Firebug JSON copy

Resend HTTP Requests

This is a great new feature: right-click any request shown in the Console or Net panels and hit Resend to execute the request again.

Firebug resend HTTP request

It’s ideal for Ajax debugging since you don’t need to reload the page or initiate a new request via your application’s interface.

Font Viewer

Everyone’s using web fonts so Firebug now has a preview tooltip whenever you hover over a font name in the style tab.

Firebug font preview

There’s also a built-in font viewer within the Net panel whenever a .woff file is downloaded.

Firebug font viewer

Quick Removal of Elements

To quickly remove an item from your page, click the “Inspect Element” icon, highlight the element and press the Delete button on your keyboard .

…and More

You’ll also find several other features such as the protocol and cached headers shown in the Net panel, adding a watch from the DOM panel, and tooltips on conditional breakpoints and array items.

Firebug keeps getting better. Have you discovered any great new features?

  • Ryan

    Craig! You should do an article on a comparison between Firebug and Chrome developer tools.

    • Thanks Ryan. That’s a nice idea – although I think it should also include Opera Dragonfly and IE’s developer tools. I’ll certainly consider it.

  • I like the font preview part. It should also highlight the currently used font face and probably will some time in the future.

  • Man Firebug just keeps getting more and more awesome. It comes in SO handy when writing HTML, CSS or JavaScript, especially when I need to run some tests on the jQuery Plugins I write to distribute on my website (

  • Mike

    Stop the memory leak issues. Firebug is, by far, my favorite web dev tool. However, it has consistently brought down multiple Macs of fine with 8GB Ram, when used over consistently for a couple hours. It’s just terrible…and a Firefox restart doesn’t always give your Mac that memory back.

    • Firefox did have dubious memory use on the Mac so I’m not sure it’s Firebug at fault. Are you getting the same problem in v9? Mozilla promised to address many of the issues.

    • We are working on it. Sometimes its Firebug, sometimes its Firefox. 1.9 does have many memory leaks addressed. Right now, Honza is pushing for better tools to identify what is actually leaking. With things like about:memory and the like, it is getting better with each release.

  • Robbo

    Moving it around is going to be so good! Bottom always annoyed me.

    • Docking on the left/right is far more efficient if you’re using a widescreen monitor and have Firefox maximized.

Get the latest in Front-end, once a week, for free.