utopia-ui/.github/workflows/test.e2e.yml

name: test:e2e

on: push

jobs:
  cypress-e2e-tests:
    name: Run E2E Tests
    runs-on: ubuntu-latest
    outputs:
      tests-failed: ${{ steps.cypress-tests.outcome == 'failure' || steps.report-results.outputs.test_failed == 'true' }}
      tests-outcome: ${{ steps.cypress-tests.outcome }}
      test_failed: ${{ steps.report-results.outputs.test_failed }}
    steps:
      - name: Checkout code
        uses: actions/checkout@ff7abcd0c3c05ccf6adc123a8cd1fd4fb30fb493 # v5.0.0

      - name: Set up Node.js
        uses: actions/setup-node@89d709d423dc495668cd762a18dd4a070611be3f # v5.0.0
        with:
          node-version-file: ./.tool-versions
          cache: 'npm'
          cache-dependency-path: |
            app/package-lock.json
            lib/package-lock.json
            cypress/package-lock.json

      - name: Build Library
        run: |
          npm ci
          npm run build
        working-directory: ./lib

      - name: Build Frontend
        run: |
          cp .env.dist .env
          sed -i '/VITE_DIRECTUS_ADMIN_ROLE=/c\VITE_DIRECTUS_ADMIN_ROLE=8141dee8-8e10-48d0-baf1-680aea271298' .env
          npm ci
          npm run build
        working-directory: ./app

      - name: Clean Database State
        run: |
          # Remove any existing database data to ensure fresh state
          sudo rm -rf ./data/database
          mkdir -p ./data/uploads
          sudo chmod 777 -R ./data

      - name: Build and start all Containers
        run: docker compose up -d

      - name: Wait for Directus to be Ready
        run: |
          echo "Waiting for Directus API to be ready..."
          timeout 120 bash -c 'until curl -f http://localhost:8055/server/health; do echo "Waiting for Directus..."; sleep 5; done'
          echo "Directus is ready!"

      - name: Seed Backend
        run: |
          mkdir -p ./data/uploads
          sudo chmod 777 -R ./data
          cd backend && ./push.sh && ./seed.sh
        working-directory: ./

      - name: Wait for Application to be Ready
        run: |
          echo "Waiting for application to be ready..."
          timeout 300 bash -c 'until curl -f http://localhost:8080/login; do sleep 5; done'
          echo "Application is ready!"

      - name: Health Check
        run: |
          echo "Frontend health check:"
          curl -f http://localhost:8080/login || exit 1
          echo "Backend health check:"
          curl -f http://localhost:8055/server/health || exit 1

      - name: Install Cypress Dependencies
        run: npm ci
        working-directory: ./cypress

      - name: Setup Display Environment for Parallel Tests
        run: |
          echo "Setting up display environment for parallel Cypress execution..."

          # Kill any existing Xvfb processes to ensure clean state
          sudo pkill Xvfb || true

          # Remove any existing lock files
          sudo rm -f /tmp/.X*-lock || true

          # Ensure xvfb is available
          which xvfb-run || (sudo apt-get update && sudo apt-get install -y xvfb)

          echo "Display environment setup complete"

      - name: Run E2E Tests
        id: cypress-tests
        run: |
          # Override the npm script to use xvfb-run with display isolation
          SPEC_COUNT=$(find e2e -name "*.cy.ts" | wc -l)
          echo "Running $SPEC_COUNT test chunks in parallel with display isolation"

          # Array to store background process PIDs
          declare -a pids=()

          # Launch parallel processes with isolated displays
          for i in $(seq 0 $((SPEC_COUNT-1))); do
            echo "Starting Cypress chunk $((i + 1))/$SPEC_COUNT on display :$((100 + i))"
            (
              SPLIT="$SPEC_COUNT" SPLIT_INDEX="$i" SPLIT_SUMMARY=false \
              xvfb-run --server-num="$((100 + i))" \
                       --server-args="-screen 0 1280x720x24 -ac +extension GLX +render -noreset" \
                       npx cypress run --e2e --browser chromium
            ) &
            pids+=($!)
          done

          # Wait for all background processes and collect exit codes
          exit_code=0
          for pid in "${pids[@]}"; do
            if ! wait "$pid"; then
              echo "Process $pid failed"
              exit_code=1
            fi
          done

          echo "All parallel test processes completed"

          # Exit with failure if any test failed
          if [ $exit_code -ne 0 ]; then
            echo "❌ Some tests failed"
            exit 1
          else
            echo "✅ All tests passed"
          fi
        working-directory: ./cypress
        env:
          # Disable individual cypress-split summaries to avoid conflicts
          SPLIT_SUMMARY: false

      - name: Upload test artifacts on failure
        if: failure()
        uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
        with:
          name: cypress-test-results-${{ github.run_id }}
          path: |
            cypress/results/
            cypress/screenshots/
          retention-days: 7
          if-no-files-found: warn

  process-test-reports:
    name: Process Test Reports
    runs-on: ubuntu-latest
    needs: cypress-e2e-tests
    if: failure() && needs.cypress-e2e-tests.result == 'failure'
    steps:
      - name: Checkout code
        uses: actions/checkout@ff7abcd0c3c05ccf6adc123a8cd1fd4fb30fb493 # v5.0.0

      - name: Setup Node.js
        uses: actions/setup-node@89d709d423dc495668cd762a18dd4a070611be3f # v5.0.0
        with:
          node-version: '20'
          cache: 'npm'
          cache-dependency-path: cypress/package-lock.json

      - name: Install dependencies
        run: npm ci
        working-directory: ./cypress

      - name: Download test artifacts
        uses: actions/download-artifact@4a24838f3d5601fd639834081e118c2995d51e1c # v5.0.0
        with:
          name: cypress-test-results-${{ github.run_id }}
          path: ./cypress

      - name: Merge JSON reports into one consolidated report
        run: ./scripts/merge-reports.sh
        working-directory: ./cypress

      - name: Generate HTML report with screenshots
        run: ./scripts/generate-html-report.sh
        working-directory: ./cypress

      - name: Create simple index page
        run: ./scripts/create-index-page.sh
        working-directory: ./cypress
        env:
          GITHUB_RUN_ID: ${{ github.run_id }}
          GITHUB_SHA: ${{ github.sha }}

      - name: Upload consolidated test report
        uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
        with:
          name: e2e-test-report-${{ github.run_id }}
          path: cypress/results/html/
          retention-days: 14
          if-no-files-found: warn

      - name: Upload raw test data (for debugging)
        if: failure()
        uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
        with:
          name: e2e-raw-data-${{ github.run_id }}
          path: |
            cypress/results/
            cypress/screenshots/
            cypress/videos/
          retention-days: 7
          if-no-files-found: warn