Highlevel Testing With CasperJS

If you've written a webapp and you want to ensure that critical parts such as the signup process stay working, the best would be to have an actual user go through that process every time you change your codebase. But since that's is both tedious & expensive, the second best thing is to automate a chrome browser (webkit engine anyway) to do this for you, and upload screenshots if anything unexpected happens.

"Casperjs is an open source navigation scripting & testing utility written in Javascript and based on PhantomJS — the scriptable headless WebKit engine. It eases the process of defining a full navigation scenario and provides useful high-level functions, methods & syntactic sugar".

Install

OSX

If you use Homebrew, you can install both CasperJS and PhantomJS using this command:

$ brew install casperjs

Ubuntu

To install both PhantomJS and CasperJS into /usr/local with this layout:

Use

Notes

You can write CaspjerJS scripts in Javascript or Coffeescript.
CasperJS will just switch interpreters based on the extension of the script you feed it.
For small projects like these I prefer Coffeescript.

To check if your .coffee files are valid, I recommend running them through
coffeelint (npm install -g coffeelint).

Make sure you run at least RC3
if you want to capture screenshots of timeouts as well.

Example

Here's an example script that shows some different tricks, I've commented
along the way. Some gems:

Anytime a testcase fails, a .png is saved. CasperJS will exit with code 1
so it's really easy to detect a fail then upload this screenshot to campfire
for example. This is possible using just curl and your campfire api keys.

Anytime a page contains: Error or Exception, a fail is automatically
triggered without the need to write additional asserts for this. It can be
disabled on a URL basis (in this case /nonexistent is
allowed to throw these texts).

See what we did? In just ~100 LoC we make sure this app deals correct prices for
new products, protects people's invoices and admin pages from unauthorized access, makes sure
the login system functions & redirects correctly, and that no page except /nonexistent
has any errors on it.
If any of these conditions aren't met, a screenshot is made.

Conclusion

There are also paid services you can outsource this to. Most of them offer a lot more
features such as also testing against FF, IE, Opera, Mobile, etc. so it may
make sense for you to use one of those. Some I know in no particular order:

the tests & actual code are stored in the same repository, hack on your code, hack on your tests, it's all versioned and coupled, this makes it easy and fun to update your tests.

no monthly fees

and as you've noticed it's actually not hard to do anymore, thanks to PhantomJS & CasperJS

Kevin van Zonneveld

Hi, I'm cofounder at Transloadit, a startup that handles file uploading and processing. Before that I was lead R & D at a hosting company. Occasionally I do consultancy, helping companies deploy (to) clouds and run Node.js in production. I love unix, infra automation, distributed systems, open source, beer, sunshine. I hate inefficiency.