diffux / diffux / 480
99%
master: 98%

LAST BUILD BRANCH: rspec
DEFAULT BRANCH: master
Ran
Jobs 2
Files 24
Run time 31s
Badge
Embed ▾
README BADGES
x

If you need to use a raster PNG badge, change the '.svg' to '.png' in the link

Markdown

Textile

RDoc

HTML

Rst
480

push

travis-ci

trotzig 
Experimental: Add rspec-matcher `look_like_before`

I've been playing around with creating an RSpec matcher that can help
you keep track of the visual appearance of your app. A couple of
examples:

Example: Check for regressions on an entire page.

describe 'The start page' do
  context 'on a mobile device' do
    it 'has no visual regressions' do
      expect('/').to look_like_before(at_width: 320)
    end
  end

  context 'on a laptop' do
    it 'has no visual regressions' do
      expect('/').to look_like_before(at_width: 1000)
    end
  end
end

Example: Check for regressions to a particular component on a page.

describe 'Button component' do
  it 'has no visual regressions' do
    expect('/components/button').to look_like_before(crop_selector: '.button')
  end
end

The first time an example using this matcher is run, it will always
pass. When it does that, a baseline image is created. This baseline
image is then supposed to be commited to the repository. Next time you
run the spec a new snapshot image is created and compared with the
stored baseline. If it's different, the spec fails and a diff image is
created. If you made an intended change, you can simply ditch the diff
image and replace the baseline.

Tricky workflow? Perhaps. I want to give this a spin before it is
added to documentation and "released".

Suggested next steps:
 - Break out the matcher into its own gem, e.g. "diffux-rspec".
 - Add more examples from the Diffux UI.

450 of 455 relevant lines covered (98.9%)

148.53 hits per line

Jobs
ID Job ID Ran Files Coverage
1 480.1 (2.0.0) 0
98.9
 Travis Job 480.1
2 480.2 (2.1.0) 0
98.9
 Travis Job 480.2
Source Files on build 480
Detailed source file information is not available for this build.