Nilal

Captures images of a particular web element and assert it against the expected image, and all you have to learn extra, is a single assert statement. Thus making it the simplest yet powerful visual regression testing tools.

Example

# In your capybara test

# Asserting a graph in page
find('.trend_chart').should match_image expected_report_image

# Assert layout/CSS Styling
find('.analysis_table').should match_image expected_table_image

Key Benefits

There are lot of tools out there to do visual regression, then why a yet another one.

1. Seamlessly integrates with your existing regression test suite. No need to set up a seperate suite
2. Just the image of the element under validation is captured and asserted, unlike other tools where the full page captured. This brings in a sea of advantages.
3. Avoid test failures, due to change in elements unrelated to the test
4. Reduced test run time, since we need not process a large image of the whole page.
5. Avoid updating expected reference image when there is a change unrelated to test
6. Test runs in a real browser (Firefox supported now, Chrome & IE in progress), providing a real time feedback, rather than virtual headless browsers
7. Unlike other toos, there is no need of any external dependencies like pdiff or ImageMagic. Chunky_Png is used here.

Usage

#Gemfile
gem 'nilal'

###Cucumber

# In env.rb
require 'nilal'
include Nilal

firefox_profile = Selenium::WebDriver::Firefox::Profile.new
firefox_profile.add_extension File.join(Gem::Specification.find_by_name("nilal").gem_dir,"/lib/nilal/nilal.xpi")

Capybara.register_driver :selenium do |app|
  Capybara::Selenium::Driver.new(app, :browser => :firefox, :profile => firefox_profile)
end

Generating expected reference image

1. Create a folder under 'feature' called 'images'.
2. First time, run your test without the reference image, test would fail, yet image of the expected element would be captured in 'tmp/capybara' folder.
3. Copy the image into your 'feature/images' folder. Commit it as part of your test source code.
4. Done. Now your tests will run, anywhere your ode is available.

##ToDo

1. Java Api - for assertion
2. .net Api - for assertion
3. Chrome extension to capture image
4. IE extension to capture image