Phantom CSS

I have not gotten the chance to use Phantom CSS out yet, but it’s promise and buzz among fellow web developers is promising when it comes to visual regression testing. To put it in the words of its creator, developer James Cryer:

PhantomCSS takes screenshots captured by PhantomJS and compares them to baseline images using Resemble.js to test for rgb pixel differences with HTML5 canvas. PhantomCSS then generates image diffs to help you find the cause so you don’t need to manually compare the new and old images.

Think about it: an open source delivery system to generate images for differences in a web site. That’s extremely powerful stuff as it can catch errors eyeballing code often misses, especially on a large web site base where visual spot checks on every page are out of question.