{"id":13411836,"url":"https://github.com/wearefriday/spectre","last_synced_at":"2025-03-14T17:31:11.728Z","repository":{"id":5538107,"uuid":"53410008","full_name":"wearefriday/spectre","owner":"wearefriday","description":"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)","archived":true,"fork":false,"pushed_at":"2022-05-29T01:25:19.000Z","size":1089,"stargazers_count":458,"open_issues_count":0,"forks_count":73,"subscribers_count":23,"default_branch":"master","last_synced_at":"2024-04-16T07:04:16.482Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/wearefriday.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-03-08T12:23:49.000Z","updated_at":"2023-09-08T17:07:53.000Z","dependencies_parsed_at":"2022-08-28T08:00:27.039Z","dependency_job_id":null,"html_url":"https://github.com/wearefriday/spectre","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wearefriday%2Fspectre","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wearefriday%2Fspectre/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wearefriday%2Fspectre/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wearefriday%2Fspectre/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wearefriday","download_url":"https://codeload.github.com/wearefriday/spectre/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243618673,"owners_count":20320274,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-07-30T20:01:17.403Z","updated_at":"2025-03-14T17:31:09.895Z","avatar_url":"https://github.com/wearefriday.png","language":"Ruby","funding_links":[],"categories":["Ruby","Tools and frameworks (a-z↓)","Tools and frameworks"],"sub_categories":[],"readme":"# Spectre is no longer being maintained here\n\nSpectre hasn't seen active development for some time. We've found a lot more mileage from https://percy.io which is easy to use and zero maintenance.\n\nAlternatively try a fork with active development:\n* https://github.com/lanej0/spectre\n* https://github.com/octanner/spectre\n\n# Spectre\n\n[![Build Status](https://travis-ci.org/wearefriday/spectre.svg?branch=master)](https://travis-ci.org/wearefriday/spectre)\n\nSpectre is a web application to diff screenshots. It's heavily influenced by [VisualReview](https://github.com/xebia/VisualReview), [BackstopJS](https://github.com/garris/BackstopJS) and [Wraith](https://github.com/BBC-News/wraith). Read more about how we use it at Friday in our blog post: [How we do visual regression testing](https://medium.com/friday-people/how-we-do-visual-regression-testing-af63fa8b8eb1).\n\n![Spectre!](spectre_screenshot_1.png)\n![Spectre!](spectre_screenshot_2.png)\n\n## Running the app\n\nYou can either run the app using [docker](https://www.docker.com), or you can run it natively on your machine – there are instructions for both docker,\nand running on macOS below.\n\nAlternatively, you can run the application on [Heroku](https://www.heroku.com/).\n\n### Running using docker\n\nInstall [docker](https://www.docker.com/products/docker)\n\nSetup the database (only needs to be done once):\n\n    docker-compose run --rm app bundle exec rake db:setup\n\nTo run the application:\n\n    docker-compose up\n\nWhen you see `WEBrick::HTTPServer#start: pid=2 port=3000`, the app will be running at http://localhost:3000\n\n### Running natively on macOS\n\n#### Prerequisites\n\n* Ruby (doesn't currently work with v2.4.0)\n* Postgres\n* Imagemagick\n\nOn a Mac, the easiest way to install the above, is to use [homebrew](http://brew.sh/).\n\n1. install homebrew using [these instructions](http://brew.sh/)\n1. `brew install rbenv`\n1. `rbenv install 2.7.1`\n1. `rbenv init` and follow the instructions it prints\n1. `brew install imagemagick@6`\n1. `brew install postgresql` and follow the instructions it prints about starting the postgresql server\n\n#### Setup\n\n* Clone the repo\n* `bundle install \u0026\u0026 bundle exec rake db:setup`\n* `bundle exec rails s`\n\n### Running on Heroku:\n\n[![Deploy to Heroku](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy)\n\n## Submitting tests\n\nA \"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.\n\nFirst you should create a new \"run\". The JSON response will contain the `run_id` to submit with each subsequent test.\n\n    POST /runs\n      project: My Project Name\n      suite: My Suite Name\n\nThen you can submit a screenshot!\n\n    POST /tests\n      test:\n        run_id: {run_id from above},\n        name: Homepage,\n        platform: OSX,\n        browser: PhantomJS,\n        size: 1024,\n        screenshot: \u003cFile\u003e,\n        crop_area: '640x480+50+100'\n\n* `name` is a friendly name of your test. It should describe the template, component or state of the thing you've screenshotted\n* `platform` is the OS/platform that the screenshot was taken on (e.g. OSX, Windows, iOS, Android etc.)\n* `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\n* `size` is the screenshot size\n* `screenshot` is the image itself. PNGs are preferred\n* `crop_area` allows to specify a bounding box to crop from uploaded screenshot (\"\u003cwidth\u003ex\u003cheight\u003e+\u003ctop_left_x\u003e+\u003ctop_left_y\u003e\"). If not specified, full screenshot is used for comparison. Can be used to perform visual diffs for specific page elements.\n\n### Integration with Rake tasks or Cucumber\n\nMost 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](https://github.com/wearefriday/spectre_client) to upload screenshots to your Spectre gem.\n\n## Example test run\n\nAn example test run can be executed using:\n\n    docker-compose run --rm app bin/demo_test_run http://app:3000\n\nor, if not using docker, first install [phantomjs](http://phantomjs.org/) (`brew install phantomjs`), then run:\n\n    bin/demo_test_run http://localhost:3000\n\nIf you've deployed the app on heroku, you can replace the URL with the hosted one, e.g.:\n\n    docker-compose run --rm app bin/demo_test_run https://your-spectre-install.herokuapp.com\n    # or\n    bin/demo_test_run https://your-spectre-install.herokuapp.com\n\n## Administration\n\nSpectre 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.\n\n## Contributing\n\n### Tests\n\n[Rspec](http://rspec.info/) and [Cucumber](https://cucumber.io) are included in the project.\nTest coverage is minimal but please don't follow our lead, write tests for anything you add. Use `rake` to run the existing tests.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwearefriday%2Fspectre","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwearefriday%2Fspectre","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwearefriday%2Fspectre/lists"}