Setting up Testem to run PhoneGap tests.

Testing is like that Jay-Z album ... a gift and a curse. ( Not that I actually listen to him ) The benefits of testing are:

  • You can refactor your code with ease.
  • It promotes loose coupling and more coherent code.
  • You find suspicious code before it becomes an issue down the road.
  • It makes you a better dev in general because it forces you to get intimate with your code.

So with all of the benefits, why do people not test? It comes down to two things:
1) If you aren't experienced at TDD, learning how to make stubs, mocks, and doing code setup can take precious time.
2) People don't know about the tools availible.

This article will fix one of those 2.

Simple TDD with Testem

Testem makes coding happy instead of a chore. It provides power and flexibility while maintaining utter simplicity.

Ok so now that you've pitched it, what the heck is it?

Testem is a testing framework that let's you automate your testing stack.

Not only does it automate things, but it virtually allows you to use any language and framework out there.

I have actually set it up with PHP ( PHPunit ), Capybara & Rspec, and Jasmine and I have just scratched the surface.

So now that you have drank the Kool-Aid and know what it is, let's dig in to an example with PhoneGap ( AKA Cordova ).

Intro To PhoneGap

Phonegap is a tool that lets you write native mobile apps in web technologies. As of PhoneGap 3.0 you can now install it via a simple npm command:

sudo npm install -g phonegap  

Once it's installed you can then install your OS version of choice to build against. Mine is IOS, BC It's way better :p (Actually just bc I have an iPhone :)
)

//      command dir identifier  display text 
phonegap create bam com.example.bam bam  

Next you build the app with the command: phonegap build <os_type>. My os_type, again is iOS.

If you're missing any dependencies just npm install those bad boys.

Last to run it just type: phonegap run iOS. ( assuming you're cool and did iOS like me. )
Now let's look at the testing side of things.

To Infinity and Beyond!! ( With Testem )

Anytime you're exploring brave new worlds and new civilizations and boldly going where no man has gone before ( Except the people who made the framework, and everyone who uses it, and google ), it's important to have a saftey net. If you havent guessed it from the text above, that net for us is testing. Here's how you integrate the built-in PhoneGap Jasmine tests that come with Testem.

1)   Add the testem script tag to the PhoneGap spec.html.

<!-- ... code above here ... -->  
<!-- jasmine core files -->  
<link rel="stylesheet" type="text/css" href="spec/lib/jasmine-1.2.0/jasmine.css">  
<script type="text/javascript" src="spec/lib/jasmine-1.2.0/jasmine.js"></script>  
<script type="text/javascript" src="spec/lib/jasmine-1.2.0/jasmine-html.js"></script>

<!-- **** include the testem script *** -->  
<script src="/testem.js"></script>

<!-- include source files here... -->  
        <script type="text/javascript" src="js/index.js"></script>

        <!-- include project specific spec files here... -->
<script type="text/javascript" src="spec/helper.js"></script>  
<script type="text/javascript" src="spec/index.js"></script>  
<!-- ... and....more code below ... -->  

2)   Add a testem.yml file. Below is mine:

src_files:  
- www/js/index.js
- www/spec/index.js

test_page: "www/spec.html"

launch_in_dev:  
- Chrome

This tells testem what to launch when you run the testem command and where to find its' resources it will need when autolaunching browsers and stuff.

I just picked chrome because I like it. To get a full list of launchers you can do testem launchers and just replace Chrome with whatever you like.

You can also launch stuff on the fly with a command like testem -l Firefox or testem -l PhantomJS

It's worth a look at both headless testing with phantom and browser based testing. Headless is a bit faster sometimes.

When you get into integration testing with things like Capybara turning your browser off occasionally can save you some time. ( More on Capybara in a soon to come future article ).

Conclusion

There are many types of testing but only one framework to rule them all. ( maybe more but it sounds good ). There is integration testing ( Testing how the different parts of your app work together ), Unit testing ( testing small chunks of code. Usually methods. ) and acceptance testing ( testing that your code meets client expectations, typically written in an english like syntax ).

I hope you enjoyed this article. More will be coming soon.

Resources

Here is a repo with the most crucial stuff in it.