Mozilla

Firebug 1.9 New Features

Firebug 1.9 has been released and as usual I would like to get this opportunity to present some new features introduced in this version.

Firebug

First of all, check out the following compatibility table:

  • Firefox 4.0 with Firebug 1.7.3
  • Firefox 5.0 – 11.0 with Firebug 1.9
  • Firefox 12.0 (nightly) with Firebug 1.10

Firebug 1.10 alpha 1 will be available next week, you can use Firebug 1.9b6 for Firefox nightlies in the meantime.

Here is a summary of all new features

Firebug UI docking

Firebug UI can be positioned on all fours sides of the browser window. Just open the start button popup menu, pick Firebug UI Location sub menu and finally select the position you prefer the most.

Copy JSON responses to the clipboard

Are you dealing with AJAX & JSON? Firebug allows inspecting JSON responses and copying parts of the JSON tree to the clipboard. Just expand an HTTP request (in the Console or Net panel), select the JSON tab and right click in the tree to get the context menu.

Syntax error position displayed

The Console panel shows an arrow to the exact position inside the line of the syntax error when an error occurred.

New column in the Net panel: Protocol

The Net panel offers a new Protocol column displaying HTTP protocol for every request. You can use this column to sort all request by protocol and e.g. see only https requests. The column isn’t displayed by default, you need to right-click on the header and customize…

Quickly Remove Elements from the page

The well known Inspector feature allows quick removal of selected elements from the page. Just inspect an element and press Delete key to remove the currently highlighted element on the page.


Function objects: displayName property

Firebug also supports a displayName function object property. You can use this property to specify custom function name for anonymous functions. Firebug is consequently using that property to display stack traces.


Every Console log has its origin info

This is just simple new feature. Every log displayed in the Console has it’s origin (file url and line number). Of course, Firebug shows the source as soon as you click on the origin link.

Resend HTTP request

The net panel allows to resend an existing HTTP request. Just right-click on it and pick Resend from the context menu. Nice and easy!


Tooltip for conditional breakpoints

The Script panel is displaying tooltips for conditional breakpoints. You don’t have to open the condition editor to just see the current condition.


Add Watch from the DOM panel

The DOM panel context menu introduces a new Add Watch command. This allows the developer to find specific object or field (can be several layers deep in the structure) and put it directly into the Script panel’s Watch window for further inspection and monitoring.


Response Headers from the browser cache

The Net panel is displaying even HTTP headers coming from the browser cache. Just expand an HTTP request and check the Headers tab, there is a new section at the bottom (in case the response comes from the cache).


Font Viewer

Firebug introduces a font viewer (for *.woff files) integrated into the Net panel. If your page is loading such file you can expand appropriate request and see all meta data about the downloaded font. Very cool!


Font Tooltip

There is yet another neat support for designers. If you move mouse cursor over a font in the CSS panel (or in the Style side panel) you’ll see a tooltip with a font preview.


Tooltip tip for array items

Another nifty improvement is related to debugging and inspecting an array value using tooltips. If you move mouse cursor over array brackets, you can see the actual value, see the screenshot.

Stay Tuned!

Honza

Posted by on at

44 comments

