Skip to content

A simple UI for browsing and inspecting diffs, and an API for runner scripts to submit screenshots to and receive a pass or fail in real time. (For use with Wraith, Backstop, Selenium etc)

License

Notifications You must be signed in to change notification settings

lucygeneric/spectre

Repository files navigation

Spectre

Spectre is a web application to diff screenshots. It's heavily influence by VisualReview, BackstopJS and Wraith. Read more about how we use it at Friday in our blog post: How we do visual regression testing.

Spectre! Spectre!

Requirements

  • Ruby
  • Postgres
  • Imagemagick

Setup

  • Clone the repo
  • bundle exec rake db:create && bundle exec rake db:schema:load
  • bundle exec rails s
  • Copy .env.example and rename to .env. Change the url details if you need to.

Alternatively:

Deploy to Heroku

Submitting tests

A "test" is a screenshot and associated metadata. A test is categorised under a Project, which in turn has (test) Suites. A test is submitted and associated with a "run" of a suite.

First you should create a new "run". The JSON response will contain the run_id to submit with each subsequent test.

POST /runs
  project: My Project Name
  suite: My Suite Name

Then you can submit a screenshot!

POST /tests
  test:
    run_id: {run_id from above},
    name: Homepage,
    platform: OSX,
    browser: PhantomJS,
    width: 1024,
    screenshot: <File>
  • name is a friendly name of your test. It should describe the template, component or state of the thing you've screenshotted
  • platform is the OS/platform that the screenshot was taken on (e.g. OSX, Windows, iOS, Android etc.)
  • browser is the browser that was used to render the screenshot. This will usually be a headless webkit such as Phantom, but if using Selenium you may have used a "real" browser
  • width is the screenshot size
  • screenshot is the image itself. PNGs are preferred

Integration with Rake tasks or Cucumber

Most of the time you'll want to use your own rake task to control Selenium and take screenshots, or take screenshots during cucumber step definitions. There's a handy spectre_client gem to upload screenshots to your Spectre gem.

Dummy tests

An example test run can be executed using:

bundle exec rake screenshots

Administration

Spectre doesn't provide a UI or API to edit or delete content. We've included rails_admin, so head to /admin for this. By default there is no password.

Tests

Rspec and Cucumber are included in the project. Test coverage is minimal but please don't follow our lead, write tests for anything you add. Use rspec && rake cucumber to run the existing tests.

About

A simple UI for browsing and inspecting diffs, and an API for runner scripts to submit screenshots to and receive a pass or fail in real time. (For use with Wraith, Backstop, Selenium etc)

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Ruby 68.1%
  • HTML 12.7%
  • JavaScript 12.0%
  • CSS 6.7%
  • Gherkin 0.5%