CI/CD
CI/CD Overview
Run Frontguard visual regression tests in continuous integration pipelines.
CI/CD Overview
Frontguard is designed to run in CI/CD pipelines. It auto-detects preview deployment URLs, posts PR comments with visual diffs, and returns proper exit codes for pass/fail gating.
Supported CI Providers
Frontguard works in any CI environment that supports Node.js. First-class support includes:
| Provider | Auto-detect Preview URL | PR Comments |
|---|---|---|
| GitHub Actions | ✅ | ✅ |
| Vercel | ✅ (via VERCEL_URL) | Via GitHub |
| Netlify | ✅ (via DEPLOY_PRIME_URL) | Via GitHub |
| Cloudflare Pages | ✅ (via CF_PAGES_URL) | Via GitHub |
| Railway | ✅ (via RAILWAY_STATIC_URL) | Via GitHub |
| Render | ✅ (via RENDER_EXTERNAL_URL) | Via GitHub |
| Others | Manual URL | JSON output |
Preview URL Auto-Detection
Frontguard automatically detects preview deployment URLs from environment variables set by popular hosting providers. The detection order is:
- Explicit
--urlflag (always wins) VERCEL_URL/VERCEL_PREVIEW_URLDEPLOY_PRIME_URL/DEPLOY_URL(Netlify)CF_PAGES_URL(Cloudflare Pages)RAILWAY_STATIC_URL(Railway)RENDER_EXTERNAL_URL(Render)
If no URL is detected, Frontguard warns you and exits. Always set the url input as a fallback.
Exit Codes
Frontguard uses standard exit codes for CI gating:
| Exit Code | Meaning | CI Result |
|---|---|---|
0 | All tests passed | ✅ Green |
1 | Regressions detected | ❌ Fail |
2 | Pipeline errors | ❌ Fail |
PR Comments
When GITHUB_TOKEN is set, Frontguard posts a PR comment with:
- Summary table of all tested routes
- Visual diff images (baseline vs current vs diff overlay)
- AI analysis with severity and explanation
- Suggested fixes when available
Reports
Every run generates artifacts you can upload:
- HTML report — Interactive side-by-side comparison
- JSON report — Machine-readable results
- Diff images — PNG overlays highlighting changes
Next Steps
- GitHub Actions — Step-by-step GitHub Actions setup