Thursday, August 1, 2013

PhoneGap Development Best Practice(1) - Using Mock


Here I'd like to share with you a phonegap development practice from our phonegap team -- using mock. Then you don't have to test phonegap API related functions on your mobile devices, instead you can test the functions in web browser. You will find it saving you a lot of time.
It's so easy to use
We name the mock file as cordova.mock.js. You can switch beween mock and real cordova by adding/deleting the ".mock" to/from the script reference line.
Using mock:
<script src="cordova.mock.js" type="text/javascript"></script>
        
Using real:
<script src="cordova.js" type="text/javascript"></script>
        
Write the rest of code just like you are using the real cordova.js, becasue the two files works the same.
How to make the cordova.mock.js?
We have created a github repository for cordova.mock.js. It's now not 100% complete, but we'll continue to mock more phonegap API to it. We also welcome you to contribute to this repo.
Part of sample code.
if(window.navigator == undefined) {
    window.navigator = { };
}
navigator.contacts = {
    find: function(contactFields, contactSuccess, contactError, contactFindOptions) {
        var contacts = [
            {
                displayName: "Mike",
                name: {
                    familyName: 'R',
                    formatted:'Mike R'
                },
                phoneNumbers: [
                    {
                        type: "string",
                        value: "0722829323123",
                        pref: false
                    }
                ]
            },
            {
                displayName: "Leo",
                phoneNumbers: [
                    {
                        type: "string",
                        value: "03837234343",
                        pref: false
                    },
                    {
                        type: "string",
                        value: "005543834",
                        pref: true
                    }
                ]
            }
        ];
        contactSuccess(contacts);
    }
};

var ContactFindOptions = function() {
    this.filter = "";
    this.multiple = false;
};
You can also make it by your self according to your project requirements. It's really easy.
How do you like this idea? Please feel free to make any comment.

1 comment:

  1. Very interesting initiative. I wish you will cover more APIs shortly.

    Cheers

    Younes

    ReplyDelete