Hacker News new | ask | show | jobs
by pcx 2388 days ago
Great to see Mozilla consistently improving devtools in Firefox. I have been using them over Chrome for a while now, hope it gets to a place where most devs start using FF again for debugging web apps.
5 comments

The CSS Changes page is a godsend. When editing CSS live it collects all the changes you've made so you can then go back and apply them in your codebase without having to hunt for them in the page elements.
I agree, devtools are getting better. By the way , I recommmend developpers to use the developper edition https://www.mozilla.org/fr/firefox/developer/
Here's a generic link that should direct you to the page based on language (rather than the French or en-US one):

http://www.mozilla.org/firefox/developer/

What is the difference? I just thought it was basically a dark theme.
They have some experimental features enabled there which they don't in other channels.

For example, I'm running Nightly, and the Dev Tools>What's New tab says the "Debug Variables with Watchpoints" (break when a property is read/written) feature is in Developer Edition (and presumably not in Nightly or the Release channel).

It is somewhat newer than mainstream, does not require to enter "yes I'm sure" when opening the dev console and has actually a beta qualifier as version number. I haven't run into any stability issues though.
I've been using the dev build for years. Highly recommended. (about:performance)
> DevTools’ Network panel can now inspect WebSocket messages and automatically formats a variety of framework formats

Finally! This was the main reason to develop on Chrome instead of FF for me. The rest is almost comparable with Chrome DevTools for everyday web development.

For me the Grid Inspector alone makes using the FF devtools worth it.
Firefox devtools are great now! The only thing I still use Chrome for is debugging Node (which, since it's webkit based, is probably unavoidable).
How do you do that?
start node with the `--inspect` flag and then open `about:inspect` in chrome and it should show up as a debuggable target.
Run Node with `--inspect` and browse to `about: inspect`