debugging

Debugging an Application

Web Inspector all the way!

Table of Contents

1. Remote Web Inspector
2. Weinre

There are two popular techniques used to debug an application.

Remote Web Inspector

When you compile the application yourself, you can use Safari's Remote Web Inspector. Unfortunately, this will not work with the PhoneGap Developer App or PhoneGap Build, although we are investigating options to add this!

You can follow Holly Schinsky's Development Workflow video to learn how to setup and use Remote Web Inspector.

Weinre

The good ol'fallback in a node library called Weinre. It's a limited implementation of Remote Web Inspector that will work on any browser... not just Webkit.

1. Install Weinre:

    $ sudo npm install -g weinre
   

2. Run Weinre:

    $ weinre --boundHost x.x.x.x
    # replace x.x.x.x with your ip address
   

3. Add the following script to www/index.html:

    <script src="http://x.x.x.x:8080/target/target-script-min.js#anonymous"></script>
    # replace x.x.x.x with your ip address
   

4. Serve and pair the app with the PhoneGap Developer App.

5. Open your browser to http://x.x.x.x:8080/client/#anonymous where x.x.x.x is your ip address

6. Start debugging!