androiddebuggingcordovaemulationmobile-webkit

Is there a real solution to debug cordova apps


I spent the last two days trying to figure out how to debug an HTML5 app I created using Cordova 3.2 and deployed to an Android 2.3 device. All the articles/posts I've seen provide hacks rather than real solutions :( and most of the time, none of them works for my case; debug the css styles and the Angularjs code inside my app..

So far I tested;

debug.phonegap.com

I injected the script to the index.html file then visited the generated URL in debug.phonegap.com but nothing happens; only a blank page.

Weinre

Most of the articles I found point to obsolete Github repository that countain a Jar file.. but it's not found :(

Edge inspect

It works and shows the webpage I'm browsing on the PC inside the mobile.. But the problem is that it uses some other integrated browser (or emulator) than the one that runs phonegap apps; so the results are not accurate.

Chrome emulator

Same as Edge inspect; it doesn't allow to view real web-kit v530 that is shipped with Android 2.3.

The dream solution

The perfect solution would be an extension to Google Chrome (desktop) that enables you to switch the desktop browser to the same one found in Android 2.3 platforms; no emulation no hacks, just the browser itself with web-kit v 530.

Unfortunately such solution doesn't exist :( or I'm wrong?

Any suggestions?


Solution

  • NOTICE

    This answer is old (January 2014) many new debugging solutions are available since then.


    I finally got it working! using weinre and cordova (no Phonegap build) and to save hassle for future devs, who may face the same problem, I made a YouTube tutorial ;)