ci.yml

name: CI
on:
  push:
    branches:
      - main
  pull_request:

env:
  NX_PARALLEL: 2 # ubuntu-latest = 2-core CPU / 7 GB of RAM
  NX_VERBOSE_LOGGING: true

jobs:
  main:
    runs-on: ubuntu-latest
    permissions:
      contents: 'read'
      actions: 'read'

    steps:
      - uses: actions/checkout@v6
        with:
          fetch-depth: 0

      - name: Derive appropriate SHAs for base and head for `nx affected` commands
        uses: nrwl/nx-set-shas@3e9ad7370203c1e93d109be57f3b72eb0eb511b1 # v4.4.0

      - uses: actions/setup-node@v6
        with:
          cache: 'yarn'
          node-version: '20'

      - run: yarn install --immutable

      - name: 'Check duplicates in yarn.lock'
        run: yarn run dedupe --check --json

      - run: yarn check-dependencies

      - name: Install Playwright Browsers
        run: npx playwright install --with-deps

      - run: yarn nx affected --target=verify-integrity
      - run: yarn nx affected --target=build
      - run: yarn nx affected --target=build-storybook
      - run: yarn nx affected --target=type-check
      - run: yarn nx affected --target=lint
      - run: yarn nx affected --target=test
      - name: Playwright Component tests
        id: playwright-tests
        run: yarn nx affected --target=component-test --skipInstall
      - run: yarn nx format:check --base origin/main

      - name: Upload Playwright artifacts
        uses: actions/upload-artifact@v6
        if: always() && steps.playwright-tests.outcome == 'failure'
        with:
          name: playwright-traces
          path: dist/.playwright/**/*.zip
          include-hidden-files: true
          retention-days: 1

      - name: 'Check for unstaged changes'
        run: |
          git status --porcelain
          git diff-index --quiet HEAD -- || exit 1

  react_integration_tests:
    if: ${{ github.repository_owner == 'microsoft' }}
    runs-on: ubuntu-latest
    strategy:
      matrix:
        react: [17, 18, 19]
      fail-fast: false
    permissions:
      contents: 'read'
      actions: 'read'
    name: React ${{ matrix.react }} Integration
    steps:
      - uses: actions/checkout@v6
        with:
          fetch-depth: 0

      - name: Derive appropriate SHAs for base and head for `nx affected` commands
        uses: nrwl/nx-set-shas@3e9ad7370203c1e93d109be57f3b72eb0eb511b1 # v4.4.0
        with:
          main-branch-name: 'master'

      - uses: actions/setup-node@v6
        with:
          cache: 'yarn'
          node-version: '20'

      - run: echo number of CPUs "$(getconf _NPROCESSORS_ONLN)"

      - run: yarn install --immutable
      - name: Install Playwright Browsers
        run: npx playwright install --with-deps

      - name: Affected e2e:integration Projects
        id: affected_projects_e2e_count
        run: |
          affected_count=$(yarn --silent nx show projects -t e2e:integration --affected --verbose false | wc -l | tr -d ' ')
          echo "value=$affected_count" >> $GITHUB_OUTPUT

      - name: Affected test:integration Projects
        id: affected_projects_test_count
        run: |
          affected_count=$(yarn --silent nx show projects -t test:integration --affected --verbose false | wc -l | tr -d ' ')
          echo "value=$affected_count" >> $GITHUB_OUTPUT

      - name: Affected type-check:integration Projects
        id: affected_projects_type_check_count
        run: |
          affected_count=$(yarn --silent nx show projects -t type-check:integration --affected --verbose false | wc -l | tr -d ' ')
          echo "value=$affected_count" >> $GITHUB_OUTPUT

      - name: type-check (affected)
        id: type-check
        if: steps.affected_projects_type_check_count.outputs.value > 0
        run: yarn nx run-many -p react-${{ matrix.react }}-tests -t type-check:integration --nxBail
        continue-on-error: true

      - name: Prepare TSC logs
        if: always() && steps.type-check.outcome == 'failure'
        run: |
          mkdir -p tsc-logs
          yarn tsc -p apps/react-${{ matrix.react }}-tests/tsconfig.react-${{ matrix.react }}.json --listFilesOnly > tsc-logs/tsc-debug-files-map.md

      - name: Upload TSC logs
        if: always() && steps.type-check.outcome == 'failure'
        uses: actions/upload-artifact@v6
        with:
          name: typescript-react-${{ matrix.react }}
          path: tsc-logs
          retention-days: 1

      # run targets only on affected changes
      - name: e2e (affected)
        id: e2e
        if: steps.affected_projects_e2e_count.outputs.value > 0
        run: |
          yarn nx run-many -p react-${{ matrix.react }}-tests -t e2e:integration --nxBail
        continue-on-error: true

      # - name: Upload Playwright screenshots if exist
      #   uses: actions/upload-artifact@v6
      #   if: always() && steps.e2e.outcome == 'failure'
      #   with:
      #     name: cypress-screenshots-react-${{ matrix.react }}
      #     path: |
      #       apps/*/pw/screenshots/**/*.png
      #       packages/**/pw/screenshots/**/*.png
      #     retention-days: 1

      # run targets only on affected changes
      - name: test (affected)
        id: test
        if: steps.affected_projects_test_count.outputs.value > 0
        # need to run this outside nx runner context to avoid https://github.com/nrwl/nx/issues/30562
        run: |
          yarn jest -c apps/react-${{ matrix.react }}-tests/jest.config.ts
        continue-on-error: true

      - name: Integration tests summary
        if: always()
        run: |
          echo "### React ${{ matrix.react }} Integration Tests Results" >> $GITHUB_STEP_SUMMARY
          echo "" >> $GITHUB_STEP_SUMMARY
          echo "- Type-check: ${{ steps.type-check.outcome }}" >> $GITHUB_STEP_SUMMARY
          echo "- E2E: ${{ steps.e2e.outcome }}" >> $GITHUB_STEP_SUMMARY
          echo "- Test: ${{ steps.test.outcome }}" >> $GITHUB_STEP_SUMMARY

          # Treat skipped steps as successful since they indicate no affected projects
          type_check_success=$([[ "${{ steps.type-check.outcome }}" == "success" || "${{ steps.type-check.outcome }}" == "skipped" ]] && echo "true" || echo "false")
          e2e_success=$([[ "${{ steps.e2e.outcome }}" == "success" || "${{ steps.e2e.outcome }}" == "skipped" ]] && echo "true" || echo "false")
          test_success=$([[ "${{ steps.test.outcome }}" == "success" || "${{ steps.test.outcome }}" == "skipped" ]] && echo "true" || echo "false")

          if [[ "$type_check_success" == "true" && "$e2e_success" == "true" && "$test_success" == "true" ]]; then
            echo "✅ React ${{ matrix.react }} integration tests passed"
            exit 0
          else
            echo "❌ React ${{ matrix.react }} integration tests failed"
            echo "Type-check: ${{ steps.type-check.outcome }}"
            echo "E2E: ${{ steps.e2e.outcome }}"
            echo "Test: ${{ steps.test.outcome }}"
            exit 1
          fi