config.yml

version: 2.1
orbs:
  aws-cli: circleci/aws-cli@4.2.3
  aws-s3: circleci/aws-s3@4.1.0

parameters:
  browserstack-force:
    description: Whether to force browserstack usage. We have limited resources on browserstack so the pipeline might decide to skip browserstack if this parameter isn't set to true.
    type: boolean
    default: false
  react-version:
    description: The version of react to be used
    type: string
    default: stable
  workflow:
    description: The name of the workflow to run
    type: string
    default: pipeline
  e2e-base-url:
    description: The base url for running end-to-end test
    type: string
    default: ''

default-job: &default-job
  parameters:
    react-version:
      description: The version of react to be used
      type: string
      default: << pipeline.parameters.react-version >>
    test-gate:
      description: A particular type of tests that should be run
      type: string
      default: undefined
    e2e-base-url:
      description: The base url for running end-to-end test
      type: string
      default: << pipeline.parameters.e2e-base-url >>
  environment:
    # expose it globally otherwise we have to thread it from each job to the install command
    BROWSERSTACK_FORCE: << pipeline.parameters.browserstack-force >>
    REACT_VERSION: << parameters.react-version >>
    TEST_GATE: << parameters.test-gate >>
    AWS_REGION_ARTIFACTS: eu-central-1
    COREPACK_ENABLE_DOWNLOAD_PROMPT: '0'
  working_directory: /tmp/base-ui
  docker:
    - image: cimg/node:18.20

default-context: &default-context
  context:
    - org-global

# CircleCI has disabled the cache across forks for security reasons.
# Following their official statement, it was a quick solution, they
# are working on providing this feature back with appropriate security measures.
# https://discuss.circleci.com/t/saving-cache-stopped-working-warning-skipping-this-step-disabled-in-configuration/24423/21
#
# restore_repo: &restore_repo
#   restore_cache:
#     key: v1-repo-{{ .Branch }}-{{ .Revision }}

commands:
  install_js:
    parameters:
      browsers:
        type: boolean
        default: false
        description: 'Set to true if you intend to any browser (for example with playwright).'
      react-version:
        description: The version of react to be used
        type: string
        default: stable

    steps:
      - when:
          condition: << parameters.browsers >>
          steps:
            - run:
                name: Install pnpm package manager
                command: corepack enable
      - when:
          condition:
            not: << parameters.browsers >>
          steps:
            - run:
                name: Install pnpm package manager
                # See https://stackoverflow.com/a/73411601
                command: corepack enable --install-directory ~/bin

      - run:
          name: Resolve React version
          command: |
            echo 'Using React version: << parameters.react-version >>'
            node scripts/useReactVersion.mjs
            # log a patch for maintainers who want to check out this change
            git --no-pager diff HEAD

      - run:
          name: View install environment
          command: |
            node --version
            pnpm --version
      - when:
          condition:
            equal: [<< parameters.react-version >>, stable]
          steps:
            - run:
                name: Install JS dependencies
                command: pnpm install
      - unless:
          condition:
            equal: [<< parameters.react-version >>, stable]
          steps:
            - run:
                name: Install JS dependencies (without frozen lockfile)
                command: pnpm install --no-frozen-lockfile
            - run:
                name: Restore clean working copy
                command: git restore .

