Atlas offers a small, but handy, set of debugging primitives. As ScottGu mentioned, you can use FireBug (Firefox) or Nikhil’s WebDevHelper add-in for tracing. If I understand it correctly from reading the code, you can also declare a <textarea> element with id='TraceConsole', and it will receive debug output as well.
In Web Development Helper go to the Script menu, check Enable Script Debugging and click Show Script Console (screen shot).
In Firefox, simply click the FireBug icon in the lower right corner to bring up the console (screen shot).
In Opera… you’re out of luck, unless you want to augment Microsoft’s source code a little. More about it later.
assert (condition, message, displayCaller)
What language doesn’t offer an assert? Pass in an expression to evaluate, a message to display in case the expression evaluates to false and, optionally, display the caller context:
debug.assert (1 == 2, 'A silly assert', false);
If you enable script debugging in Internet Explorer (uncheck Tools | Internet Options… | Disable Script Debugging), you’ll get a prompt to fire up your debugger of choice (Visual Studio, for example).
fail (message)
Outputs the message parameter to the debug console. In fact, assert() calls fail() if its condition evaluates to false. The net effect of calling fail() is almost the same as putting the debugger keyword in your script.
trace (text)
Outputs a one-liner into the the debug console and your custom trace box (<textarea id="TraceConsole" rows="..." cols="..."></textarea>).
traceDump (object, name)
With a bit of reflection on steroids (all paid for by Atlas), you get to dump into the console the structure of an arbitrary object with all its properties. The whole nine yards.
For example, to see the dimensions and position of <div id='foobar'></div>:
debug.traceDump (
Sys.UI.DomElement.getBounds ($get ('foobar')), 'DIV properties:');
and you get something like this:
DIV properties: {Object}
x: 8
y: 21
width: 1264
height: 114
I noticed one gotcha: Firefox and Opera, depending on the object, may go on, and on, and on “reflecting” on the object. It takes long enough to go get a croissant. From France.
Accommodating Opera
For starters, Opera’s debugging capabilities suck. Still, you can dive into the Sys$_Debug$_appendConsole() function and add the following code to have debug messages written to the console (screen shot), found under Tools | Advanced | Error console:
else if (opera.postError) {
opera.postError (text);
}
Conclusion
What still confuses me is that some debug messages are written to the console, but not your custom trace box, so I figured it’s better to forget about the <textarea> trace box and rely on the console instead.
