JS Beautifier as Firebug plugin

Peter Sunde

unread,

Nov 24, 2009, 3:41:09 AM11/24/09

to Firebug

Hello,

It would be great to have the js beautifier (http://jsbeautifier.org/)
available in the Script / Net panel in Firebug.

I have done the initial work of having the default behavior of
jsbeautifier.org available in a wrapper here:
http://pastebin.com/f10a017a0 ("indent with 4 spaces, preserve
newlines and detect packers" defines default behavior in this case)

Code is wrapped into beautifier = {}; avoiding crapping up the global
scope

It's as simple just calling beautifier.parse({ source: 'test =
{ hello: 'world' }', indent_size: 4, preserve_newlines: true });

Shouldn't take to much time copying the fireCookie xpi addon template
here:
https://addons.mozilla.org/en-US/firefox/downloads/latest/6683/addon-6683-latest.xpi?src=addondetail
(By Jan Odvarko)

Example implementation could be:
1) A button in "Script panel" on the side of the dropdown list (where
you select the file to view) called "Beautify" ?
2) A button in "Net panel" on all files that corresponds to mime type
application/x-javascript
3) A simple button in the main editor panel with a couple of options
to:
1) By default when response pane in "Net panel" is clicked code is
automatically beautified
2) Some other goodie magick?

I would have done this myself, but for the time beeing i don't have
the time.

So i'm just throwing this out there hoping someone will pick up on
this :)

Tatablack

unread,

Jan 4, 2010, 4:06:07 PM1/4/10

to Firebug

Hi, Peter.
I was looking for such an extension too, and found time during the
Christmas holidays to have a go at it (actually, I had to get up-to-
date with extension writing, too).
I took your "example implementation" as a list of requirements, so you
can expect similar functions/behaviours to be implemented.

It's not finished yet, though it should't take long. I'll post on the
group when it's done.

:-)

On Nov 24 2009, 9:41 am, Peter Sunde <peter.su...@gmail.com> wrote:
> Hello,
>
> It would be great to have the js beautifier (http://jsbeautifier.org/)
> available in the Script / Net panel in Firebug.
>
> I have done the initial work of having the default behavior of

> jsbeautifier.org available in a wrapper here:http://pastebin.com/f10a017a0("indent with 4 spaces, preserve

> newlines and detect packers" defines default behavior in this case)
>
> Code is wrapped into beautifier = {}; avoiding crapping up the global
> scope
>
> It's as simple just calling beautifier.parse({ source: 'test =
> { hello: 'world' }', indent_size: 4, preserve_newlines: true });
>
> Shouldn't take to much time copying the fireCookie xpi addon template

> here:https://addons.mozilla.org/en-US/firefox/downloads/latest/6683/addon-...