lineup 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: ca168f6253bc6111e22696d8b4f72e5a468ca804
+  data.tar.gz: bc2ffad3a74d03b3dbff81e5f980d81fd1c76644
+SHA512:
+  metadata.gz: a87243428920002cd40dc99f824d97dc98630dccd022cc579e3dea71718598b7242fab291abf0b85dac13a86596b9dd0b394c1644ce48d32bda1b73badcd4592
+  data.tar.gz: 10ea27a5f54e0cb04ed9da5881ba276978d599c29be3c38dfb7fb983fd11349365746ac7cf93e70aaa630a48979da66688f95c355a2e4359b82cc6cf4e92935f

data/.gitignore

@@ -0,0 +1,13 @@
+lib/images/**
+.idea/
+out.html
+screenshots/
+*.gem
+
+*~
+chromedriver.log
+.ruby-version
+.DS_Store
+.kate-swp
+.ruby-gemset
+.swp

data/Gemfile

@@ -0,0 +1,12 @@
+source 'https://rubygems.org'
+
+gemspec
+
+gem 'rspec'
+gem 'pxdoppelganger', '0.1.1'
+gem 'selenium-webdriver'
+gem 'watir-webdriver'
+gem 'watir'
+gem 'headless'
+gem 'dimensions'
+gem 'oily_png'

data/Gemfile.lock

@@ -0,0 +1,62 @@
+PATH
+  remote: .
+  specs:
+    lineup (0.1.0)
+
+GEM
+  remote: https://rubygems.org/
+  specs:
+    childprocess (0.5.5)
+      ffi (~> 1.0, >= 1.0.11)
+    chunky_png (1.3.4)
+    commonwatir (4.0.0)
+    diff-lcs (1.2.5)
+    dimensions (1.3.0)
+    ffi (1.9.6)
+    headless (2.0.0)
+    multi_json (1.11.0)
+    oily_png (1.2.0)
+      chunky_png (~> 1.3.1)
+    pxdoppelganger (0.1.1)
+    rspec (3.2.0)
+      rspec-core (~> 3.2.0)
+      rspec-expectations (~> 3.2.0)
+      rspec-mocks (~> 3.2.0)
+    rspec-core (3.2.3)
+      rspec-support (~> 3.2.0)
+    rspec-expectations (3.2.1)
+      diff-lcs (>= 1.2.0, < 2.0)
+      rspec-support (~> 3.2.0)
+    rspec-mocks (3.2.1)
+      diff-lcs (>= 1.2.0, < 2.0)
+      rspec-support (~> 3.2.0)
+    rspec-support (3.2.2)
+    rubyzip (1.1.7)
+    selenium-webdriver (2.46.2)
+      childprocess (~> 0.5)
+      multi_json (~> 1.0)
+      rubyzip (~> 1.0)
+      websocket (~> 1.0)
+    watir (5.0.0)
+      commonwatir (~> 4)
+      watir-webdriver
+    watir-webdriver (0.7.0)
+      selenium-webdriver (>= 2.45)
+    websocket (1.2.1)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  dimensions
+  headless
+  lineup!
+  oily_png
+  pxdoppelganger (= 0.1.1)
+  rspec
+  selenium-webdriver
+  watir
+  watir-webdriver
+
+BUNDLED WITH
+   1.10.6

data/README.md

@@ -0,0 +1,143 @@
+# Lineup
+
+Lineup is doing automated testing of webpage designs, eg. in continious delivery.
+If you push new code to production, you can evaluate the design of you page compared to a defined base design and
+get an analysis about the difference of the designs:
+
+For all images that you want to compare, you will receive information about how many pixel are different
+between the two image version and an image, that contains only the parts, that changed, a "difference image".
+
+![Example view of base (left), new (right) as well as diff image.](doc/example.png)
+Picture: Example view of base (left), new (right) as well as diff image. In this example, the margin around the bottom headline increased,
+thus some of the elements moved down.
+
+## Requirements
+
+A firefox browser must be installed, as well as phantomjs.
+
+## Usage
+
+Add it into your Gemfile:
+````ruby
+gem "lineup"
+````
+
+Or install it manually with the following command:
+````
+gem install lineup
+````
+
+Do a base reference screenshot of you application:
+````ruby
+require 'lineup'
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.record_screenshot('base')
+````
+
+Do something (deployment of your new code) and take a new screenshot
+````ruby
+lineup.record_screenshot('new')
+````
+
+Analyse the results:
+````ruby
+lineup.compare('new', 'base')
+ => [{:url => 'sport', :width => 600, :difference => 0.7340442722738748,
+    :base_file => '/home/name/lineup/screenshots/base_frontpage_600.png'
+    :new_file =>  '/home/name/lineup/screenshots/new_frontpage_600.png'
+    :diff_file => '/home/name/lineup/screenshots/DIFFERENCE_frontpage_600.png' }]
+````
+
+You can save it for later use:
+````ruby
+lineup.save_json('/home/name/lineup/results/')
+ => '/home/name/lineup/results/json.log'
+````
+
+## More configuration:
+
+There are multiple ways to specify what to lineup and compare.
+
+By specifying different urls via ````#urls````:
+````ruby
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.urls("/, /multimedia, /sport")
+````
+This will do analysis of otto.de root (frontpage), otto.de/multimedia and otto.de/sport.
+It requires a comma separated string. Default value is only root.
+
+By specifying different resolutions via ````#resolutions````:
+````ruby    
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.resolutions("600, 800, 1200")
+````
+The values are the browser width in pixel. For each size an analysis is done.
+It require a comma separated string. Default values are 640px, 800px and 1180px.
+
+By specifying a filepath for the screenshots via ````#filepath_for_images````:
+````ruby    
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.filepath_for_images(/home/myname/lineup/screenshots)
+````
+Creates a file and saves the screenshots in the file. Default is ````"#{Dir.pwd}/screenshots"````
+
+By specifying a filepath for the difference image via ````#difference_path````:
+````ruby    
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.difference_path(/home/myname/lineup/result)
+````
+Creates a file and saves the difference image in the file. Default is ````"#{Dir.pwd}/screenshots"````
+
+By specifying wether or not to use phantomjs via ````#use_phantomjs````:
+````ruby    
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.use_phantomjs(true)
+````
+If ````false```` the screenshots are taken in Firefox. ````#load_json_config````:
+
+Load all above configs from a json file via 
+````ruby    
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.load_json_config(/home/myname/lineup/config.json)
+````
+While my file contains all relevant information
+````json
+{
+  "urls":"/multimedia, /sport",
+  "resolutions":"600,800,1200",
+  "filepath_for_images":"~/images/",
+  "use_headless":true,
+  "difference_path":"#/images/diff"
+}
+````
+
+## Example:
+
+````ruby  
+base_name = 'name-for-base-screenshot'
+new_name = 'name-for-new-screenshot'
+urls = '/, multimedia, sport'
+resolutions = '600, 800, 1200'
+images_path = '/home/myname/lineup/screenshots'
+difference_path = '/home/myname/lineup/results'
+json_path = 'home/myname/lineup/results'
+phantom = true
+
+lineup = Lineup::Screenshot.new('https://www.otto.de')
+lineup.urls(urls)
+lineup.resolutions(resolutions)
+lineup.filepath_for_images(images_path
+lineup.difference_path(difference_path)
+    
+lineup.record_screenshot(base_name)
+# do sth. (eg. deploy new software)
+lineup.record_screenshot(new_name)
+lineup.save_json(json_path)
+````
+Now open home/myname/lineup/results and find:
+the difference files and a log.json with all information about what images are not the same.
+
+## Contribute
+
+Please do!
+ 

data/bin/lineup

@@ -0,0 +1,7 @@
+#!/usr/bin/env ruby
+
+require 'lineup'
+
+lineup = Lineup::Screenshot.new('otto.de')
+lineup.use_phantomjs false
+lineup.record_screenshot('base')

data/lib/controller/browser.rb

@@ -0,0 +1,58 @@
+require 'watir'
+require 'watir-webdriver'
+include Selenium
+require 'fileutils'
+require 'headless'
+require_relative '../helper'
+
+class Browser
+
+  def initialize(baseurl, urls, resolutions, path, headless)
+    @absolute_image_path = path
+    FileUtils.mkdir_p @absolute_image_path
+    @baseurl = baseurl
+    @urls = urls
+    @resolutions = resolutions
+    @headless = headless
+  end
+
+  def record(version)
+    browser_loader
+    @urls.each do |url|
+      @resolutions.each do |width|
+        screenshot_recorder(width, url, version)
+      end
+    end
+  end
+
+  def end
+    begin #Timeout::Error
+      Timeout::timeout(10) { @browser.close }
+    rescue Timeout::Error
+      browser_pid = @browser.driver.instance_variable_get(:@bridge).instance_variable_get(:@service).instance_variable_get(:@process).pid
+      ::Process.kill('KILL', browser_pid)
+      sleep 1
+    end
+    sleep 5 # to prevent xvfb to freeze
+  end
+
+  private
+
+  def browser_loader
+    if @headless
+      @browser = Watir::Browser.new :phantomjs
+    else
+      @browser = Watir::Browser.new :firefox
+    end
+  end
+
+  def screenshot_recorder(width, url, version)
+    filename = Helper.filename(@absolute_image_path, url, width, version)
+    @browser.driver.manage.window.resize_to(width, 1000)
+    @browser.cookies.clear
+    url = Helper.url(@baseurl, url)
+    @browser.goto url
+    @browser.screenshot.save( File.expand_path(filename))
+  end
+
+end

data/lib/controller/comparer.rb

@@ -0,0 +1,79 @@
+require 'pxdoppelganger'
+require 'json'
+
+class Comparer
+
+  attr_accessor :difference
+
+  def initialize(base, new, difference_path, baseurl, urls, resolutions, screenshot_path)
+    @base = base
+    @new = new
+    @baseurl = baseurl
+    @urls = urls
+    @resolutions = resolutions
+    @absolute_image_path = screenshot_path
+    @difference_path = difference_path
+    FileUtils.mkdir_p difference_path
+    compare_images
+  end
+
+  def json(path)
+    FileUtils.mkdir_p path
+    generate_json(path)
+  end
+
+  private
+
+  def compare_images
+    self.difference = []
+    @urls.each do |url|
+      @resolutions.each do |width|
+        base_name = Helper.filename(
+            @absolute_image_path,
+            url,
+            width,
+            @base
+        )
+        new_name = Helper.filename(
+            @absolute_image_path,
+            url,
+            width,
+            @new
+        )
+        images = PXDoppelganger::Images.new(
+            base_name,
+            new_name
+        )
+        if images.difference > 1e-03 # for changes bigger than 1 per 1.000; otherwise we see mathematical artifacts
+          diff_name = Helper.filename(
+              @difference_path,
+              url,
+              width,
+              'DIFFERENCE'
+          )
+          images.save_difference_image diff_name
+          result = {
+                    url: url,
+                    width: width,
+                    difference: images.difference,
+                    base_file: base_name,
+                    new_file: new_name,
+                    difference_file: diff_name
+          }
+          self.difference << result
+        end
+      end
+    end
+  end
+
+  def generate_json(path)
+    json = difference.to_json
+    file = File.open(
+        "#{path}/log.json", "a+"
+    )
+    file.write(json)
+    file.close
+  end
+
+
+end

data/lib/helper.rb

@@ -0,0 +1,31 @@
+module Helper
+  extend self
+
+  def filename(path, url, width, version)
+    "#{path}/#{version}_#{name(url)}_#{width}.png"
+  end
+
+  def url(base, url)
+    ("#{base}/#{clean(url)}")
+  end
+
+  private
+
+  def name(page)
+    if page == '/'
+      name = 'frontpage'
+    else #remove forward slash
+      name = page.gsub(/\//, "")
+    end
+    name
+  end
+
+  def clean(url)
+    if url == '/' #avoid two dashes at the end, e.g. www.otto.de//
+      ''
+    else
+      url
+    end
+  end
+
+end

data/lib/lineup.rb

@@ -0,0 +1,275 @@
+require 'rubygems'
+require_relative 'controller/browser'
+require_relative 'controller/comparer'
+
+module Lineup
+
+  attr_accessor :difference
+
+  class Screenshot
+
+    def initialize(baseurl)
+
+      # the base URL is the root url (in normal projects the frontpage or for us storefront)
+      # while the base url is passed in, defaults for other values are set, too
+      #
+      # for us the base url is https://www.otto.
+      #
+      # the base url needs to be a string and cannot be an empty sting
+
+      raise "base URL needs to be a string" unless baseurl.is_a? String
+      raise "base URL is needed, cannot be empty" if baseurl == ''
+
+      @baseurl = baseurl
+
+      # the urls are combined with the root url and give the absolute url of the pages to be tested
+      # see more in the according method below
+      # the default value is the baseurl itself, represented by a forward slash
+      # the images will be saved as "frontpage" images
+
+      urls('/')
+
+      # the resolutions can be as many as desired, we use a mobile, a tablet and a desktop resolution
+      # by default this is 640px, 800px and 1180px width
+      # see more in the according method below
+
+      resolutions('640, 800, 1180')
+
+      # this sets the path where to store the screenshots, by default this is the current directory
+      # see more in the according method below
+
+      filepath_for_images("#{Dir.pwd}/screenshots")
+
+      # using selenium in a headless environment vs firefox.
+      # by default in headless
+      # see more in according method below
+
+      use_phantomjs(true)
+
+      # this is the path where to save the difference images of two not alike screenshots
+      # by default the current directory, like for the other images
+      # see more in according method below
+
+      difference_path("#{Dir.pwd}/screenshots")
+    end
+
+
+    def urls(urls)
+
+      # all urls to be tested are defined here
+      # they need to be passed as a comma separated string (with or without whitespaces)
+      #
+      # e.g "/, /multimedia, /sport"
+      #
+      # the pages are used to name the image files, too
+      #
+      # if it is not a string or the string is empty an exception is raised
+
+      raise "url for screenshots needs to be a string" unless urls.is_a? String
+      raise "url for screenshots cannot be <empty string>" if urls == ''
+
+      # after the base screenshots are taken, the urls cannot be changed, an exception would be raised
+
+      raise_base_screenshots_taken('The urls')
+
+      #we remove whitespaces from the urls, replace ; by , and generate an array, splitted by comma
+
+      begin
+        @urls= clean(urls).split(",")
+      rescue NoMethodError
+        raise "urls must be in a comma separated string"
+      end
+    end
+
+
+
+    def resolutions(resolutions)
+
+      # all resolutions to be tested are defined here
+      # they need to be passed as a comma separated string (with or without whitespaces)
+      #
+      # e.g "400, 800, 1200"
+      #
+      # if its not a string or the string is empty an exception is raised
+
+      raise "resolutions for screenshots needs to be a string" unless resolutions.is_a? String
+      raise "the resolutions for screenshot cannot be <empty string>" if resolutions == ''
+
+      # after the base screenshots are taken, the resolutions cannot be changed, an exception would be raised
+
+      raise_base_screenshots_taken('The resolutions')
+
+      #we remove whitespaces from the urls, replace ; by , and generate an array of integers
+
+      begin
+        @resolutions = clean(resolutions).split(",").map { |s| s.to_i }
+      rescue NoMethodError
+        raise "resolutions must be in a comma separated string"
+      end
+    end
+
+
+
+    def filepath_for_images(path)
+
+      # if required an absolute path to store all images can be passed here.
+      # at the path a file "screenshots" will be generated
+      #
+      # e.g '/home/finn/pictures/otto'
+      #
+      # if its not a string or the string is empty an exception is raised
+
+      raise "path for screenshots needs to be a string" unless path.is_a? String
+      raise "the path for the screenshots cannot be <empty string>" if path == ''
+
+      # after the base screenshots are taken, the path cannot be changed, an exception would be raised
+
+      raise_base_screenshots_taken('The path')
+
+      # the path is one string. we just assign the variable
+      
+      @screenshots_path = path
+    end
+
+    
+    
+    def use_phantomjs(boolean)
+
+      # if required the headless environment can we skipped and firefox used for the screenshots
+      #
+      # e.g use_headless = false
+      #
+      # if its not a boolean an exception is raised
+
+      raise "use_headless can only be true or false" unless boolean == !!boolean
+
+      # after the base screenshots are taken, the browser cannot be changed, an exception would be raised
+
+      raise_base_screenshots_taken('The browser type (headless)')
+
+      # sometimes packages are missing on ubuntu to run the headless environment, installing these should resolve it:
+      # sudo apt-get install -y xfonts-100dpi xfonts-75dpi xfonts-scalable xfonts-cyrillic xvfb x11-apps  imagemagick
+
+      @headless = boolean
+    end
+
+
+
+    def difference_path(path)
+
+      # if required an absolute path to store all difference images can be passed here.
+      # in most usecases you may want to save them along with the base and new images
+      #
+      # e.g '/home/finn/pictures/otto'
+      #
+      # if its not a string or the string is empty an exception is raised
+
+      raise "path for difference images needs to be a string" unless path.is_a? String
+      raise "the path for the difference images cannot be <empty string>" if path == ''
+
+      # assign the variable
+
+      @difference_path = path
+    end
+
+
+
+    def load_json_config(path)
+
+      # loads all possible configs from a json file.
+      # in this file all parameters need to be set
+      # an example configuration is
+      # '{"urls":"/multimedia, /sport","resolutions":"600,800,1200","filepath_for_images":"~/images/","use_headless":true,"difference_path":"#/images/diff"}'
+
+      #open the file and parse JSON format
+      configuration = JSON.parse(File.read(path))
+
+      # write to method above
+      urls(configuration["urls"])
+      resolutions(configuration["resolutions"])
+      filepath_for_images(configuration["filepath_for_images"])
+      use_phantomjs(configuration["use_phantomjs"])
+      difference_path(configuration["difference_path"])
+
+      # the method calls set the variables for the parameters, we return an array with all of them.
+      # for the example above it is:
+      # [["/multimedia", "/sport"], [600, 800, 1200], "~/images/", true, "#/images/diff"]
+      [@urls, @resolutions, @screenshots_path, @headless, @difference_path]
+    end
+
+
+
+    def record_screenshot(version)
+
+      # to take a screenshot we have all parameters given from the methods above (or set to default values)
+      # selenium is started in
+      #   @headless or firefox
+      # and takes a screenshot of the urls
+      #   @baseurl/@url[0], @baseurl/@url[1], etc...
+      # and takes a screenshot for each url for all given resolutions
+      #   @resolutions[0], @resolutions[1], etc...
+      # and saves the screenshot in the file
+      #   @screenshot_path
+
+      browser = Browser.new(@baseurl, @urls, @resolutions, @screenshots_path, @headless)
+
+      # the only argument missing is if this is the "base" or "new" screenshot, this can be
+      # passed as an argument. The value does not need to be "base" or "new", but can be anything
+
+      browser.record(version)
+
+      # this will close the browser and terminate the headless environment
+
+      browser.end
+
+      # this flag is set, so that parameters like resolution or urls cannot be changed any more
+
+      @got_base_screenshots = true
+    end
+
+
+
+    def compare(base, new)
+
+      # this compares two previously taken screenshots
+      # the "base" and "new" variable need to be the same as previously assigned
+      # as "variable" in the method "record_screenshot"!
+      # all other information are constants and are passed along
+
+      @comparer = Comparer.new(base, new, @difference_path, @baseurl, @urls, @resolutions, @screenshots_path)
+
+      # this gives back an array, which as one element for each difference image.
+      # [ {diff_1}, {diff_2}, ...]
+      # while each diff is a hash with keys:
+      # {url: <url>, width: <width in px>, difference: <%of changed pixel>, base_file: <file path>, new_file: <file path>, diff_file: <file path>}
+
+      @comparer.difference
+    end
+
+    def save_json(path)
+
+      # json output can be saved if needed. A path is required to save the file
+
+      raise "screenshots need to be compared before json output can be gernerated" unless @comparer
+
+      # the array from @comparer.difference is saved as json
+
+      @comparer.json(path)
+
+    end
+
+  private
+
+    def raise_base_screenshots_taken(value)
+      if @got_base_screenshots
+        raise ArgumentError, "#{value} cannot be changed after first set of screenshots were taken"
+      end
+    end
+
+    def clean(urls)
+      urls.gsub(' ', '').gsub(';',',')
+    end
+
+  end
+
+end

data/lib/lineup/version.rb

@@ -0,0 +1,13 @@
+module Lineup
+  class Version
+    MAJOR = 0
+    MINOR = 1
+    PATCH = 0
+
+    class << self
+      def to_s
+        [MAJOR, MINOR, PATCH].join('.')
+      end
+    end
+  end
+end

data/lineup.gemspec

@@ -0,0 +1,16 @@
+require File.expand_path('../lib/lineup/version', __FILE__)
+
+Gem::Specification.new do |gem|
+  gem.authors = %w(Finn Lorbeer)
+  gem.version = Lineup::Version
+  gem.name = 'lineup'
+  gem.platform = Gem::Platform::RUBY
+  gem.require_paths = %w(lib)
+  gem.license = 'MIT'
+  gem.email = %w(finn.von.friesland@googlemail.com)
+  gem.summary = "lineup will help you in your automated design regression testing"
+  gem.description = %q{lineup takes to screenshots of your app and compares them to references in order to find design flaws in your new code.}
+  gem.homepage = 'https://www.otto.de'
+  gem.files = `git ls-files`.split("\n")
+
+end

data/tests/rspec/lineup_spec.rb

@@ -0,0 +1,217 @@
+require 'rspec'
+require 'dimensions'
+require 'fileutils'
+require 'json'
+require_relative '../../lib/lineup'
+
+describe '#screeshot_recorder' do
+
+  BASE_URL = 'https://www.otto.de'
+  SCREENSHOTS = "#{Dir.pwd}/screenshots/"
+
+  after(:each) { FileUtils.rmtree SCREENSHOTS }
+
+  it 'loads all configuration from a json file' do
+    # Given
+    file = "#{Dir.pwd}/test_configuration.json"
+    FileUtils.rm file if (File.exists? file)
+    json = '{"urls":"page1, page2","resolutions":"13,42","filepath_for_images":"some/path","use_phantomjs":true,"difference_path":"some/difference/image/path"}'
+    save_json(json, file)
+
+    # When
+    lineup = Lineup::Screenshot.new(BASE_URL)
+
+    # Then
+    expect(
+        lineup.load_json_config(file)
+    ).to eq([['page1', 'page2'], [13,42], 'some/path', true, 'some/difference/image/path'])
+
+    # cleanup:
+    FileUtils.rm file if (File.exists? file)
+  end
+
+  it 'opens a URL and takes mobile/tablet/desktop screenshots' do
+    # Given
+    lineup = Lineup::Screenshot.new(BASE_URL)
+
+    # When
+    lineup.record_screenshot('base')
+
+    # Then
+    expect(
+        File.exist? ("#{Dir.pwd}/screenshots/base_frontpage_640.png")
+    ).to be(true)
+    # And
+    expect(
+        File.exist? ("#{Dir.pwd}/screenshots/base_frontpage_800.png")
+    ).to be(true)
+    # And
+    expect(
+        File.exist? ("#{Dir.pwd}/screenshots/base_frontpage_1180.png")
+    ).to be(true)
+
+  end
+
+  it 'takes a screenshot a desired resolution' do
+    # Given
+    width = '320' #min width firefox as of Sep 2015
+    lineup = Lineup::Screenshot.new(BASE_URL)
+
+    # When
+    lineup.resolutions(width)
+
+    # Then
+    lineup.record_screenshot('base')
+    imagewidth = Dimensions.width("#{Dir.pwd}/screenshots/base_frontpage_#{width}.png")
+    expect(
+        imagewidth
+    ).to be < (width.to_i + 10) #depending on the browser:
+    # 'width' set the browser to a certain width. The browser itself may then have some frame/border
+    # that means, that the viewport is smaller than the width of the browser, thus the image will be a
+    # bit smaller then 'width'. To compensate it, we have a +10 here.
+
+  end
+
+  it 'takes screenshots of different pages, if specified' do
+    # Given
+    urls = '/, multimedia, sport'
+    lineup = Lineup::Screenshot.new(BASE_URL)
+    lineup.resolutions('1180')
+    lineup.urls(urls)
+
+    # When
+    lineup.record_screenshot('base')
+
+    # Then
+    expect(
+        File.exist? ("#{Dir.pwd}/screenshots/base_frontpage_1180.png")
+    ).to be(true)
+
+    expect(
+        File.exist? ("#{Dir.pwd}/screenshots/base_multimedia_1180.png")
+    ).to be(true)
+
+  end
+
+  it 'raises and exception if, parameters are changed after the base screenshot' do
+    # Given
+    lineup = Lineup::Screenshot.new(BASE_URL)
+    lineup.urls('/')
+    lineup.resolutions('400')
+
+    # When
+    lineup.record_screenshot('base')
+    expect{
+      lineup.use_phantomjs true
+
+      # Then
+    }.to raise_error ArgumentError
+
+  end
+
+  it 'compares a base and a new screenshot and detects no difference if images are the same' do
+    # Given
+    lineup = Lineup::Screenshot.new(BASE_URL)
+    lineup.urls('/shoppages/begood')
+    lineup.resolutions('400')
+    lineup.record_screenshot('base')
+    lineup.record_screenshot('new')
+
+    expect(
+      # When
+      lineup.compare('base', 'new')
+
+      # Then
+    ).to eq([])
+
+  end
+
+  it 'compares a base and a new screenshot and returns the difference if the images are NOT the same as json log' do
+    # Given
+    width = '600'
+    base_site = 'multimedia'
+    new_site = 'sport'
+    json_path = "#{Dir.pwd}"
+    json_file = "#{json_path}/log.json"
+
+    # And Given
+    lineup = Lineup::Screenshot.new(BASE_URL)
+    lineup.urls(base_site)
+    lineup.resolutions(width)
+    lineup.record_screenshot('base')
+    FileUtils.mv "#{Dir.pwd}/screenshots/base_#{base_site}_#{width}.png", "#{Dir.pwd}/screenshots/base_#{new_site}_#{width}.png"
+    # change the url and go to a different page, in this way we ensure a conflict and thus a result from the comparison
+    lineup = Lineup::Screenshot.new(BASE_URL)
+    lineup.urls(new_site)
+    lineup.resolutions(width)
+
+    # When
+    lineup.record_screenshot('new')
+
+    # Then
+    # the output will be similar to the values here:
+    # [
+    #   {
+    #     :url => 'sport',
+    #     :width => 600,
+    #     :difference => 0.7340442722738748,
+    #     :base_file => '/home/myname/lineup/tests/respec/screenshots/base_sport_600.png'
+    #     :new_file =>  '/home/myname/lineup/tests/respec/screenshots/new_sport_600.png'
+    #     :diff_file => '/home/myname/lineup/tests/rspec/screenshots/DIFFERENCE_sport_600.png'
+    #   }
+    # ]
+    #
+    expect(
+        (lineup.compare('base', 'new').first)[:url]
+    ).to eq('sport')
+    # And
+    expect(
+        (lineup.compare('base', 'new').first)[:width]
+    ).to eq(600)
+    # And
+    result = (lineup.compare('base', 'new').first)[:difference]
+    expect(
+        result
+    ).to be_within(15).of(20) # 'compare' returns the difference of pixel between the screenshots in %
+    # 15-20% of pixel works toady (12.3 on 2015/09) for the difference between sport and multimedia page of OTTO.de,
+    # but the pages may some day look more or less alike, then these values can be changed
+    # And
+    expect(
+        (lineup.compare('base', 'new').first)[:base_file]
+    ).to include("/lineup/tests/rspec/screenshots/base_sport_600.png")
+    # And
+    expect(
+        (lineup.compare('base', 'new').first)[:new_file]
+    ).to include("/lineup/tests/rspec/screenshots/new_sport_600.png")
+    # And
+    expect(
+        (lineup.compare('base', 'new').first)[:difference_file]
+    ).to include("/lineup/tests/rspec/screenshots/DIFFERENCE_sport_600.png")
+
+    # And When
+    lineup.save_json(json_path)
+    
+    # Then
+    expect(
+        File.exist? json_file
+    ).to be(true)
+    # And
+    expect(
+        File.read json_file
+    ).to include("\"difference\":#{result},")
+
+    # cleanup:
+    FileUtils.rm json_file if (File.exists? json_file)
+  end
+
+  private
+
+  def save_json(json, file)
+    file = File.open(
+        file, 'a'
+    )
+    file.write(json)
+    file.close
+  end
+
+end

metadata

@@ -0,0 +1,59 @@
+--- !ruby/object:Gem::Specification
+name: lineup
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Finn
+- Lorbeer
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2015-09-24 00:00:00.000000000 Z
+dependencies: []
+description: lineup takes to screenshots of your app and compares them to references
+  in order to find design flaws in your new code.
+email:
+- finn.von.friesland@googlemail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- Gemfile
+- Gemfile.lock
+- README.md
+- bin/lineup
+- doc/example.png
+- lib/controller/browser.rb
+- lib/controller/comparer.rb
+- lib/helper.rb
+- lib/lineup.rb
+- lib/lineup/version.rb
+- lineup.gemspec
+- tests/rspec/lineup_spec.rb
+homepage: https://www.otto.de
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.4.8
+signing_key: 
+specification_version: 4
+summary: lineup will help you in your automated design regression testing
+test_files: []