Comments are now closed.

  1. Yamcsha wrote on January 6th, 2012 at 12:38 pm:

    cool, many thanks

  2. axlotl wrote on January 6th, 2012 at 1:10 pm:

    The link at the top is to 1.8.4. Here is the correct link: https://getfirebug.com/downloads/

    1. Jan Odvarko wrote on January 7th, 2012 at 12:52 am:

      The AMO page should already offer Firebug 1.9.0 (but the change can take some time to go through caches).

      Honza

  3. Raghav Khunger wrote on January 6th, 2012 at 1:32 pm:

    Cool! Getting better and better.

  4. Fatih wrote on January 6th, 2012 at 2:18 pm:

    Lots of nice feature, some of them is really useful. Thanks for the update. But you’d better to work for making the current version more stable . Firebug 1.8 always crashs in different ways and sometimes it becomes really painful to work with this.

  5. Zdeněk Štěpánek wrote on January 6th, 2012 at 4:27 pm:

    Thank you for a new version. I am going to download it right now. Díky Honzo!

  6. Rudy wrote on January 6th, 2012 at 4:27 pm:

    wow super :D

    many thanks

  7. Skoua wrote on January 6th, 2012 at 8:03 pm:

    Some very nice improvements, thanks!

  8. Style Thing wrote on January 7th, 2012 at 1:47 am:

    Thanks, very neat improvements indeed

  9. pd wrote on January 7th, 2012 at 6:39 am:

    Great work all involved. Unfortunately it’s depressing not to see a fix for Firebug’s zombie compartment problem.

  10. Dan wrote on January 7th, 2012 at 7:49 am:

    quick delete of elements is a nice addition. I’d like to see a trim function that deletes all but the selected element(s)

    1. Jan Odvarko wrote on January 7th, 2012 at 7:56 am:

      Please create a new enhancement report here: http://code.google.com/p/fbug/issues/list + detailed description of how the feature should work from the user perspective and we’ll take a look at it!

      Honza

  11. Fadi El-Eter wrote on January 7th, 2012 at 10:15 pm:

    Am I the only one who had problems on Firefox ever since I installed firebug? I even uninstalled Firefox but ever since the install Firefox is getting allocated 1 GB of memory and its CPU usage is around 50%.

    1. Jan ‘Honza’ Odvarko wrote on January 8th, 2012 at 9:59 am:

      Please start a new thread here: https://groups.google.com/forum/#!forum/firebug – so, we can discuss the problem further.

      Memory & performance are our top priorities so, if we could put together a solid tests scenario that would be great help!

      Honza

  12. Jason wrote on January 7th, 2012 at 10:56 pm:

    Very nice work Firebug team. Thank you so much for all that you do!

  13. AndersH wrote on January 8th, 2012 at 9:39 am:

    Is it shown in the net panel, if a connection is using SPDY or not?

  14. Ivan Malopinsky wrote on January 8th, 2012 at 9:54 am:

    Great release. Docking and syntax error position are awesome additions.

  15. Hugh Madison wrote on January 8th, 2012 at 10:37 pm:

    Great release, thanks to all involved people for their hard work

  16. cavo789 wrote on January 9th, 2012 at 2:25 am:

    Thanks a lot. Firebug is a wonderful tool

  17. Aamir Afridi wrote on January 9th, 2012 at 3:56 am:

    Love new features, specially ‘Syntax error position displayed’

  18. Julio Silveira Melo wrote on January 9th, 2012 at 5:19 am:

    Syntax error position displayed is very cool!

  19. juan pablo wrote on January 9th, 2012 at 5:35 am:

    firebug is the best.

  20. SiPlus wrote on January 10th, 2012 at 5:52 am:

    Awesome! Any way to use it for XULRunner debugging?

    1. Jan ‘Honza’ Odvarko wrote on January 10th, 2012 at 5:58 am:

      Not at the moment

      Honza

  21. SiPlus wrote on January 10th, 2012 at 5:55 am:

    Could you add an ability to disable computed styles in Style panel?

    1. Jan ‘Honza’ Odvarko wrote on January 10th, 2012 at 5:59 am:

      Why it should be disabled? Are you experiencing some performance penalties?

      Honza

  22. Spudley wrote on January 11th, 2012 at 5:44 am:

    The font tooltip is a helpful addition.

    Even better would be if Firebug could tell you which of the fonts in the list is actually being used.

    eg where it shows

    font: 10px/1.4 Helvetica,”Helvetica Neue”,Arial,sans-serif;

    it could highlight “Helvetica Neue”. This will help pick up issues where a font isn’t loaded correctly (either because of a typo in the css or fonts not being installed as expected, or whatever).

    Thank you!

    1. Jan ‘Honza’ Odvarko wrote on January 11th, 2012 at 6:47 am:

      Try FireFontFamily (Firebug extension) http://getfirebug.com/wiki/index.php/Firebug_Extensions#FireFontFamily (see also the screenshot showing how the font being used is highlighted)

      Honza

  23. Etienne Pouvreau wrote on January 12th, 2012 at 3:56 am:

    Yes… but FireFontFamily seems to disabled the font tooltip

    1. Jan ‘Honza’ Odvarko wrote on January 12th, 2012 at 4:41 am:

      I see, please create a new report here: http://code.google.com/p/fbug/issues/list

  24. J wrote on January 13th, 2012 at 8:52 am:

    I have updated to 1.9 but my script panel shows only json info no script to debug any ideas of what I’m doing wrong???, thanks for your great PRODUCT!!!!

    1. Jan Odvarko wrote on January 13th, 2012 at 9:09 am:

      Try to disable other extensions (if you have any) or create a new Firefox profile. If the problem persist, please open a new discussion thread on Firebug newsgroup and we can solve it there: https://groups.google.com/forum/#!forum/firebug

      Honza

  25. Dmitry wrote on January 17th, 2012 at 3:38 am:

    Wow, thanks guys! firebud is getting better with every version

  26. kenjiru wrote on January 30th, 2012 at 3:00 am:

    This looks awesome! Thank you very much for your work!

  27. melchior blausand wrote on February 15th, 2012 at 3:23 am:

    Love all the improvements!
    When Firefox’ update told me that Firebug would be disabled, the built-in update-button had still nothing but 1.8.4! Was a little irritated.
    Just to point it out – Firebug should enter the AMO repository more quick IMHO.

    1. Jan ‘Honza’ Odvarko wrote on February 15th, 2012 at 4:23 am:

      > built-in update-button had still nothing but 1.8.4!
      Thanks for pointing this out, should be fixed by now.
      Honza

  28. vafa wrote on February 28th, 2012 at 8:21 am:

    Hello dear friend.
    When I first noticed your add-on, I was amazed. but after reloading my website, everything turned back. there were some other add-on like CssUpdate which could be used to update the server by Firebug changes. But they were not free and supported limited Css.
    Please include a condition for permanent changes. This is so important.
    Thanks

    1. Jan ‘Honza’ Odvarko wrote on February 29th, 2012 at 7:49 am:

      > Please include a condition for permanent changes.
      Use Firebug issue list: code.google.com/p/fbug/issues/list to make requests for enhancements. It could easily get lost here. Thanks!

      Honza

  29. Shiv Tomar wrote on March 31st, 2012 at 4:23 am:

    Very much needed enhancements. Good.

  30. Aghil wrote on May 17th, 2012 at 1:57 am:

    Hi,
    Is there any way to edit the http request and resend in firebug ?
    If there is, help me to know about it or else inform me the reason why firebug haven’t implement that. Thanks.

    1. Jan ‘Honza’ Odvarko wrote on May 18th, 2012 at 3:33 am:

      @Aghil: You can resend a request by right-clicking on a request entry in the Net panel and executing “Resend” action.

      Editing of the request is not supported. I recall that one of Firebug contributors was interested in providing such feature but, it never happened. This feature is currently not in our roadmap, but if you’d be interested to implement it I am ready to assist you!

      Honza

      1. Aghil wrote on May 18th, 2012 at 6:08 am:

        Thanks for your reply, Honza.

        I’ll try by best to implement that but i need you to assist me.

        Aghil.

        1. Jan ‘Honza’ Odvarko wrote on May 18th, 2012 at 6:18 am:

          Sure, let’s start with an issue report. Please create one here:
          http://code.google.com/p/fbug/issues/list
          and provide a description of how the feature should work from the user perspective. We can continue discussion under the issue report

          Honza

  31. Yoganshi wrote on May 17th, 2012 at 4:42 pm:

    You make our life so much easier!! Thank you for all the hard work!!

Comments are closed for this article.