jobs:
  checkout:
    <<: *default-job
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - when:
          # Install can be "dirty" when running with non-default versions of React
          condition:
            equal: [<< parameters.react-version >>, stable]
          steps:
            - run:
                name: Should not have any git not staged
                command: git add -A && git diff --exit-code --staged
            - run:
                name: '`pnpm dedupe` was run?'
                command: |
                  # #default-branch-switch
                  if [[ $(git diff --name-status master | grep -E 'pnpm-workspace\.yaml|pnpm-lock.yaml|package\.json') == "" ]];
                  then
                      echo "No changes to dependencies detected. Skipping..."
                  else
                      pnpm dedupe --check
                  fi
  test_unit:
    <<: *default-job
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: Run tests on JSDOM
          command: pnpm test:jsdom --coverage
      - run:
          name: Check if coverage report is generated
          command: |
            if ! [[ -s coverage/lcov.info ]]
            then
              exit 1
            fi
      - run:
          name: Upload coverage report to Codecov
          command: |
            curl -Os https://uploader.codecov.io/latest/linux/codecov
            chmod +x codecov
            ./codecov -t ${CODECOV_TOKEN} -Z -F "$REACT_VERSION-jsdom"
  test_lint:
    <<: *default-job
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: Eslint
          command: pnpm eslint:ci
      - run:
          name: Stylelint
          command: pnpm stylelint
      - run:
          name: Lint JSON
          command: pnpm jsonlint
      - run:
          name: Lint Markdown
          command: pnpm markdownlint
  test_static:
    <<: *default-job
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: '`pnpm prettier` changes committed?'
          command: pnpm prettier --check
      - run:
          name: Generate PropTypes
          command: pnpm proptypes
      - run:
          name: '`pnpm proptypes` changes committed?'
          command: git add -A && git diff --exit-code --staged
      - run:
          name: Generate the documentation
          command: pnpm docs:api
      - run:
          name: '`pnpm docs:api` changes committed?'
          command: git add -A && git diff --exit-code --staged
      - run:
          name: '`pnpm extract-error-codes` changes committed?'
          command: |
            pnpm extract-error-codes
            git add -A && git diff --exit-code --staged
      - run:
          name: '`pnpm docs:link-check` changes committed?'
          command: |
            pnpm docs:link-check
            git add -A && git diff --exit-code --staged
  test_types:
    <<: *default-job
    resource_class: 'medium+'
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: Tests TypeScript definitions
          command: pnpm typescript
          environment:
            NODE_OPTIONS: --max-old-space-size=3072
      - run:
          name: Any defect declaration files?
          command: node scripts/testBuiltTypes.mjs
      - save_cache:
          name: Save generated declaration files
          key: typescript-declaration-files-{{ .Branch }}-{{ .Revision }}
          paths:
            # packages with generated declaration files
            - packages/react/build
  test_types_next:
    <<: *default-job
    resource_class: 'medium+'
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: Resolve typescript version
          command: |
            pnpm add typescript@next -d -w
            # log a patch for maintainers who want to check out this change
            git --no-pager diff HEAD
      - run:
          name: Tests TypeScript definitions
          command: |
            # ignore build failures
            # it's expected that typescript@next fails since the lines of the errors
            # change frequently. This build is monitored regardless of its status
            set +e
            pnpm typescript
            exit 0
      - restore_cache:
          name: Restore generated declaration files
          keys:
            # We assume that the target branch is `master` and that declaration files are persisted in commit order.
            # "If there are multiple matches, the most recently generated cache will be used."
            - typescript-declaration-files-master
      - run:
          name: Diff declaration files
          command: |
            git add -f packages/react/build || echo 'Base UI declarations do not exist'
            pnpm -r build:types
            git --no-pager diff
      - run:
          name: Log defect declaration files
          command: |
            # ignore build failures
            # Fixing these takes some effort that isn't viable to merge in a single PR.
            # We'll simply monitor them for now.
            set +e
            node scripts/testBuiltTypes.mjs
            exit 0
  test_browser:
    <<: *default-job
    resource_class: 'medium+'
    docker:
      - image: mcr.microsoft.com/playwright:v1.49.1-noble
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
          browsers: true
      - run:
          name: Run tests on headless Chromium
          command: pnpm test:chromium --coverage
      - run:
          name: Check if coverage report is generated
          command: |
            if ! [[ -s coverage/lcov.info ]]
            then
              exit 1
            fi
      - run:
          name: Upload coverage report to Codecov
          command: |
            curl -Os https://uploader.codecov.io/latest/linux/codecov
            chmod +x codecov
            ./codecov -t ${CODECOV_TOKEN} -Z -F "$REACT_VERSION-browser"
      - store_artifacts:
          # hardcoded in karma-webpack
          path: /tmp/_karma_webpack_
          destination: artifact-file
  test_profile:
    <<: *default-job
    docker:
      - image: mcr.microsoft.com/playwright:v1.49.1-noble
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
          browsers: true
      - run:
          name: Tests real browsers
          # Run a couple of times for a better sample.
          # TODO: hack something together where we can compile once and run multiple times e.g. by abusing watchmode.
          command: |
            # Running on chrome only since actual times are innaccurate anyway
            # The other reason is that browserstack allows little concurrency so it's likely that we're starving other runs.
            pnpm test:karma:profile --browsers chrome,chromeHeadless
            pnpm test:karma:profile --browsers chrome,chromeHeadless
            pnpm test:karma:profile --browsers chrome,chromeHeadless
            pnpm test:karma:profile --browsers chrome,chromeHeadless
            pnpm test:karma:profile --browsers chrome,chromeHeadless
      # Persist reports for inspection in https://mui-dashboard.netlify.app/
      - store_artifacts:
          # see karma.conf.profile.js reactProfilerReporter.outputDir
          path: tmp/react-profiler-report/karma
          destination: react-profiler-report/karma
  test_regressions:
    <<: *default-job
    docker:
      - image: mcr.microsoft.com/playwright:v1.49.1-noble
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
          browsers: true
      - run:
          name: Run visual regression tests
          command: xvfb-run pnpm test:regressions
      - run:
          name: Upload screenshots to Argos CI
          command: pnpm test:argos
  test_e2e:
    <<: *default-job
    docker:
      - image: mcr.microsoft.com/playwright:v1.49.1-noble
    steps:
      - checkout
      - install_js:
          browsers: true
      - run:
          name: pnpm test:e2e
          command: pnpm test:e2e
  test_bundle_size_monitor:
    <<: *default-job
    steps:
      - checkout
      - install_js
      - run:
          name: Run danger on PRs
          command: pnpm danger ci --fail-on-errors
      # TODO test bundle size https://github.com/mui/base-ui/issues/201
  test_package:
    <<: *default-job
    steps:
      - checkout
      - install_js:
          react-version: << parameters.react-version >>
      - run:
          name: Build packages
          command: pnpm release:build
      - run:
          name: Verify built packages
          command: pnpm -r test:package

