Tuesday, November 11th, 2008

Firebug tricks, Dojo style

Category: Debugging, Dojo

Tom Trenka has a nice posting on Dojo and Firebug Tricks for Development where he shares two of his own:

Trick #1: using window.location.search to enable Firebug Lite on the fly

With the Dojo Toolkit, I find this trick indispensable. The basic concept is to use the original version of the djConfig variable—the object-based one—using a boolean to enable or disable debugging.

In a single line of code, here’s the trick:

javascript

  1. var djConfig = { isDebug: (window.location.search.indexOf("debug")>-1) };

Trick #2: setting up a simple HTML file that just enables the console

Once you drop in the simple HTML file below, you can bookmark it, load up your Dojo world, and then start to use Firebugs “Run” command to access Dojo-ness.

Start with this:

  1. <html>
  2.     <head>
  3.         <title>Dojo Console Testing</title>
  4.         <script type="text/javascript"
  5.                      src="dojo/dojo.js" djConfig="isDebug: true">
  6.                 </script>
  7.     </head>
  8.     <body>
  9.         <p>
  10.                      This is a quick and dirty file you can use
  11.                      to do console-based development.
  12.                 </p>
  13.     </body>
  14. </html>

And then “Run” something like this:

javascript

  1. dojo.require("dojox.xml.DomParser");
  2.  
  3. var xml='< ?xml version="1.0"?>'
  4.     + '<root><node>My first node</node>'
  5.     + '<node>My second node</node>'
  6.     + '</root>';
  7. var doc=dojox.xml.DomParser.parse(xml);
  8. console.log(doc);

What tips and tricks do you have?

Posted by Dion Almaer at 6:25 am
4 Comments

+++--
3.3 rating from 43 votes

4 Comments »

Comments feed TrackBack URI

Why not use a bookmarklet, it’s easy, and it’s work:
Just Bookmark this in firefox

javascript:var%20firebug=document.createElement(‘script’);firebug.setAttribute(‘src’,’http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js’);document.body.appendChild(firebug);(function(){if(window.pi&&window.firebug){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);

And just hit this bookmark if you need FireBug Lite

Comment by jonat — November 11, 2008

This is a really good idea, and helps when your project reaches production and is on the client server. When they approach you with the inevitable bug, you can go to their site, and add ‘debug’ to the url to help with the inspection.

Comment by AnM8tR — November 11, 2008

Jonat,

The reason a bookmarklet is not enough is that you often want to debug code that runs on page startup. With a bookmarklet you can only enable debugging after the page has finished loaded.

Toms approach turns on debugging before any code runs, so you get the debug output from both pre and post page loads.

Shane

Comment by sos — November 11, 2008

I use the bookmarklet trick, too. This is a cool trick.

Comment by Nosredna — November 11, 2008

Leave a comment

You must be logged in to post a comment.