So, having gotten tired of using alert() functions I looked at other solutions. Sure there is the Venkman Debugger for Firefox, but for most of the projects I work on, Venkman just seems to be a little bit of overkill. You can also use the debug method that can be used to output debug info to a console window, but that method seemed to be a little clumsy.
Enter my jsTrace Greasemonkey userscript.
The userscript is very simple to use. When you would like to trace a value to the trace window, simply assign a value into a variable named t and the value of t will be traced to the trace window. For example:
var name = "Jim"; t = "The value of name is : " + name;
Why did I choose the variable t? Well it’s short and I never use t in my code.
The trace window is not actually a window but rather a div container that is appended to the active document whenever a value is assigned into the variable t. The window can be moved by dragging the title bar, and can be closed by doubleclicking on the title bar.
Now the advantage of using a Greasemonkey Userscript for tracing debug information is that the debug information will only be displayed on the specified domains (file:/// and http://localhost/ by default) and only on your browser. If you forget to remove the trace statements from your script, your end users will not notice any negative effects. As the userscript can be targetted to specific domains, any page that exists under that domain will automatically have access to trace userscript, without you having to include any specific code to enable it.
Instructions for installing a userscript:
- First, you need to install the Greasemonkey Firefox Extension.
Now click on the Firefox *Tools menu and click on the option that says Install This User Script.
This is my first ever userscript and it is certainly probably far from perfect. If you have any comments, suggestions or feature requests, please post a comment, and I will do my best to add them to the script.