Updated because I got tired of the crap I was getting for venting.
It might be a big, uncommon statement, but you’re right. These issues affect developers right now when they need to work, and the unpredictability of these bugs is far more serious than “oh no, IE6 is doubling my margins again!”.
I don’t use Firefox/Firebug but I have been having issues with Web Inspector in Chrome. Like you I rely on it for development but these bugs really slow me down. At the moment there are three bugs causing me grief:
1. When using the arrow keys to increment a margin, padding or other numerical value, Web Inspector will randomly remove styles from the selector you are interacting with. Backgrounds, positioning, all gone. Only returns with a refresh.
2. Can’t add background images. Seriously, you enter the URL in any valid format you can think of but it just disappears as soon as you commit the change. There is a workaround of adding it as an inline style, but still a pain.
3. The styles pane will randomly show nothing. No styles at all, just the heading. Only way to make them come back is to close Web Inspector and re-open.
I’ve seen most of these bugs myself. Many times, I’ve closed Firefox to get rid of these weird problems. That means, you have set the breakpoints again :(
I still couldn’t think of my life without FireBug
Have you tried Opera Dragonfly? It generally sucks, but maybe it’ll annoy you less :)
eh small price to pay for an amazing and … yep. Free tool! Yes firebug, if you guys are going to be main stream, get it together. But again. amazing free tool. Get over it!
I would not dare to say that firebug sucks but there you did it! I hope this get picked up by the developers of firebug because when these issues get fixed, your oppinion will probably change back to good :)
yip! those are bugs.. and they’re annoying. But to say it sucks more than ie6 is confusing.
One is a tool we can use to develop with, the other is a platform we must develop for. My point being. I can drop Firebug if it hinders more than it helps, this is not the case with a browser.
FB errors are truly annoying, I agree. But as long as no one reports them to the FB developers, they don’t get fixed.
One advantage of Firebug over IE is the open development process. Could you add the bugs to the Firebug issue list? (http://code.google.com/p/fbug/issues/list) Then they stand a chance of getting fixed :-)
Ive used firebug alot in the passed, but i noticed firefox got slower and slower, so ive switched to opera. they have the build-in dragonfly (which is basicly exactly tyhe same) IMO it works a bit better but it also has its cons (ex. on a refresh of the page with dragonfly open ajax doesnt get executed until dragonfly is closed)
Maybe try opera? or chrome (which has also a built in developer tool, never used it tough)
Firebug is open source. So if you rely on Firebug and find minefields inside, just get involved http://getfirebug.com/getinvolved At least fill in bugs http://code.google.com/p/fbug/issues/list you found out
Firefox is a moving target. Firebug is a moving target. FireQuery is a moving target. Plus all your random plugins you have installed which do patch Firebug internals are moving targets.
Under these circumstances, it is a miracle you see only few bugs like that ;)
The best bet for you is to downgrade Firefox to some stable release like 3.5 and install exactly the version of Firebug which got shipped around that date. Do not auto-update Firefox or Firebug since then. Do not install any other Firebug plugins.
I’m the author of FireQuery, FireRainbow and some other Firebug’s so called “plugins”.
I agree with the boring IE6 bashing people seem to get off on but I don’t understand the comparison between two completely different pieces of kit. Yes, IE6 has bugs we all *should* know how to deal with by now, but one is a web browser, one is an ever-evolving web development tool. It would have been easier to say “I hate Firebug”.
First example works for me, both on Linux and Windows. Perhaps its a Mac issue.
In the console, sometimes $ will return as undefined, until I’ve entered $ = jQuery. And in the HTML panel, it generally fails to updated the “checked/unchecked” state of checkboxes and radio buttons.
$ = jQuery
Seeing “console is not defined” written in the console always makes me laugh/swear.
I’ve also gotten a similar “empty object when it’s not empty” bug in the past, I think when creating an object to store functions that used “this”. If I changed it to an array that stored the functions then console showed it as an array of functions.
I agree that firebug is at a low ebb at the moment – a year ago hearing anybody yelling at firebug was unthinkable, but now it’s a regular occurence at work – but it’s still indispensible and pretty good all round.
I’m telling you, Google Chrome’s debugging environment is THE BEST hands down. And, for the most part, if you get it right in Chrome, 99% of the time, it’ll work exactly the same in FF, so I’ve ditched FF for development in favor of Chrome.
I have the same love/hate relationship. Some of my ‘favorites’ are:
1. Typing a multi-line statement in the console, and then switching back to single-line console keeps the last multi-line statement in the console as the default until browser restart.
2. Using firebug’s search, often seems to put the FB UI into some infinite loop.
The bug that pisses me off the most is randomly when I edit the style of an element, it doesn’t apply the styles, then when I blur from the style editor, the selector disappears and just leaves the block.
Styles not updating? WTF? Blur:
*Restarts firefox for the 20th time today.
You have Mac, why use Safari and use the Build-in Web inspector? Haven’t touched anything else since I found this link: http://www.macosxhints.com/article.php?story=2007061303320554 Works miracles. After testing it in Safari you get the usual changes for the other browsers but nothing new there.
As someone who lives in Firebug every day, I love it. I remember the exact project I was working on when I discovered Firebug, and how much easier it made to debug issues. It gave me more of a productivity boost than any other software I can remember. So, past and current Firebug developers, if you’re reading this: you’re awesome. Just a few minor issues on the docket — get those knocked out and you’ll be awesome + 1.
Also, an IE6 to Firebug comparison just feels wrong. We don’t have to convince anyone to upgrade to a new version of Firebug when it comes out to fix the bugs you’ve listed. It’s your own software on your own machine.
using Firebug on Linux (fedora (x86 & amd64) Ubuntu (amd64)) and on Windows (XP)
I’m not able to reproduce issues you are showing (video), I don’t say you are faking it, I’m sure they are real for you, but thankfully I don’t have them.
I haven’t checked all the versions though, (I should have) but currently (writing this reply) On a Linux Fedora (x86) Firefox 3.5.9 Firebug 1.5.3 doesn’t show the problems.
I agree with your comments as well but, do you even remember what it was like to develop a website without it? Sure it has it’s quirks… No software is perfect! Re-factoring code is a necessary part of development and quality assurance is as well so, in short, as many others have mentioned above, let’s get involved http://getfirebug.com/getinvolved.
I agree that Firebug is flaky at times. However, one big difference between Firebug and IE (any version) is that Firebug is open source. You can view the code, edit it, improve it, submit patches — help make it what you want it to be. You can’t do that with IE.
+1 for not being reproducible on my Mac or Linux boxes. Up to date Firefox on both. I’m wondering if it’s part of a Firefox profile problem or plugin conflict. Have you tried running a new profile of Firefox with just Firebug and trying it again?
So I feel I should reply to some of the comments left today:
For anyone thinking that this is what we get for a free tool: no. This isn’t. We as web authors can make these things better. Enough people bitched about IE6 that eventually, at MIX10 – Microsoft opened with “we need to get people off IE6″. We can change our situation and make it better. And as I’ve said I will get involved and I hope that everyone else who hits issues will also get involved, open the code, fix and help make it the best tool available again.
To the people recommending Safari or Chrome’s Web Inspector, I’ve got a few points.
1. The CSS view/interface on the right side is a mess. It’s not nearly as clean as Firebug’s.
2. Plugins. I don’t see any possible way to add plugins to their inspector view like you can with Firefox. If there were, this would be a huge selling point. I could get over the CSS view being a complete mess if Chrome/Safari/Webkit had a better plugin system that wasn’t just embedding scripts in every page you load up.
I’m a professional Web Designer / Developer, and firebug has become one of my indispensable working tools. It saves me zillions of time to inspect CSS in highly parented mockups.
> If you raise the bar, you’ve got a reputation to maintain, and dropping below par isn’t acceptable.
You’ve mixed your metaphors. When you raise the bar you need to stay above the bar. This is a high jump / pole vault analogy. Par, on the other hand, is from golf, and the idea in golf is to stay below par.
In my firebug, all script is repeated 3 times. First time I encounter this, I’m suprised and re-check my file. My file is fine, but when I see it in script tab, the content of the files is repeated exactly 3 times, in all files.
Second, well, firebug say it’s a feature but to me it’s a bug. Net tab should be open while loading the page in order to see all resources. Web Inspector in Google Chrome can do this better than firebug, since it doesn’t need to be open while the page load.
I’m agree with you, firebug is suck. It have become what IE6 was back then, a de-facto tools with no rival. Without competition, the application will become worse and buggy, Microsoft products is the live prove of it.
Has anyone else noticed that after one of the recent Pixel Perfect releases, you are no longer able to move the layover around via the keyboard arrows?
I don’t know whether this is a Firebug issue or a Pixel Perfect issue, but you now have to drag the image around and then click on the Pixel Perfect arrows in order to mock up your pixel perfect comp.
Now, if you’ll pardon me, I’m going to step down off my soapbox and contact the developer to see if they know about this issue, instead of just blabbing on the interwebs and complaining about it to my colleagues.
I’ve had firebug stopped reporting any of the console output generated by console.log number of times, usually happens after a browser is open for a couple of days though.
As well, some errors are just not caught. Code just stops working but I can’t see some of the errors. Like when you miss putting semi-colons.
Nice post thanks for putting it out there.
Surely a difference in style, but when I was bothered by bugs in Firebug:
1. Go to the google group/forum. There is a link to it right inside Firebug.
2. Firebug wiki: describes how to create a new profile since other extensions can break stuff there and Firebug is in the same environment.
3. Create an issue in the bug database. There is a link to it right inside Firebug. Selecting that menu item is surely easier than installing firebug was. Creating a repeatable test case is not so easy however. ;)
5. Write blog post about bug and fix. Not so sensational as doing this list in reverse order.
I also found that more attention would be paid to the bugs I filed but didn’t know how to fix if I fixed others that the other devs didn’t have time for. Win-win! I focused my efforts on the HTML panel. You seem to say that it is solid, so thanks. Maybe someone in the future will say the same thing about the console (hampered by some Firefox platform bugs, btw) because of your efforts. But I’ve seen tweets and blog posts from people that say they are forced to get involved (like me!) but start a new profile, things work well enough and they can’t be bothered. Time will tell.
Now that I’m done ranting, I’d create a new profile for development. I think people are are crazy if they don’t.
Follow my linktrail
Unless otherwise stated, all articles on this blog are released under a
Creative Commons Attribution-Noncommercial-Share Alike 2.0 UK: England & Wales License
All content by Remy Sharp and under creative commons and code under MIT license.