Image-diff – Create an image differential between two images

Re:Image-diff – Create an image differential between two images by chris_va on Thursday July 28, 2016 @07:03PM (#12183840)

This sort of thing + headless browser makes for nice regression testing.

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by Washuu on Thursday July 28, 2016 @07:44PM (#12184056)

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.

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by prydonius on Thursday July 28, 2016 @07:12PM (#12183884)

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.

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by adzicg on Thursday July 28, 2016 @10:47PM (#12184767)

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.

[1] https://github.com/xebia/VisualReview

[2] https://applitools.com/

[3] https://gojko.net/2015/11/16/automated-testing-future/

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by davidjnelson on Friday July 29, 2016 @02:18AM (#12185282)

I wrote a tool that compares images using Applitools for Automattic during the React Wordpress admin rewrite a while back. The idea is you'd have a style guide with examples of all your ui components and render and compare them in various states with various test data. https://github.com/davidjnelson/css-visual-test

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by deckar01 on Thursday July 28, 2016 @11:22PM (#12184862)

I have been researching visual review processes for a project[0] and never ran across VisualReview. I have mainly focused on the screenshot diffing algorithm, but planned on creating a nice notification/approval UX. It might be time for a little collaboration.

[0] https://github.com/deckar01/narcis

[ Parent | on HN ]

Re:Image-diff – Create an image differential between two images by philjohn on Friday July 29, 2016 @03:21AM (#12185430)

Yep, I used to work somewhere that offered a multi-tenant SaaS app that customers could style themselves. We needed to make sure changes we made for a new release wouldn't cause issues with their custom styles. Threw together something that use IM and WebDriver to capture images and compare them.

[ Parent | on HN ]