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.

4 comments:

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

    Cheers

    Younes

    ReplyDelete
  2. Check The Mmjff Overview To Monitor A Stock And View Live Price Changes As They Occur, Including Volume And Share Changes. With Our Live, Real Time Stock Market Overview App, You No Longer Need To Refresh Your Browser Or Watch Multiple Computer Screens To View Real Time Stock Prices.

    ReplyDelete
  3. Fxit Stock Overview: Stay ahead of the market with our live and real time stock market overview. Get all of your favorite stocks in one place, and get alerted to live news at the same time!

    ReplyDelete