To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Lately in my day job I've been troubleshooting ASP.NET pages that use server controls that lean heavily on Javascript.  The kind of Javascript that is stripped and streamlined with zero whitespace or carriage returns.  So to make any sense of it at all I needed a beautifier:

function layoutmouseup() {if ((moving != 0) && (target != 0)) {rearrange(moving, movingcol, target, targetcol);var targ = target;if (movingcol == targetcol && target > moving) {targ = targ - 1;}displaylayout();}moving = 0;movingcol = 0;target = 0;targetcol = 0;}
function layoutmouseup()
{
	if ((moving != 0) && (target != 0))
	{
		rearrange(moving, movingcol...
		var targ = target;
		if (movingcol == targetcol ...
		{
			targ = targ - 1;
		}
		displaylayout();
	}
moving = 0; movingcol = 0; target = 0; targetcol = 0; }
 

After Googling for “javascript beautifier free” I came up with only payware solutions that have more features than I wanted.  I just want a simple way to put crappy Javascript in, and get back stuff that looks reminiscent to the C# I write in Visual Studio.  So I took a half hour and wrote a free beautifier:

http://couponmeister.com/beautify.aspx

Source code is available from the link if you'd like to extend it.  Will work with Java, C++, and C# as well.

Enjoy!

UPDATE: A more recent post about the beautifier is available here.


Feedback

# Thanks !

Great job, and really useful to me today ! :) 3/27/2006 8:39 PM | Xavier

# Thank you VERY much !

I had to debug a one-line file (3000 caracters). This has been VERY useful. Thanks ! 4/17/2006 8:41 AM | Didier

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Looks good but it's not currently capturing for-loops, for example:

for(j=1;j<2;j++){doSomething(i);}

At the moment it's splitting the for-loop declaration into several lines due to the semi-colons. 5/15/2006 12:06 AM | Alex

# Gracias!

Thanks for the link, it's been very useful. 7/10/2006 10:30 AM | ernesto

# A few bugs are now fixed

Alex -- Good call on the for() loop issue. I have just fixed that. Also an issue with single vs double quotes around strings. So it's much more reliable now. Plus I converted to using StringBuilder instead of simple string concatenation, and large blocks of script now parse much more quickly.

This will always remain 100% free and open-source. Please tell your friends or blog about it. 7/17/2006 7:21 AM | Lorin

# Also handles obfuscation

One more thing I forgot to mention -- the routine now handles escaped characters that are represented in hexadecimal or octal. So some of the gnarlier obfuscated strings can be made more readable. You're stuck with the crazy variable names though. To clean those up you would have to have a pretty smart parser that knows the scope of variables and can rename them in just the right places.
7/17/2006 8:55 AM | Lorin

# translated to JavaScript/PSPad

I wanted to use the beautifier in the PSPad editor, so I translated the cs-code to JavaScript:

http://triess.de/download/format.zip
7/17/2006 11:49 AM | Stefan Triess

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Link broken :-( 8/15/2006 12:54 PM | Pete

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

it doesn't handle comments 9/16/2006 3:16 PM | andy

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Great stuff, thx a million mate! 11/28/2006 10:44 AM | Hamayoun

# Thank you!!

It is a great tool to form the code!! 12/30/2006 1:10 AM | Jan

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Thanks so much - This is just what I needed! 1/23/2007 9:40 PM | SquadraCorse

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Code like this
// A line with comment
setTimeout('bbb()',100);
setTimeout("cccc(0)", 100);

becomes:
// A line with comment setTimeout('bbb()',100); setTimeout("cccc(0)", 100);
6/15/2007 6:53 AM | Desislav Kamenov

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

where's the source code??? i need your help plz 7/19/2007 11:00 AM | Jore

# Crashes on AdSense

This code gives a "Index was outside the bounds of the array" error.

http://pagead2.googlesyndication.com/pagead/show_ads.js
10/16/2007 9:38 AM | David Phillips

# re: To satisfy your reverse-engineering cravings: a free online Javascript beautifier

Greate job!
But the source code can't download!
Can please check out the link:
http://hdvforever.com/blog/beautifier.zip 1/20/2008 12:12 AM | Jim

# Got an exception with code menu.js

[IndexOutOfRangeException: Index was outside the bounds of the array.]
System.Text.StringBuilder.get_Chars(Int32 index) +20
beautifier.beautify.endsWith(StringBuilder dst, String check)
beautifier.beautify.doBeautify_Click(Object sender, EventArgs e)
System.Web.UI.WebControls.Button.OnClick(EventArgs e) +108
System.Web.UI.WebControls.Button.System.Web.UI.IPostBackEventHandler.RaisePostBackEvent(String eventArgument) +57
System.Web.UI.Page.RaisePostBackEvent(IPostBackEventHandler sourceControl, String eventArgument) +18
System.Web.UI.Page.RaisePostBackEvent(NameValueCollection postData) +33
System.Web.UI.Page.ProcessRequestMain() +1292 3/26/2008 9:07 AM | Rayshi02

Post a comment





 

Please add 4 and 2 and type the answer here:

News


Welcome to my blog.
Here's what we've got on the menu today:

Tag Cloud


Article Categories

Archives

Post Categories

Image Galleries

Syndication: