Because we don’t have a pull request identifier environment variable, the Percy integration is limited in it’s ability to generate screenshot comparisons over time.
About Percy
Percy is a visual testing tool that lets you take screenshots, monitor visual changes, and require team approval to these visual captures in an automated way as part of your CI/CD pipeline.
By using Percy you can easily test your UI without complex browser testing overhead.
Their documentation does a great job of providing more information, in addition to the setup instructions below.
CloudBees CodeShip Pro
Setting Your Percy Variables
You will need to add a value that Percy provides when you create a new
project inside their application - PERCY_TOKEN
- to the
encrypted environment variables that you encrypt and include in your
codeship-services.yml file.
Static Sites
To use Percy with static sites inside Docker images on CloudBees CodeShip Pro, you
will need to install the percy-cli
gem inside your images, either as
part of a Gemfile or by adding the following command to the Dockerfile:
RUN gem install percy-cli
Note that this will require you to be building an image that contains
both Ruby and Rubygems. If the image does not contain both of these, you
will be unable to install the necessary percy-capybara
gem.
From there, you will need to add the following command as a step or inside of a script in your codeship-steps.yml file:
- service: your_service command: percy snapshot directory_to_snapshot
Note that you can use multiple commands to take snapshots of multiple directories, and that the directories must contain HTML files.
Ruby
To integrate Percy with CloudBees CodeShip Pro on a Ruby and Docker project, you
will want to install the you will need to install the percy-capybara
gem inside your images, either as part of a Gemfile or by adding the
following command to the Dockerfile:
RUN gem install percy-capybara
Note that this will require you to be building an image that contains
both Ruby and Rubygems. If the image does not contain both of these, you
will be unable to install the necessary percy-cli
gem.
From there, you will need to add specific hooks to your Rspec, Capybara, Minitest, or any other test specs you may have. You can find specific instructions for calling Percy from your test specs at the Percy documentation.
These test specs will be called via your codeship-steps.yml file.
Ember
To integrate Percy with CloudBees CodeShip Pro on an Ember and Docker project, you
will want to install the ember-percy
package into your application,
typically via your package.json
.
From there, you will need to add specific hooks in to your project’s test specs. You can find specific instructions for calling Percy from your test specs at the Percy documentation.
These test specs will be called via your codeship-steps.yml file.
CloudBees CodeShip Basic
Setting Your Percy Variables
You will need to add a value that Percy provides when you create a new
project inside their application - PERCY_TOKEN
- to your project’s
environment variables.
You can do this by navigating to Project Settings and then clicking on the Environment tab.
Static Sites
To use Percy with static sites on CloudBees CodeShip Basic, you will need to
install the percy-cli
gem, either in your
setup commands or in your Gemfile
itself. You can install the gem with the
command:
gem install percy-cli
From there, you will need to add the following command to your test commands:
percy snapshot directory_to_snapshot
Note that you can use multiple commands to take snapshots of multiple directories, and that the directories must contain HTML files.
Ruby
To integrate Percy with CloudBees CodeShip Basic on a Ruby project, you will want
to install the percy-capybara
gem in either your
setup commands or your Gemfile. You can install the gem with the command:
gem install percy-capybara
From there, you will need to add specific hooks to your Rspec, Capybara, Minitest, or any other test specs you may have. You can find specific instructions for calling Percy from your test specs at the Percy documentation.
Ember
To integrate Percy with CloudBees CodeShip Basic on an Ember project, you will
want to install the ember-percy
package by adding the following to
your
setup commands:
ember install ember-percy
From there, you will need to add specific hooks in to your test specs. You can find specific instructions for calling Percy from your test specs at the Percy documentation.