Using Ripple Emulator for Windows to test PhoneGap applications

Though Ripple Emulator is mainly produced for testing Blackberry applications, you can easily use it for testing PhoneGap apps, build for any platform supported by PhoneGap. But, it is still Blackberry-oriented tool and so it is its documentation, so you may face some missing parts and blackholes, when reading it. Especially, when you’re building your apps in the cloud, using PhoneGap Build.

The aim of this post is to fix as many of these as possible and save you some time.

If you’re developing apps using PhoneGap Build, you should delete phonegap.js (or cordova.js) file from your application’s webroot and only left reference to it in index.html.

This is fine for PhoneGap Build, but absolutely not fine for Ripple Emulator.

It will not work at all without this file and you’ll see the very same set of error messages in the console as you would do seeing your app directly in a browser (mainly about undefined objects).

Key steps are:

  1. Put cordova.js file back to your root. You can grab it from any downloadable version of PhoneGap (you should use phonegap-2.0.0.zip though, see below) from /lib/android/example/assets/www/ folder.
  2. Install “Ripple Emulator” extension for your Chrome browser, using Chrome Store. Enable it.
  3. Start your local webserver and run your HTML code of your mobile application through it (testing through direct file access is mainly possible in Ripple Emulator, but highly not advisable and may produce unpredictable results).
  4. Click Ripple Emulator icon, right to your Chrome omnibar and then click Enable.
  5. Click Ripple Emulator icon again and click Start Ripple Services if they’re not started automatically.
  6. Set destination platform (device) and enjoy working PhoneGap application locally.

Notice for people struggling with similar problem: Current version of Ripple Emulator uses Cordova 2.0, make sure, that you download right version of PhoneGap and take cordova.js from it. Do not attempt to use cordova.js from newer version (currently 2.9.0) as you may run into undetectable situations, including seeing many strange alert()‘s and even hanging up overloaded Chrome.

You also have to keep your eye for PhoneGap API and carefully check, what was available and how it was accessible in PhoneGap 2.0.0? For example, simple connection type checking has changed ever since that. In 2.9.0 API it is done via navigator.connection, while in 2.0.0 API it was accessed under the navigator.network interface.

Since Ripple Emulator uses PhoneGap 2.0.0, currently supported way of calling this object:

var networkState = navigator.connection.type;

will fail, and you have to use it this way:

var networkState = navigator.network.connection.type;

Though you can select PhoneGap version, when compiling in PhoneGap Build (and you can force it to use version 2.0.0, though compile this code in an unchanged way), you will most likey want to develop your application using newest version of PhoneGap.

In this case, you have to use as “secured” approach, that will work in both Ripple Emulator and newest PhoneGap:

var networkState =
(
    (navigator.connection)
    ?
    navigator.connection.type
    :
    (
        navigator.network && navigator.network.connection
        ?
        navigator.network.connection.type
        : 
        'unknown'
    )
);

That’s pretty much all.

Leave a Reply