CodeBetter.Com
CodeBetter.Com
RSS 2.0 via Feedburner
           Do you Twitter? Follow us @CodeBetter

Jay Kimble -- The Dev Theologian

Philosophizing about the .Net religion

JavaScript API's and Debugging

As stated a few posts back, I spent some time looking at other Ajax frameworks. I really have become fascinated with the JavaScipt APIs. I know it's cool to not have to do JavaScript (JS, hereafter), but enabling a good JS API within a framework like ASP.NET or in Java's JSP/Servlet Architecture is really not that hard.

As I said, I'm fascinated with the libraries (I'm not always thrilled with where things are going)... As I have repeatedly stated I'm not so sure what I think of the Ajax/Web 2.0's improved GUI features (I think it's asking for trouble).

That said, one of the biggest pain points for me with JS is that traditionally you did 1 of 2 things while debugging.

1) Put alert calls all through your code to notify you of the values of your clientscript values
2) Create a Div and push data to the Div.

The latter being a bit of a pain to set up because you can't just use it. The latter choice is actually the better choice when throwing an alert up screws up your code.

With the emergence of tools like Mozilla's FireBug, this is getting easier, but it's still sometimes a pain.

Anyway, as I was digging around in the MS Ajax ClientScript API, I discovered the very cool Sys.Debug class. This basically lets me write trace information as well as dump for objects to JSON-like strings (using Sys.Debug.traceDump)) so I can see the values. These messages will show up in Visual Studio if you are debugging with IE; In Mozilla and Safari, this information gets written directly to the Debug console. They also let you create a textarea named "TraceConsole" which will display on the screen these messages (so it's not limited to debugging in only Mozilla and Safari).

Sys.Debug also has includes assertion statements which is nice.

Anyway, since I was discovering this nice facility I started to wonder if other JS frameworks have anything like this (the trace functionality... not the assert functionality).

I won't single out any particular framework (OK, I will single out 1), but will give you the list of JS Frameworks that I found that have some kind of debugging facilities.

The good
  • Ms Ajax (but you knew that)
  • Yahoo's YUI library has a complete logging facility and while I didn't find an equivalent of traceDump (but I'm sure it has a function for convert object to JSON string), the logging facility is much more sophisticated then what is in MS Ajax.
  • dojo has functionality almost identical to that found in MS Ajax (I know people will accuse MS from stealing from the dojo guys now. dojo goes a little further then traceDump... dojo has 2 levels of object dumping: shallow and deep.
  • MochiKit has logging facility like YUI's.

Honorable Mentions
  • Cross-Browser.com's X Library has some facilities that are more dynamic in nature in that they let you modify the running document as well as drop in debug console's within your code.
  • The Script.aculo.us addon to Prototype.js contains some unit testing classes.
Final Thoughts

The one most notably missing to me is Prototype.js. I feel that I have to point this out as it seems crazy to me that Prototype of all libraries should have some sort of support for this (at least for writing to the debug console). I'm in shock that it doesn't.

As far as other frameworks, if I missed yours I'm sorry. If yours doesn't have any kind of debugging facility be happy I didn't point it out and add debugging support... I've come to the conclusion that I won't be using a JS library that doesn't have it (it makes life way to convenient when you are trying to debug something).

[this post brought to you by the nice folks at www.blogdesk.org... I needed a new editor and this just might be in (well, if this posts ok)]

Technorati Tags: , , , , , , , ,



Check out Devlicio.us!

This Blog

Syndication

News

CodeBetter.Com Home
Current Threat level
Terror Alert Level