If you’ve tried building PhoneGap/Cordova apps, be it in Object Pascal via Smart Mobile Studio or directly in JS, you’ll quickly have realized that debugging on the devices, even with remote debuggers and emulators, isn’t always convenient.
Being able to debug in a desktop browser would be so much more convenient, eh?
The most commonly recommended way to do that is via Ripple, a Chrome plugin, which is indeed pretty, but IME proved quite buggy and heavy (meaning that Chrome debuggers would spend more time reporting stuff buried deep in ripple.js than in my own code).
Enter phonegap-desktop, an open source project by Jonathan Prince, which is essentially just a phonegap.js library that exposes the PhoneGap API, and allows you to provide fake device data just by writing in a json file. Simple, no-fuss.
To use it with a SmartMS project, just copy the “phonegap-desktop.js” file in the bin subfolder of a project, rename it to “phonegap.js“, et voilà! you can then run your app in Chrome or FireFox as usual. And when building the zip for Phonegap Build, just don’t include that file.
3 thoughts on “Debugging PhoneGap/Cordova apps on the Desktop”
Very nice tip.
Thanks for pointing this project out!
What about debugging right inside the Smart IDE?
This would be a genuine feature to add to Smart.
I can’t tell about the timeline for integration, but I’m going to push for source-maps getting in ASAP. They’re already in “works here” state (just in need for wider testing), and allow to debug Pascal code right from any source-map capable browser (Chrome & FireFox at least).
There was also some prototype for attaching to the Webkit remote debugging in the IDE, I’m not sure how far that has advanced though.
This will play nicely by spoofed Firefox headers, displaying the mobile version of the page… great stuff, thanks!
Comments are closed.