CI integration
Use our SDK plugins in Playwright, Cypress, or Puppeteer—or compare pre-captured PNGs via CLI and GitHub Actions.
1. API key
Create a key under Settings → API Keys (Pro plan). Send it as X-API-Key.
2. SDK plugins
@pixellpeep/playwright, @pixellpeep/cypress, @pixellpeep/puppeteer, or @pixellpeep/client for custom runners. Env: PIXELLPEEP_API, PIXELLPEEP_API_KEY, PIXELLPEEP_PROJECT_ID.
import { test } from '@pixellpeep/playwright';
test('login', async ({ page, pixellpeep }) => {
await page.goto('https://your-app.example/login');
await pixellpeep.snapshot('login-page');
});Each plugin ships with setup instructions for Cypress, Puppeteer, and cloud baselines. See the tutorial for a full walkthrough.
3. CLI
Install the CLI globally from npm:
npm install -g pixellpeep
Then run comparisons directly:
pixellpeep compare --api-url https://api.pixellpeep.com --api-key qv_your_key --baseline baseline.png --current current.png --project-id 1 --build-id $GITHUB_RUN_ID --branch $GITHUB_REF_NAME
Exits 0 when identical, 1 when differences found.
4. GitHub Action
Drop the CLI into a GitHub Actions step to gate pull requests. A ready-to-copy example workflow is included with the CLI package.
5. Manifest (many screens, one PR check)
pixellpeep compare-manifest --manifest comparisons.json --project-id 1 --api-key qv_your_key --github-token $GITHUB_TOKEN --github-owner $GITHUB_REPOSITORY_OWNER --github-repo my-repo --github-sha $GITHUB_SHA
On failure: open the check link → approve baseline → re-run.