How to debug Dojo in a browser?

I'm currently trying to develop an application using Worklight Studio 5.0.6 and Dojo (Mobile) 1.8.3. It is very difficult for me to find a suitable method for debugging. After waiting 5-10 minutes to build the deployment process on the server, the error usually looks like this in the Chrome debugger:

enter image description here

How should I track this error in MY source? The entire stack trace consists entirely of Dojo code, which generates an absolutely useless error message after 20 levels of abstraction.

Seriously, how do you guys handle this in real life? What methods do you use to debug Dojo-driven applications in the browser?

Spyro

+8
debugging dojo ibm-mobilefirst
source share
4 answers

In case of dojo.parse errors, I find it useful to suspend the Chrome debugger in all exceptions (the purple icon in the screenshot should be blue). Usually you get more information about the cause of the error, the name of the DOM node parsing, etc. In the first exception.

Raya.

+2
source share

Debugging a dojo application should be the same as debugging any javascript application.

I will usually do the following:

  • add console.log () somewhere in the code : this is fast and in most cases this is enough.

  • set a breakpoint in the debugger : if step 1 is not enough, you can rely on error information to set a breakpoint before the error line, then execute a step or exit.

  • the comment has recently changed : for some error that is difficult to find in the error line, for example, in parsing the error, a good way is to comment on recent changes one to the latest version of your latest working version. Or go back to your latest working version, then add the code back one by one.

  • Create a simple application to reproduce the error : if your application is very complicated and it is difficult for you to follow the methods described above, you can try to create a new application that mimics yours but with simple logic and try to reproduce the error.

  • Based on experience : some errors, for example, extra ',' at the end of an array that runs on chrome and firefox, will report errors in IE. Debugging such errors is very difficult, you can rely on your own experience or do a google search.

+2
source share

Have you isDebug: true in dojoConfig? Also, try to find out if this is happening in other browsers.

Update: I recently discovered that there are problems debugging Google Chrome and Dojo, and I think this is due to asynchronous file uploads. As you can see in the screenshot above by @spyro, the ReferenceError object is empty (which you may notice due to empty brackets {} ). If you want to solve this problem, open the Google Chrome console (for example, by pressing F12 twice). After reopening the ReferenceError should no longer be empty, and now you can expand this object using the arrow next to it and get a more detailed message that failed.

+2
source share

Usually what I do in such situations is to place a breakpoint inside the error callback (line 3398 in your case) and then look at the error variable ("e").

I'm not sure how familiar you are with the web inspector, but as soon as you hit the breakpoint, open the Web Inspector console and check the error properties "e.message" and "e.stack" (just enter "e.message" in the console) . Also, during development it is best to avoid optimizing / minimizing Dojo, which will greatly improve your debugging ability.

The bottom line is to try to place a breakpoint before the error is reset.

+1
source share

All Articles