ci-frontend.yml

name: Frontend CI

on:
    pull_request:
    push:
        branches:
            - master

concurrency:
    group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
    cancel-in-progress: true

jobs:
    # Job to decide if we should run frontend ci
    # See https://github.com/dorny/paths-filter#conditional-execution for more details
    # we skip each step individually, so   they are still reported as success
    # because many of them are required for CI checks to be green
    changes:
        runs-on: ubuntu-latest
        timeout-minutes: 5
        name: Determine need to run frontend checks
        outputs:
            frontend: ${{ steps.filter.outputs.frontend }}
        steps:
            # For pull requests it's not necessary to check out the code, but we
            # also want this to run on master, so we need to check out
            - uses: actions/checkout@v3

            - uses: dorny/paths-filter@v2
              id: filter
              with:
                  filters: |
                      frontend:
                        # Avoid running frontend tests for irrelevant changes
                        # NOTE: we are at risk of missing a dependency here. 
                        - 'bin/**'
                        - 'frontend/**'
                        # Make sure we run if someone is explicitly change the workflow
                        - .github/workflows/ci-frontend.yml
                        # various JS config files
                        - .eslintrc.js
                        - .prettier*
                        - babel.config.js
                        - jest.*.ts
                        - tsconfig.json
                        - tsconfig.*.json
                        - webpack.config.js
                        - postcss.config.js
                        - stylelint*

    frontend-code-quality:
        name: Code quality checks
        needs: changes
        # kea typegen and typescript:check need some more oomph
        runs-on: ubuntu-latest
        steps:
            # we need at least one thing to run to make sure we include everything for required jobs
            - uses: actions/checkout@v3

            - name: Install pnpm
              if: needs.changes.outputs.frontend == 'true'
              uses: pnpm/action-setup@v2
              with:
                  version: 8.x.x

            - name: Set up Node.js
              if: needs.changes.outputs.frontend == 'true'
              uses: actions/setup-node@v3
              with:
                  node-version: 18

            - name: Get pnpm cache directory path
              if: needs.changes.outputs.frontend == 'true'
              id: pnpm-cache-dir
              run: echo "PNPM_STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT

            - uses: actions/cache@v3
              if: needs.changes.outputs.frontend == 'true'
              id: pnpm-cache
              with:
                  path: ${{ steps.pnpm-cache-dir.outputs.PNPM_STORE_PATH }}
                  key: ${{ runner.os }}-pnpm-cypress-${{ hashFiles('pnpm-lock.yaml') }}
                  restore-keys: ${{ runner.os }}-pnpm-cypress-

            - name: Install package.json dependencies with pnpm
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm install --frozen-lockfile

            - name: Check formatting with prettier
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm prettier:check

            - name: Lint with Stylelint
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm lint:css

            - name: Generate logic types and run typescript with strict
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm typegen:write && pnpm typescript:check

            - name: Lint with ESLint
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm lint:js

            - name: Check if "schema.json" is up to date
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm schema:build:json && git diff --exit-code

            - name: Check toolbar bundle size
              if: needs.changes.outputs.frontend == 'true'
              uses: preactjs/compressed-size-action@v2
              with:
                  build-script: 'build'
                  compression: 'none'
                  pattern: 'frontend/dist/toolbar.js'

    jest:
        runs-on: ubuntu-latest
        needs: changes
        name: Jest test (${{ matrix.chunk }})

        strategy:
            # If one test fails, still run the others
            fail-fast: false
            matrix:
                chunk: [1, 2, 3]

        steps:
            # we need at least one thing to run to make sure we include everything for required jobs
            - uses: actions/checkout@v3

            - name: Install pnpm
              if: needs.changes.outputs.frontend == 'true'
              uses: pnpm/action-setup@v2
              with:
                  version: 8.x.x

            - name: Set up Node.js
              if: needs.changes.outputs.frontend == 'true'
              uses: actions/setup-node@v3
              with:
                  node-version: 18
                  cache: pnpm

            - name: Install package.json dependencies with pnpm
              if: needs.changes.outputs.frontend == 'true'
              run: pnpm install --frozen-lockfile

            - name: Test with Jest
              # set maxWorkers or Jest only uses 1 CPU in GitHub Actions
              run: pnpm test:unit --maxWorkers=2 --shard=${{ matrix.chunk }}/3
              if: needs.changes.outputs.frontend == 'true'
              env:
                  NODE_OPTIONS: --max-old-space-size=6144