ci.yml

name: ci

on:
  pull_request:
    types: [opened, reopened, synchronize, edited]

jobs:
  setup:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 🛎
        uses: actions/checkout@v4

      - name: Setup node env 🏗
        uses: actions/setup-node@v4
        with:
          node-version: 20
          check-latest: true
          cache: 'npm'

      - name: Install dependencies 👨🏻‍💻
        run: npm ci

      - name: Run linter 👀
        run: npm run lint

      - name: Run tests 🧪
        run: npm run test-unit
  e2e:
    needs: setup
    runs-on: 'ubuntu-latest'
    strategy:
      fail-fast: false # https://github.com/cypress-io/github-action/issues/48
      matrix:
        containers: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

    steps:
      - name: Checkout 🛎
        uses: actions/checkout@v4
      - name: Setup node env 🏗
        uses: actions/setup-node@v4
        with:
          node-version: 20
          check-latest: true
          cache: 'npm'

      - name: Install LocalTunnel
        run: npm install -g localtunnel
      - name: Start LocalTunnel for localhost:8080 🌍
        run: lt --port 8080 > localtunnel_url.txt &
      - name: Display LocalTunnel public URL
        run: |
          sleep 5
          cat localtunnel_url.txt
          curl https://loca.lt/mytunnelpassword

      - name: Cypress run
        uses: cypress-io/github-action@v6
        with:
          install: true
          start: npm run serve
          wait-on: http://localhost:8080/js/app.js
          config-file: cypress.config.js
          spec: "tests/e2e/specs/**/*"
          record: true
          parallel: true
          browser: chrome
        env:
          # For recording and parallelization to work you must set your CYPRESS_RECORD_KEY
          # in GitHub repo → Settings → Secrets → Actions
          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
          # Creating a token https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token
          GITHUB_TOKEN: ${{ secrets.GIT_TOKEN }}
          COMMIT_INFO_MESSAGE: ${{ github.event.pull_request.title }}
      - name: Upload Cypress Screenshots
        uses: actions/upload-artifact@v4
        # Only capture images on failure
        if: failure()
        with:
          name: cypress-screenshots
          path: tests/e2e/screenshots

      - name: Upload Cypress Videos
        uses: actions/upload-artifact@v4
        # Only capture videos on failure
        if: failure()
        with:
          name: cypress-videos
          path: tests/e2e/videos

      - name: Prepare coverage
        run: mkdir coverage && mv .nyc_output/out.json coverage/coverage-${{ matrix.containers }}.json

      - name: Archive code coverage
        uses: actions/upload-artifact@v4
        with:
          name: coverage-${{ matrix.containers }}
          path: ./coverage/coverage-${{ matrix.containers }}.json
  coverage:
    needs: e2e
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 🛎
        uses: actions/checkout@v4

      - name: Setup node env 🏗
        uses: actions/setup-node@v4
        with:
          node-version: 20
          check-latest: true
          cache: 'npm'

      - name: Install dependencies 👨🏻‍💻
        run: npm ci
      - name: Create reports folder
        run: mkdir reports .nyc_output
      - name: Download all workflow run artifacts
        uses: actions/download-artifact@v4
        with:
          path: reports
          merge-multiple: true
      - run: ls -R reports
      - name: Run Coverage
        run: |
          npx nyc merge reports
          mv coverage.json .nyc_output/out.json
      - name: Create coverage report
        run: npx nyc report --reporter html --reporter text --reporter json-summary --reporter lcov
      - name: Store Artifacts
        uses: actions/upload-artifact@v4
        with:
          name: code-coverage-report
          path: |
            cypress-coverage
            .nyc_output
            reports
  sonarqube:
    needs: coverage
    name: Scan
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0  # Shallow clones should be disabled for a better relevancy of analysis
      - name: Download artifact
        uses: actions/download-artifact@v4
        with:
          name: code-coverage-report
      - name: Fix code coverage paths
        working-directory: ./cypress-coverage
        run: |
          sed -i 's@'$GITHUB_WORKSPACE'@/github/workspace/@g' lcov.info
      - uses: sonarsource/sonarqube-scan-action@master
        env:
          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
          SONAR_HOST_URL: ${{ secrets.SONAR_HOST_URL }}
      # If you wish to fail your job when the Quality Gate is red, uncomment the
      # following lines. This would typically be used to fail a deployment.
      # We do not recommend to use this in a pull request. Prefer using pull request
      # decoration instead.
      # - uses: sonarsource/sonarqube-quality-gate-action@master
      #   timeout-minutes: 5
      #   env:
      #     SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
  build:
    needs: e2e
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 🛎
        uses: actions/checkout@v4
      - name: Setup node env 🏗
        uses: actions/setup-node@v4
        with:
          node-version: 20
          check-latest: true
          cache: 'npm'

      - name: Install dependencies 👨🏻‍💻
        run: npm ci
      - name: Run build bundle 📦
        run: npm run build-bundle