lighthouse.yml

name: Lighthouse

on:
  pull_request:
    branches:
      - main
    types:
      - opened
      - synchronize
      - reopened
      - labeled

jobs:
  audit:
    name: Audit
    if: contains(github.event.pull_request.labels.*.name, 'lighthouse')
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repository
        uses: actions/checkout@v3
        with:
          submodules: true
          fetch-depth: 1
      - name: Comment pull request
        uses: marocchino/sticky-pull-request-comment@v2
        with:
          number: ${{ github.event.pull_request.number }}
          header: lighthouse
          message: |
            # Lighthouse Report
            :vertical_traffic_light: Waiting for the Vercel preview ...
      - name: Waiting for the Vercel preview
        uses: patrickedqvist/wait-for-vercel-preview@v1.3.1
        id: vercel
        with:
          token: ${{ secrets.GITHUB_TOKEN }}
          max_timeout: 600
          check_interval: 15
      - name: Comment preview result
        uses: marocchino/sticky-pull-request-comment@v2
        with:
          number: ${{ github.event.pull_request.number }}
          header: lighthouse
          message: |
            # Lighthouse Report
            :hammer_and_wrench: Running Lighthouse audit on ${{ steps.vercel.outputs.url }} ...
      - name: Audit using Lighthouse
        id: lighthouse
        uses: treosh/lighthouse-ci-action@v10
        with:
          urls: |
            ${{ steps.vercel.outputs.url }}
            ${{ steps.vercel.outputs.url }}/web/css/cssAdvancedNotes
          configPath: ./.github/workflows/lighthouserc.json
          uploadArtifacts: true
          temporaryPublicStorage: true
      - name: Format audit result
        id: result
        uses: actions/github-script@v6
        with:
          script: |
            const links = ${{ steps.lighthouse.outputs.links }}
            const results = (${{ steps.lighthouse.outputs.manifest }}).filter(result => result.isRepresentativeRun);
            const score = res => res >= 90 ? ':green_circle:' : res >= 50 ? ':yellow_circle:' : ':red_circle:';
            const comment = results.map((result) => {
              const summary = result.summary;
              const url = result.url;

              return `
              ## :sparkles: ${url}

              :rocket: [Vercel preview deployment](${url})
              :zap: [Lighthouse report](${links[url]})

              | Category | Score |
              | --- | --- |
              ${Object.keys(summary).map((key) => {
                const percentage = Math.round(summary[key] * 100);
                return `| ${score(percentage)} ${key} | ${percentage} |`;
              }).join('\n')}

              `;
            }).join('');

            core.setOutput("comment", comment);
      - name: Comment audit result
        uses: marocchino/sticky-pull-request-comment@v2
        with:
          number: ${{ github.event.pull_request.number }}
          header: lighthouse
          message: |
            # Lighthouse Report
            ${{ steps.result.outputs.comment }}