CI/CD Integration

Automate visual generation on every commit to ensure documentation never goes stale.

Quick Setup

Run the CI setup wizard to generate workflow files:

Terminal

reshot ci

This generates configuration for:

GitHub Actions
GitLab CI
CircleCI

GitHub Actions

Manual Configuration

Create .github/workflows/reshot.yml:

YAML

name: Visual Docs
on: [push]

jobs:
  reshot:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: "20"

      - name: Install dependencies
        run: npm ci

      - name: Install Reshot
        run: npm install -g @reshot/cli

      - name: Start application
        run: npm run dev &

      - name: Wait for app
        run: npx wait-on http://localhost:3000

      - name: Run scenarios
        run: reshot run --headless
        env:
          RESHOT_API_KEY: ${{ secrets.RESHOT_API_KEY }}

      - name: Publish assets
        run: reshot publish --force
        env:
          RESHOT_API_KEY: ${{ secrets.RESHOT_API_KEY }}

Required Secrets

Add to your repository secrets:

Secret	Description
`RESHOT_API_KEY`	API key from Project Settings
`AWS_ACCESS_KEY_ID`	For S3 storage (if using BYOS)
`AWS_SECRET_ACCESS_KEY`	For S3 storage (if using BYOS)

GitLab CI

Create .gitlab-ci.yml:

YAML

reshot:
  image: node:20
  script:
    - npm ci
    - npm install -g @reshot/cli
    - npm run dev &
    - npx wait-on http://localhost:3000
    - reshot run --headless
    - reshot publish --force
  variables:
    RESHOT_API_KEY: $RESHOT_API_KEY

Environment Variables

Variable	Description
`RESHOT_API_KEY`	API authentication token
`CI`	Set to `true` in most CI environments
`RESHOT_HEADLESS`	Force headless mode

Best Practices

Visual changes are reported, not blocked. By default, Reshot posts a PR comment summarizing visual changes rather than blocking the merge. This gives visibility without slowing down hotfixes.

Cache dependencies: Speed up builds by caching node_modules
Run on feature branches: Catch visual changes early
Use GitHub Integration: Get notified of visual changes via PR comments
Parallelize: Run multiple scenarios concurrently with --concurrency

The Jobs Monitor tracking CI capture and publish jobs in progress

Governance Modes

Reshot supports two governance modes in project settings:

Mode	Behavior
`notify` (default)	Posts a PR comment with visual changes summary. Non-blocking.
`blocking`	Posts a commit status that requires approval. Use for strict governance.

Triggering on Specific Paths

Only run when relevant files change:

YAML

on:
  push:
    paths:
      - "src/**"
      - "docsync.config.json"