workflows:
  version: 2
  pipeline:
    when:
      equal: [pipeline, << pipeline.parameters.workflow >>]
    jobs:
      - checkout:
          <<: *default-context
      - test_unit:
          <<: *default-context
          name: 'JSDOM tests'
          requires:
            - checkout
      - test_lint:
          <<: *default-context
          requires:
            - checkout
      - test_static:
          <<: *default-context
          requires:
            - checkout
      - test_types:
          <<: *default-context
          name: 'Typechecking'
          requires:
            - checkout
      - test_browser:
          <<: *default-context
          name: 'Browser tests'
          requires:
            - checkout
      - test_regressions:
          <<: *default-context
          name: 'Regression tests'
          requires:
            - checkout
      - test_e2e:
          <<: *default-context
          requires:
            - checkout
      - test_bundle_size_monitor:
          <<: *default-context
          requires:
            - checkout
      - test_package:
          <<: *default-context
          requires:
            - checkout
  profile:
    when:
      equal: [profile, << pipeline.parameters.workflow >>]
    jobs:
      - test_profile:
          <<: *default-context
  react-17:
    triggers:
      - schedule:
          cron: '0 0 * * *'
          filters:
            branches:
              only:
                - master
    jobs:
      - test_unit:
          <<: *default-context
          react-version: ^17.0.0
      - test_browser:
          <<: *default-context
          react-version: ^17.0.0
      - test_regressions:
          <<: *default-context
          react-version: ^17.0.0
  react-18:
    when:
      equal: [pipeline, << pipeline.parameters.workflow >>]
    jobs:
      - test_unit:
          <<: *default-context
          name: 'JSDOM tests (React 18)'
          react-version: '^18'
      - test_browser:
          <<: *default-context
          name: 'Browser tests (React 18)'
          react-version: '^18'
      - test_regressions:
          <<: *default-context
          name: 'Regression tests (React 18)'
          react-version: '^18'
      - test_types:
          <<: *default-context
          name: 'Typechecking (React 18)'
          react-version: '^18'
  typescript-next:
    triggers:
      - schedule:
          cron: '0 0 * * *'
          filters:
            branches:
              only:
                - master
    jobs:
      - test_types_next:
          <<: *default-context
          name: 'Typechecking (typescript@next)'