How to beautify Javascript and CSS in Firefox / Firebug?

there is now a plugin that intercepts javascript downloads and deminifies it at that point. unfortunately, the way it hooks into firefox means that it applies to all javascript downloads and just not specific ones and the javascript files have to be served with an appropriate mime type.

https://addons.mozilla.org/en-US/firefox/addon/247565/

CSS is already beautified in Firebug, as clearly seen by comparing the CSS tab or CSS pane with the raw source.

JavaScript, alas, is not. The best you can do, for now, is to paste the code into something like http://jsbeautifier.org/ .

However, if you write a Firebug extension that does this, you will have all of our gratitude. ;-)

Firefox Developer Tools has:

• "Prettify Source" button: braces {} icon on bottom left

• "Auto Prettify Minified Sources" setting: turns Prettify Source on by default.

  To enable it: go to the engine icon on top right of the Debugger tab, not the global settings engine.

Tested on Firefox 42.