Implementing a Visual CSS Testing Framework

December 2014

@jessicard, Jessica Dillon.

Slides

We want image diffs to see when pages don't load properly. Why? Because CSS is frickin' hard to refactor! And writing tests to describe something visual is really, really hard.

They wanted something that took full-page screenshots, not just the fold.

They wanted a place to store these screenshots.

They needed a want to view the diff screenshots.

Building the Framework

Testing with rspec

Buildbox

Selenium

Browserstack

Imagemagick (What's up with wizards for web tools, anyway?)

Update, 12/10/14

@jessicard wrote a blog post outlining this in much better detail than I was able to in my notes. Please check it out!