New Features of Firefox Developer Tools: Episode 25 | Hacker News Reader

New Features of Firefox Developer Tools: Episode 25

hacks.mozilla.org

132 pointsblueveek25 comments

The blackbox support seems like a killer feature. No more debugging minified JQuery! I also can't believe that CSS auto-complete wasn't there before.

I've been using Aurora for the last few months and have loved the experience. It's stable and I get to early access to great new tools. I highly recommend it for any developer looking to use the latest and greatest.

For me the killer feature are these: http://paulrouget.com/e/devtoolsnext/

Though that CSS auto-complete is sweet as hell.

Oh man! Blackboxing is definitely a killer feature!

Also been using Aurora for the past few months and I like it a lot. Better then Firebug on most tasks (not all yet) and less resource heavy and less buggy.

CSS auto completion is really good addition.

Next thing to hope for is improved profiling tools. Still the best profiling tools are in IE. Even IE8 is better than Firebug.

IE11 Memory profiling is really sweet.

As a front end dev the only thing still keeping me with Safari/Chrome is the visual highlighting of paddings and margins when selecting or mousing over things in the Inspector (as opposed to the dotted border Firefox provides).

This is simply invaluable to quickly get to the bottom of layout issues. It's really unfortunate that they haven't built this in yet, Firebug slows down Firefox for me to the point of being unusable (switching tabs takes 5-10 seconds) so I'm stuck having either Safari or Chrome open together with Firefox just for that 1 thing.

We are working on that. We also plan on adding multi-highlight for when e.g. you are in a selector in the style editor and a bunch of other goodies.

Great work :) I also miss that feature. It's been good to see the steady work on the developer tools.

I still spend the majority of my time in firebug/chrome/ie8/safari though... but it seems the time will come soon when I will switch.

The combination of being able to freely modify network requests before resending them and being able to execute javascript exactly where you want it seems perfect for debugging other people's websites with less friction. Or figuring out exploits, depending on your point of view. The former is going to save me a lot of pain - I've been running Aurora for a year or two now and it's been good to me, but I've slacked on following new features.

Having the console finally work correctly in debugging sessions (execute in the current stack frame) is going to be great.

I'm currently using Firefox for browsing and Chrome for debugging, just for this feature. Now I can go back to one browser, a more sensible workflow.

This is actually in the latest stable Firefox release already (Firefox 23).

Gotta say, I'm finally now more comfortable using Firefox's Dev Tools rather than Firebug...mainly because Firebug has become a slow piece of crap and FF's now runs at more or less with the speed of Chrome's tools.

Only a few minutes ago I was wondering why the variable value was undefined when I paused the execution in js. Now I found out why. I am actually surprised it was not there before. There are still 12 weeks for this to become stable. Black box seems really neat too.

This should actually already work if you are on Firefox 23. Please file a bug if it doesn't.

Wow, lots of great features. The progress on these tools lately is awesome. One little feature I'd _really_ like to see is F12 as a keyboard shortcut to open the dev tools, I'd like that consistency with Chrome & IE.

Can you wait till the next uplift? If not, hop on Nightly ;)

https://bugzilla.mozilla.org/show_bug.cgi?id=878412

Very cool :) Thanks for letting me know!

When I hover a variable in the debugger, is the value displayed now? This missing feature is the main reason I use Chrome instead of Firefox.

We have a bunch of Object Inspector requests and we will get onto them when we get chance: https://bugzilla.mozilla.org/buglist.cgi?component=Developer...

Edit as HTML would be nice.

So you can right click on the body or a table and edit the html in the inspector.

Yes, we also have plans for HTML editing that I think everybody will be very pleased with.

Thanks to the dev tools team - these are some solid enhancements. Nice work!

How one does search(CTRL+F) in DOM in Developer tools? Either I could not find such a feature or it is very well hidden?

Open Inspector, there is a search field in upper right corner of the page source pane.

At least in Firefox Aurora 25 there's a small search icon to the right in the inspector. But its search functionality seems buggy...

Edit: It only shows searches as a CSS expression, and it doesn't show the results in the DOM view, only by highlighting individual results on the page (like inspecting that element)

The ability to use the console in the current frame is also one of the killer features imo. Nice work Mozilla.

Reply on news.ycombinator.com