Web developer

Link dump - front end testing

Front end testing

Today I will be looking at front end testing, below are some links


Testing with casper.js

Enter CasperJS, a functional testing tool for the frontend. It is built upon JavaScript, the language we’re already using to power the web. It’s easy to learn and just as versatile as the browser itself.

Using PhantomCSS for Regression Testing Your CSS

PhantomCSS uses CasperJS, built on PhantomJS as a testing framework with screenshot capabilities, and ResembleJS to compare images.


Grunt plugin to run Google PageSpeed Insights as part of CI


Phantomas is a PhantomJS-based web performance metrics tool


Tim Kadlec, who first suggested performance budgets, recently released this tool to help teams meet their goals.


Wraith uses either Phantom or Slimer (your choice) to take screenshots of two environments, producing a visual diff of the two screenshots.

Wraith tutorial for designers

With new responsive websites, it's more important than ever to look at your site at different widths. But this can be time consuming and repetitive. Also, you may want to see how your dev site compares to your live site - for example "Did this small change I made to the css on one page change much on other pages?" Again, time consuming to do by hand. Luckily for us, here comes Wraith to the rescue!

Ghost Inspector

Automated test recording for Casper, not free though.

Your code has to be public though, not behind a firewall or on an intranet...

Remote debug casper

If you use casper extensively, you could do with a debugger.


Huxley is a test-like system for catching visual regressions in Web applications.

Looks nice, but is no longer maintained...