Tips & Tricks: debugging an offline app

by Giuseppe Lanzi on 05/30/2014

In the world of mobile apps, usability and good operation are decisive for an application: when an app doesn’t work well the first time, we’re tempted to delete it and install another one, especially since we’re spoiled for choice. It’s clear that in a context like this one apps have to be tested directly on the device and not just in the simulator. I decided to write this post to take stock of the debug tools we can use: the one in the application, Caravel’s, and the browser’s.

The debug module typical of applications made with InDe is always available, but it’s not always obvious. In fact, when the app is shown in the simulator, you can simply click on the wheel on the upper left, but there’s no button when you’re using the native shell. So what should we do? Just add a menu item that calls the DTTOpenDebug method, which will launch a pop-up containing the same debug we access from the simulator. If you’d like to avoid having to add or remove the command depending on how you compile the app, then use command.setVisible = DTTStarted in the Initialize event: the command will only be visible if the application is compiled with debug activated.

With the method described we can see the code for the app installed on the device, but we still need to find out how to analyze the behavior of the native shell or a JavaScript customization of the graphic interface. A little while ago Luca talked to us about the Caravel debug tool, accessible from the address bar: just type debug.log to see the operations performed, and debug.? to get a list of all available commands. Up to this point it’s easy; now we just need to know how to analyze a JavaScript problem that only occurs on the device.

Here’s where the browsers can come to our aid, because beginning with Chrome 32 and Safari for iOS 6, you can debug the device remotely, working directly from your computer. Have a look at the guide for Chrome and the one for Safari. You can run the JavaScript code for your app created with InDe, step by step, in just a few minutes.

Can you see the message I prepared for you in this example project? Great. Then you know how it’s done.

Will you help me choose the subject of the next Tips & Tricks article?

  •    Extend the native shell.
  •    Optimize synchronization of documents with BLOB properties.
  •    Manage synchronization of edits made from third party software.
Loading ... Loading ...

Leave a Comment

Previous post:

Next post: