test.yml

name: test

on:
  push:
    branches:
      - main
  pull_request:

# Add concurrency group to cancel in-progress runs
concurrency:
  group: ${{ github.workflow }}-${{ github.ref }}
  cancel-in-progress: true

env:
  CARGO_TERM_COLOR: always
  RUST_VERSION: 1.85.0

jobs:
  ts:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20.x
      - uses: actions/cache@v4
        with:
          path: ~/.pnpm-store
          key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
          restore-keys: |
            ${{ runner.os }}-pnpm-
      - uses: pnpm/action-setup@v4
        with:
          run_install: |
            - args: [--frozen-lockfile]
      - name: Clean iframe dist directory
        run: rm -rf packages/controller/dist
      - run: pnpm build
      - name: Run tests with coverage
        run: pnpm test:ci --coverage
        env:
          NODE_OPTIONS: --max-old-space-size=16384
      - uses: codecov/codecov-action@v3
        with:
          token: ${{ secrets.CODECOV_TOKEN }}
          files: coverage/lcov.info

  storybook:
    # On push events, skip the job if the head commit message contains the snapshot update indicator.
    if: >
      github.event_name != 'push' || !contains(github.event.head_commit.message,
      'chore: update storybook snapshots')
    runs-on: ubuntu-22.04
    container:
      image: ghcr.io/cartridge-gg/controller/storybook-env:sha-f1c10ea
    permissions:
      contents: "write"
      id-token: "write"
      pull-requests: "write"
    steps:
      - uses: actions/checkout@v4
      - name: Configure Git
        run: |
          git config --global user.name 'github-actions[bot]'
          git config --global user.email 'github-actions[bot]@users.noreply.github.com'
          git config --global --add safe.directory '*'

      - uses: dorny/paths-filter@v3
        id: changes
        with:
          filters: |
            ui:
              - '.github/workflows/test.yml'
              - 'packages/keychain/**'
              - '**/package.json'
              - '**/pnpm-lock.yaml'

      - if: steps.changes.outputs.ui == 'true'
        uses: actions/cache@v4
        with:
          path: |
            ~/.pnpm-store
            **/node_modules
          key:
            ${{ runner.os }}-storybook-${{ hashFiles('**/pnpm-lock.yaml') }}-${{
            github.sha }}
          restore-keys: |
            ${{ runner.os }}-storybook-${{ hashFiles('**/pnpm-lock.yaml') }}-
            ${{ runner.os }}-storybook-

      - run: pnpm i --frozen-lockfile
      - run: pnpm build
      - run: pnpm test:storybook:update
        id: test-storybook
        continue-on-error: true

      - name: Update and commit snapshots
        id: update-snapshots
        run: |
          # Check if there are any changes to commit
          if ! git diff --quiet packages/*/__image_snapshots__/; then
            # Configure committer identity using secrets
            git config --global user.email "tarrence@vanas.family"
            git config --global user.name "Tarrence van As"

            git add packages/*/__image_snapshots__/
            git commit -m "chore: update storybook snapshots"

            # Reset any potential lingering changes before pulling
            git reset --hard HEAD

            # Use a personal access token with workflow permissions to trigger CI
            # Pull latest changes before pushing
            git pull --rebase https://x-access-token:${{ secrets.STORYBOOK_COMMITTER }}@github.com/${{ github.repository }} "${{ github.head_ref }}"
            git push https://x-access-token:${{ secrets.STORYBOOK_COMMITTER }}@github.com/${{ github.repository }} HEAD:"${{ github.head_ref }}"

            # Set output to indicate we made changes
            echo "changes_committed=true" >> "$GITHUB_ENV"
          else
            echo "changes_committed=false" >> "$GITHUB_ENV"
            echo "No visual differences found - skipping remaining visual test steps"
            exit 0
          fi

      # Check for visual differences and collect info
      - name: Check for visual differences
        if: env.changes_committed == 'true'
        id: check-diffs
        run: |
          # Set test status based on previous step
          if [ "${{ steps.test-storybook.outcome }}" == "failure" ]; then
            echo "test_failed=true" >> "$GITHUB_ENV"
            echo "test_error=$(cat /tmp/test-error.txt 2>/dev/null || echo 'Test failed')" >> "$GITHUB_ENV"
          fi

          # Configure git safety
          git config --global --add safe.directory '*'

          # Fetch the base branch first
          git fetch origin "${{ github.base_ref }}"

          touch diff_info.txt

          # Function to check diffs and PR snapshot changes
          check_snapshots() {
            local pkg=$1
            local dir=$2
            
            # Check for snapshot changes in the PR
            git diff --name-only "origin/${{ github.base_ref }}" | grep "^${dir}/.*\.png$" | while read -r file; do
              if [ -f "$file" ]; then
                echo "${pkg}:${file}:update" >> diff_info.txt
              fi
            done
          }

          # Check both packages
          check_snapshots "keychain" "packages/keychain/__image_snapshots__"

          # Set environment variables
          if [ -s diff_info.txt ]; then
            echo "snapshot_failed=true" >> "$GITHUB_ENV"
            echo "diff_files<<EOF" >> "$GITHUB_ENV"
            cat diff_info.txt >> "$GITHUB_ENV"
            echo "EOF" >> "$GITHUB_ENV"
          else
            echo "snapshot_failed=false" >> "$GITHUB_ENV"
          fi

      # Upload diff images to GCP
      - uses: "google-github-actions/auth@v2"
        if: env.changes_committed == 'true'
        with:
          project_id: c7e-prod
          workload_identity_provider: "projects/276773611885/locations/global/workloadIdentityPools/github/providers/controller-repo"

      - uses: "google-github-actions/upload-cloud-storage@v2"
        if: env.changes_committed == 'true' && env.snapshot_failed == 'true'
        id: upload-diffs
        with:
          path: "packages"
          destination:
            "c7e-prod-static/gh/visual-diffs/${{ github.repository }}/${{
            github.event.pull_request.number }}"
          glob: "*/__image_snapshots__/**"
          parent: false

      # Create PR comment with results
      - uses: actions/github-script@v7
        if:
          env.changes_committed == 'true' && github.event_name == 'pull_request'
        with:
          script: |
            const fs = require('fs');

            let comment = '### 🎨 Visual Regression Test Results\n\n';

            // Add test execution status
            if (process.env.test_failed === 'true') {
              comment += '⚠️ Tests completed with some issues:\n';
              comment += '```\n' + process.env.test_error + '\n```\n\n';
            }

            const testStatus = process.env.snapshot_failed === 'true' 
              ? '❌ Visual differences detected'
              : '✅ No visual changes detected';
            comment += `${testStatus}\n\n`;

            if (process.env.snapshot_failed === 'true') {
              const diffFiles = process.env.diff_files.split('\n').filter(Boolean);
              
              // Group changes by package and type
              const changes = {
                'keychain': { updates: [] },
              };
              
              // Process all files
              diffFiles.forEach(diff => {
                const [pkg, path, type] = diff.split(':');
                if (path && fs.existsSync(path)) {
                  const fileName = path.split('/').pop();
                  const storyName = fileName.replace('.png', '').replace('-diff', '');
                  const imageUrl = `https://static.cartridge.gg/gh/visual-diffs/${process.env.GITHUB_REPOSITORY}/${context.payload.pull_request.number}/${pkg}/__image_snapshots__/${fileName}`;
                  changes[pkg].updates.push({ storyName, imageUrl });
                }
              });
              
              // Generate comment sections for each package
              let hasAnyChanges = false;
              let allImages = '';
              
              for (const [pkg, pkgChanges] of Object.entries(changes)) {
                if (pkgChanges.updates.length > 0) {
                  hasAnyChanges = true;
                  comment += `\n#### 📦 ${pkg}\n\n`;
                  comment += '##### 🔄 Snapshot Updates in PR\n\n';
                  comment += 'The following snapshots have been updated in this PR:\n\n';
                  
                  pkgChanges.updates.forEach(({ storyName, imageUrl }) => {
                    comment += `- \`${storyName}\`\n`;
                    allImages += `### ${pkg} - ${storyName}\n\n`;
                    allImages += `![${storyName}](${imageUrl})\n\n`;
                  });
                }
              }
              
              if (hasAnyChanges) {
                comment += '\n<details><summary>🖼️ View All Image Changes</summary>\n\n';
                comment += allImages;
                comment += '</details>\n\n';
              }
            }

            await github.rest.issues.createComment({
              issue_number: context.issue.number,
              owner: context.repo.owner,
              repo: context.repo.repo,
              body: comment
            });

      # Modify the final check step to handle different failure types
      - name: Check for failures
        if: always() # Run this step even if previous steps failed
        run: |
          echo "Test Storybook Outcome: ${{ steps.test-storybook.outcome }}"
          echo "Snapshot Failed (changes detected in PR diff): ${{ env.snapshot_failed }}"

          # Case 1: Storybook tests passed
          if [[ "${{ steps.test-storybook.outcome }}" == "success" ]]; then
            echo "Storybook tests passed. Job successful."
            exit 0
          fi

          # Case 2: Storybook tests failed
          if [[ "${{ steps.test-storybook.outcome }}" == "failure" ]]; then
            # Subcase 2a: Failure was ONLY due to snapshot differences (which were updated)
            if [[ "${{ env.snapshot_failed }}" == "true" ]]; then
              echo "Visual differences detected and snapshots updated. Job successful."
              exit 0
            # Subcase 2b: Failure was due to other reasons
            else
              echo "Storybook tests failed for reasons other than snapshot differences. Failing job."
              exit 1 # Explicitly fail the job
            fi
          fi

          # Fallback case (should not typically be reached)
          echo "Unknown state encountered in failure check. Defaulting to success."
          exit 0