Use Argos with Drone CI
Configure Drone CI to send screenshots to Argos visual testing platform.
1. Install Argos CLI
- npm
- yarn
- pnpm
- bun
npm i --save-dev @argos-ci/cli
yarn add --dev @argos-ci/cli
pnpm add --save-dev @argos-ci/cli
bun add --dev @argos-ci/cli
Read the CLI documentation if you need information about advanced usages.
2. Expose ARGOS_TOKEN
as environment variable
- Log in to Argos, navigate to your project settings and copy your
ARGOS_TOKEN
. - In your DroneCI repository go to Secrets.
- Add a new secret called
argos_token
and paste the value you copied in the previous step. - Source the environment variable from the named secret.
kind: pipeline
name: default
steps:
- name: build
image: alpine
environment:
ARGOS_TOKEN:
from_secret: argos_token
If you are not comfortable with exposing environment variables, read Drone CI documentation.
3. Upload the screenshots
Add the following command to your CI workflow to upload screenshots to Argos:
- npm
- yarn
- pnpm
- bun
npm exec argos upload ./screenshots
yarn run argos upload ./screenshots
pnpm exec argos upload ./screenshots
bun x argos upload ./screenshots
Complete example
.drone.yml
kind: pipeline
type: docker
name: default
steps:
# 👉 Insert the steps required to take screenshots
- name: Upload screenshots to argos-ci.com
commands:
# 👇 change "./screenshots" by your screenshots folder path
- npm exec argos upload ./screenshots
secrets: [ARGOS_TOKEN]
For a repository examples, check out our GitHub repository.
What's next?
Congratulations on installing Argos! 🎉
The next step is to integrate visual review into your development workflow. Visit our review changes section to learn how to.