debug javascript in android emulator with phonegap

Question

I am new to phonegap and android development. May I know how can I debug javascript error on the emulator? I have heard about ADB may I know how can I use and install it on wind

Answer 1

I've found that this works for debugging javascript errors for Android/Phonegap when testing the app through Eclipse on Windows 7.

Simply go to Window > Show View > Other...

Then select LogCat under the Android folder.

The window/tab that just poped up is where the Android emulator will send its logs and error messages. You can detach this window and place it outside of the Eclipse IDE (I found this useful). You can also control the types of errors you see by selecting any of the 5 colored letters in the top right hand corner of the window.

To hide the useless information so you just see errors, make sure you only have (E) selected. Personally, I also like to have (W) warnings selected as well as (E) errors selected.

Hope that helps!

Answer 2

The best solution to catch exceptions and show in your console is this code:

window.onerror = function(msg, uri, line) {
    console.log(msg + uri + line);
}

Answer 3

If you're using Phonegap Build and would like to debug using the Chrome console, here's a working solution. It's possible to debug WebViews using USB debugging (https://developer.chrome.com/devtools/docs/remote-debugging#debugging-webviews)

First, make sure your widget tag contains xmlns:android="http://schemas.android.com/apk/res/android"

<widget 
    xmlns="http://www.w3.org/ns/widgets" 
    xmlns:gap="http://phonegap.com/ns/1.0" 
    xmlns:android="http://schemas.android.com/apk/res/android"
    id="me.app.id" 
    version="1.0.0">

Then add the following

<gap:config-file platform="android" parent="/manifest">
     <application android:debuggable="true" />
</gap:config-file>

It works for me on Nexus 5, Phonegap 3.7.0.

<preference name="phonegap-version" value="3.7.0" />

Build the app in Phonegap Build, install the APK, connect the phone to the USB, enable USB debugging on you phone then visit chrome://inspect.

Source: https://www.genuitec.com/products/gapdebug/learning-center/configuration/

Answer 4

I solved it easily on two steps.

Change the level of logging

In config.xml add this line

    <log level="DEBUG"/>

Run the cordova Log

It's a bat file that you can just run and track all the log messages go to your phonegap project and navigate to \platforms\android\cordova then open log.bat you can now emulate your application using the command line

cordova emulate

and the log will be shown in the cmd which will be pop-uped when you open log.bat