JavaScript / Dojo Module Pattern - how to debug?

I work with Dojo and use the "Module Template" as described in Mastering Dojo . As far as I can see, this template is a common and widely used JavaScript template. My question is: how do we debug our modules?

So far, I have not been able to convince Firebug to show me the source of my module. Firebug seems to show only the Dojo eval statement used to execute the factory method. Therefore, I cannot go through my module. I tried putting the "debugger" instructions in the module code, and Firebug seems to stop correctly, but does not show the source.

Thoughtful sample code below. This is just an example of enough complexity to make the need for debugging believable; it is not intended for useful code.

Page

<!--
  Experiments with Debugging
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head> 
    <title>console me</title>

    <style type="text/css">
      @import "../dojoroot/dojo/resources/dojo.css";
      @import "../dojoroot/dijit/themes/tundra/tundra.css";
      @import "edf.css";
    </style>    

    <script type="text/javascript" src="../dojoroot/dojo/dojo.js">
    </script>

    <script type="text/javascript" >
      dojo.registerModulePath("mytest", "../../mytest");

      dojo.require("mytest.example");

      dojo.addOnLoad(function(){
         mytest.example.greet();                     
      });
    </script>

  </head>
  <body class="tundra">
    <div id="bulletin">
      <p>Just Testing</p>
    </div>
  </body>
</html>
<!-- END: snip1 -->

java script I would like to debug

dojo.provide("mytest.example");
dojo.require("dijit.layout.ContentPane");

/**
 * define module
 */
(function(){
      //define the main program functions...
      var example= mytest.example;
      example.greet= function(args) {

          var bulletin = dojo.byId("bulletin");

          console.log("bulletin:" + bulletin);

          if ( bulletin) {
                var content = new dijit.layout.ContentPane({
                    id: "dummy",
                    region: "center"
                  });
                content.setContent('Greetings!');

                dojo._destroyElement(bulletin);
                dojo.place(content.domNode, dojo.body(), "first");
              console.log("greeting done");
          } else {
              console.error("no bulletin board");
          }           
      }
})(); 
+5
source share
6 answers

(Answering this myself because it seems like a common problem whose solution is unknown.)

It seems that in FireBug you can fine-tune your code with the code, provided the dojo interacts a bit. The trick is to configure dojo to enable such debugging using debugAtAllCosts

<script type="text/javascript" src="/dojoroot/dojo/dojo.js"
        djConfig="parseOnLoad: true, debugAtAllCosts: true"></script>

dojo campus debugging, , , .

+3

xhr + eval... , eval, ... Firefox, , eval eval call site, eval. Firebug , , Dojo, . Webkit . , debugger; .

, . Firebug ?

+1

, Firebug 1.7a10, , "Decompile for eval() source" (extensions.firebug.decompileEvals about: config). , , , Firebug - .

@peller, , .

, - .

1.7a10 Firebug http://code.google.com/p/fbug/issues/detail?id=4035. https://groups.google.com/d/topic/firebug/y2VR17IFHHI/discussion https://groups.google.com/d/topic/dojo-interest/nWlZdJDlic8/discussion.

+1

, dojo.require mudules NG.

<script src="dojoroot/dojo/dojo.js" type="text/javascript">

<script src="dojoroot/dojo/dojo.js.uncompressed.js" type="text/javascript">

,   undefineddojo._scopeArgs = [undefined]; , .

+1

djna debugAtAllCosts , http://dojotdg.zaffra.com/tag/dojorequire/.

, , debugAtAllCosts dojo.require, , script , xhr + eval. , dojo. , require require ( http://kennethfranqueiro.com/2010/08/dojo-required-reading/). , unit test framework. , , EntityInfo

var e1 = new EntityInfo();

dojo.addOnLoad(function() {
  var e1 = new EntityInfo();
}

@peller, FireBug 1.6.1 eval, ( eval, ).

0

, Chrome. (, - Firebug). JS - http://code.google.com/p/chromium/issues/detail?id=8742.

Firebug - , Chrome, evals, . Chrome / dojo, Firebug ).

0

All Articles