Image-diff – Create an image differential between two images
1–10 of 27 posts
Re: Image-diff – Create an image differential between two images
#2Not sure I follow - especially if it already depends on IM, how is it different from 'convert -compose difference' or a similar operator?
Re: Image-diff – Create an image differential between two images
#3This sort of thing + headless browser makes for nice regression testing.
Re: Image-diff – Create an image differential between two images
#4Not sure I follow - especially if it already depends on IM, how is it different from 'convert -compose difference' or a similar operator? http://www.imagemagick.org/Usage/compose/#difference
It looks like it's a thin wrapper around "GraphicsMagick for node". Which itself is a javascript wrapper around GraphicsMagick / ImageMagick.
Re: Image-diff – Create an image differential between two images
#5This sort of thing + headless browser makes for nice regression testing.
BBC News' wraith[1] is a pretty great tool for this, although it doesn't really support a more complex web app flow (e.g. logging in) very well.
Re: Image-diff – Create an image differential between two images
#6Pure JS alternative: https://github.com/yahoo/blink-diff
Re: Image-diff – Create an image differential between two images
#7Interesting, I couldn't find a tool like this that would give me a useful % difference between images, so I rolled my own tiny python version using PIL: https://github.com/nicolashahn/python-image-diff
which gives both a diff image and the % difference.
Re: Image-diff – Create an image differential between two images
#8This sort of thing + headless browser makes for nice regression testing.
One of my team members built an entire QA tool around this idea. It can load thousands of URLs, run it once, and then after a deploy to the development servers it runs again to generate a visual diff report. A combination of Golang, Node.js(PhantomJS), and some other bits I forget at the moment.
The product managers and content teams love it since they can quickly skim through a report to find visual bugs that may have gone unnoticed otherwise.
Re: Image-diff – Create an image differential between two images
#9This is cool, and a good idea. I will try it out, but I can highly recommend the existing pdiff utility for your image regression testing.
Pdiff allows you to specify perceptual thresholds of visibility, so diffs that are not pixel perfect can still pass if they're 'good enough'. Semi-critical if you render the input images using different browsers or at different resolutions, or if your images have any sub-pixel randomness.
Lots of people (myself included) have used pdiff successfully in production. It doesn't depend on ImageMagick (a bonus in my book). And it's already available in lots of Linux distros.
Re: Image-diff – Create an image differential between two images
#10This sort of thing + headless browser makes for nice regression testing.
BBC News' wraith[1] is a pretty great tool for this, although it doesn't really support a more complex web app flow (e.g. logging in) very well. [1] https://github.com/BBC-News/wraith .
If you need workflows, there's also VisualReview [1] with some basic workflow for approval testing, and Applitools [2], a commercial tool with integration with Selenium, Appium and Protractor that can do screenshot and video comparisons. I wrote about them as part of the 'Automated testing: back to the future' tools review [3]. In the article, I also mentioned DomReactor, but that seems to be discontinued now.