visual-regression.yml

name: "Chromatic"

on: [pull_request]

jobs:
  cypress:
    name: Run Cypress for visual regression testing
    runs-on: ubuntu-latest
    container:
      image: cypress/browsers:latest
      options: --user 1001
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - name: Build InstUI
        run: npm ci && npm run bootstrap
      - name: Install dependencies
        run: npm ci
        working-directory: regression-test
      - name: Run Cypress tests
        uses: cypress-io/github-action@v6
        env:
          ELECTRON_EXTRA_LAUNCH_ARGS: "--remote-debugging-port=9222"
        with:
          start: npm run dev
          working-directory: regression-test
      - name: Upload cypress artifact for chromatic
      - uses: actions/upload-artifact@v4
        with:
          name: test-results
          path: regression-test/cypress/downloads
          retention-days: 30

  chromatic:
    name: Run Chromatic
    needs: cypress
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - uses: actions/setup-node@v4
        with:
          node-version: 22.12.0
      - name: Install dependencies
        run: npm ci
        working-directory: regression-test
      - name: Download Cypress test results
        uses: actions/download-artifact@v4
        with:
          name: test-results
          path: regression-test/cypress/downloads
      - name: Run Chromatic
        uses: chromaui/action@latest
        with:
          cypress: true
          projectToken: ${{ secrets.CHROMATIC_APP_CODE }}
          workingDir: regression-test
        env:
          CHROMATIC_ARCHIVE_LOCATION: ./cypress/downloads