frontend.yml

name: frontend

on:
  push:
    branches:
      - master
  pull_request:

# Cancel in progress workflows on pull_requests.
# https://docs.github.com/en/actions/using-jobs/using-concurrency#example-using-a-fallback-value
concurrency:
  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
  cancel-in-progress: true

# hack for https://github.com/actions/cache/issues/810#issuecomment-1222550359
env:
  SEGMENT_DOWNLOAD_TIMEOUT_MINS: 3
  NODE_OPTIONS: '--max-old-space-size=5120'

jobs:
  files-changed:
    name: detect what files changed
    runs-on: ubuntu-24.04
    timeout-minutes: 3
    # Map a step output to a job output
    outputs:
      testable_modified: ${{ steps.changes.outputs.testable_modified }}
      testable_rules_changed: ${{ steps.changes.outputs.testable_rules_changed }}
      frontend_all: ${{ steps.changes.outputs.frontend_all }}
      frontend_all_files: ${{ steps.changes.outputs.frontend_all_files }}
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
        with:
          fetch-depth: 1

      - name: Check for frontend file changes
        uses: dorny/paths-filter@0bc4621a3135347011ad047f9ecf449bf72ce2bd # v3.0.0
        id: changes
        with:
          token: ${{ github.token }}
          filters: .github/file-filters.yml
          list-files: shell

  typescript:
    if: needs.files-changed.outputs.frontend_all == 'true'
    needs: files-changed
    name: typescript
    runs-on: ubuntu-24.04
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7

      - uses: ./.github/actions/setup-node-pnpm

      # Setup custom TypeScript matcher, see https://github.com/actions/setup-node/issues/97
      - name: setup matchers
        run: |
          echo "::remove-matcher owner=masters::"
          echo "::add-matcher::.github/tsc.json"

      - name: tsc
        id: tsc
        run: pnpm run typecheck

  eslint:
    if: needs.files-changed.outputs.frontend_all == 'true'
    needs: files-changed
    name: eslint
    runs-on: ubuntu-24.04
    timeout-minutes: 15
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
        with:
          fetch-depth: ${{ github.event_name == 'pull_request' && '100' || '1' }}

      - uses: ./.github/actions/setup-node-pnpm

      # Setup custom eslint matcher, see https://github.com/actions/setup-node/issues/97
      - name: setup matchers
        run: |
          echo "::remove-matcher owner=masters::"
          echo "::add-matcher::.github/eslint-stylish.json"

      # Decide whether to lint just the PR's impacted files or everything (see
      # frontend-changed-scope.sh): we scope to impacted files only when a merge base
      # resolves and every changed file lives under static/, otherwise we lint everything —
      # global config or dependency changes can't be traced from source files.
      - name: Compute lint strategy
        id: strategy
        run: ./.github/workflows/scripts/frontend-changed-scope.sh >> "$GITHUB_OUTPUT"

      - name: eslint (all files)
        id: eslint
        if: steps.strategy.outputs.scope == 'full'
        run: pnpm run lint:js

      # Lint just the files transitively impacted by the PR. Diff the merge base against
      # HEAD^2 (the PR head) so we only seed on the PR's own changes. Diffing against the
      # working tree (the merge commit) would also pull in everything that landed on master
      # since the fork point.
      - name: eslint (impacted files)
        id: eslint-impacted
        if: steps.strategy.outputs.scope == 'scoped'
        run: pnpm exec run-on-changed --since "$MERGE_BASE..HEAD^2" -- eslint --concurrency=3 --no-warn-ignored
        env:
          MERGE_BASE: ${{ steps.strategy.outputs.merge_base }}
          DEBUG: 'run-on-changed:*'

  knip:
    if: needs.files-changed.outputs.frontend_all == 'true'
    needs: files-changed
    name: knip
    runs-on: ubuntu-24.04
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7

      - uses: ./.github/actions/setup-node-pnpm

      # Setup custom eslint matcher, see https://github.com/actions/setup-node/issues/97
      - name: setup matchers
        run: |
          echo "::remove-matcher owner=masters::"
          echo "::add-matcher::.github/eslint-stylish.json"

      - name: knip
        id: knip
        run: pnpm run knip

      - name: knip-prod
        id: knip-prod
        run: pnpm run knip:prod

  jest-config:
    if: needs.files-changed.outputs.testable_rules_changed == 'true' || needs.files-changed.outputs.testable_modified == 'true'
    name: Configure Jest
    runs-on: ubuntu-24.04
    timeout-minutes: 3
    needs: files-changed
    outputs:
      jest_test_matrix: ${{ steps.jest_test_config.outputs.jest_test_matrix }}
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
        name: Checkout sentry
        with:
          # PRs need history for git merge-base to find the fork point.
          fetch-depth: ${{ github.event_name == 'pull_request' && '100' || '1' }}

      - uses: ./.github/actions/setup-node-pnpm

      # On PRs, HEAD is the merge commit; its parents (HEAD^1, HEAD^2) are base and head.
      # Merge base of those two determines which tests to run via --findRelatedTests.
      # If merge base can't be computed or non-frontend files changed, the full
      # test suite runs instead.
      - name: Jest Test Config
        id: jest_test_config
        env:
          FRONTEND_ALL_FILES: ${{ needs.files-changed.outputs.frontend_all_files }}
        run: ./.github/workflows/scripts/jest-test-config.sh

      - name: Upload jest test file list
        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # 4.6.2
        with:
          name: jest-test-files
          path: jest-test-files.json
          if-no-files-found: ignore
          retention-days: 1

  jest-tests:
    if: needs.files-changed.outputs.testable_rules_changed == 'true' || needs.files-changed.outputs.testable_modified == 'true'
    needs: [files-changed, jest-config]
    name: Jest
    # If you change the runs-on image, you must also change the runner in jest-balance.yml
    # so that the balancer runs in the same environment as the tests.
    runs-on: ubuntu-24.04
    timeout-minutes: 30
    strategy:
      # This helps not having to run multiple jobs because one fails, thus, reducing resource usage
      # and reducing the risk that one of many runs would turn red again (read: intermittent tests)
      fail-fast: false
      matrix: ${{ fromJson(needs.jest-config.outputs.jest_test_matrix) }}

    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
        name: Checkout sentry

      - uses: ./.github/actions/setup-node-pnpm

      - name: jest transform cache
        uses: actions/cache@1bd1e32a3bdc45362d1e726936510720a7c30a57 # v4.2.0
        with:
          path: |
            .cache/jest
            ~/.cache/swc
          key: jest-cache-${{ runner.os }}-${{ hashFiles('pnpm-lock.yaml', 'jest.config.ts') }}-${{ matrix.index }}
          restore-keys: |
            jest-cache-${{ runner.os }}-${{ hashFiles('pnpm-lock.yaml', 'jest.config.ts') }}-
            jest-cache-${{ runner.os }}-

      - name: Download jest-test-files.json
        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4.3.0
        with:
          name: jest-test-files
          path: .

      - name: Download jest-balance.json
        id: download-artifact
        uses: dawidd6/action-download-artifact@ac66b43f0e6a346234dd65d4d0c8fbb31cb316e5 # v11
        with:
          workflow: 38531594 # jest-balancer.yml
          workflow_conclusion: success # The conclusion of the workflow we're looking for
          branch: master # The branch we're looking for
          name: jest-balance.json # Artifact name
          name_is_regexp: false
          path: tests/js/test-balancer/ # Directory where to extract artifact(s), defaults to the current directory
          search_artifacts: true # Search for the last workflow run whose stored the artifact we're looking for
          if_no_artifact_found: warn # Can be one of: "fail", "warn", "ignore"

      - name: jest
        env:
          SENTRY_DSN: ${{ secrets.SENTRY_JEST_DSN }}

          CI_NODE_TOTAL: ${{ matrix.total }}
          CI_NODE_INDEX: ${{ matrix.index }}

          GITHUB_PR_SHA: ${{ github.event.pull_request.head.sha || github.sha }}
          GITHUB_PR_REF: ${{ github.event.pull_request.head.ref || github.ref }}

          # Disable testing-library from printing out any of of the DOM to
          # stdout. No one actually looks through this in CI, they're just
          # going to run it locally.
          #
          # This quiets up the logs quite a bit.
          DEBUG_PRINT_LIMIT: 0

          # When the "Frontend: Rerun Flaky Tests" label is on the PR,
          # tests wrapped with it.isKnownFlake() run 50x to validate fixes.
          RERUN_KNOWN_FLAKY_TESTS: "${{ contains(github.event.pull_request.labels.*.name, 'Frontend: Rerun Flaky Tests') }}"
        run: pnpm run test-ci --forceExit

  form-field-registry:
    if: needs.files-changed.outputs.frontend_all == 'true'
    needs: files-changed
    name: form field registry
    runs-on: ubuntu-24.04
    steps:
      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7

      - uses: ./.github/actions/setup-node-pnpm

      - name: Generate form field registry
        run: node scripts/extractFormFields.ts

      - name: Check for changes
        run: |
          if ! git diff --exit-code static/app/components/core/form/generatedFieldRegistry.ts; then
            echo ""
            echo "❌ Form field registry is out of sync!"
            echo ""
            echo "Run the following command and commit the changes:"
            echo "  node scripts/extractFormFields.ts"
            echo ""
            exit 1
          fi

  # This check runs once all dependant jobs have passed
  # It symbolizes that all required Frontend checks have succesfully passed (Or skipped)
  # This check is the only required Github check
  frontend-required-check:
    needs:
      [
        files-changed,
        jest-config,
        jest-tests,
        typescript,
        eslint,
        knip,
        form-field-registry,
      ]
    name: Frontend
    # This is necessary since a failed/skipped dependent job would cause this job to be skipped
    if: always()
    runs-on: ubuntu-24.04
    steps:
      # If any jobs we depend on fail, we will fail since this is a required check
      # NOTE: A timeout is considered a failure
      - name: Check for failures
        if: contains(needs.*.result, 'failure') || contains(needs.*.result, 'cancelled')
        run: |
          echo "One of the dependent jobs have failed. You may need to re-run it." && exit 1