lighthouse.yml

name: PR Deploy and Audit
on: [pull_request]
jobs:
  deploy_and_audit:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Vercel Action
        id: vercel_action
        uses: amondnet/vercel-action@v20
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}
          github-token: ${{ secrets.GITHUB_TOKEN }}
          vercel-org-id: ${{ secrets.ORG_ID}}
          vercel-project-id: ${{ secrets.PROJECT_ID}}
          scope: ${{ secrets.VERCEL_SCOPE }}
      - name: Add comment to PR
        id: loading_lighthouse_comment_to_pr
        uses: marocchino/sticky-pull-request-comment@v2
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          number: ${{ github.event.pull_request.number }}
          header: lighthouse
          message: |
            🚦 Running Lighthouse audit...
      - name: Add comment to PR
        id: loading_budget_comment_to_pr
        uses: marocchino/sticky-pull-request-comment@v2
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          number: ${{ github.event.pull_request.number }}
          header: budget
          message: |
            ⏱ Running budget checks...
      - name: Audit URLs using Lighthouse
        id: lighthouse_audit
        uses: treosh/lighthouse-ci-action@v7
        with:
          # add as many urls here as you wish to audit
          # prefixed by the preview-url
          urls: |
            https://explorer-git-prod-reference-blockstack.vercel.app/
            https://explorer-git-prod-reference-blockstack.vercel.app/txid/0xa176909e4681cf41cf8662ce51ffcf109fb2fdb2aeae6bb8425d236241debe3f
            https://explorer-git-prod-reference-blockstack.vercel.app/address/SM2MARAVW6BEJCD13YV2RHGYHQWT7TDDNMNRB1MVT
            https://explorer-git-prod-reference-blockstack.vercel.app/block/0xe1c163a23ce0fa8a552b5237c25bc36f3ec0612eb8a01322d9f154f09163b1a0
            ${{ steps.vercel_action.outputs.preview-url }}
            ${{ steps.vercel_action.outputs.preview-url }}/txid/0xa176909e4681cf41cf8662ce51ffcf109fb2fdb2aeae6bb8425d236241debe3f
            ${{ steps.vercel_action.outputs.preview-url }}/address/SM2MARAVW6BEJCD13YV2RHGYHQWT7TDDNMNRB1MVT
            ${{ steps.vercel_action.outputs.preview-url }}/block/0xe1c163a23ce0fa8a552b5237c25bc36f3ec0612eb8a01322d9f154f09163b1a0
          budgetPath: '.github/lighthouse/budget.json'
          uploadArtifacts: true
          temporaryPublicStorage: true
          runs: 3
      - name: Format lighthouse result
        id: lighthouse_result
        if: ${{ always() }}
        uses: actions/github-script@v4
        with:
          github-token: ${{secrets.GITHUB_TOKEN}}
          script: |
            const links = ${{ steps.lighthouse_audit.outputs.links }}
            const results = (${{ steps.lighthouse_audit.outputs.manifest }}).filter(result => result.isRepresentativeRun);
            const score = res => res >= 90 ? '🟢' : res >= 50 ? '🟠' : '🔴';
            const comment = results.map((result) => {
              const summary = result.summary;
              const url = result.url;
              return `
              🌎 [${url}](${url})
              ⚡️ [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: Format budget result
        id: budget_result
        if: ${{ always() }}
        uses: actions/github-script@v4
        with:
          github-token: ${{secrets.GITHUB_TOKEN}}
          script: |
            const assertions = ${{ steps.lighthouse_audit.outputs.assertionResults }};
            if (!assertions.length) {
              core.setOutput("comment", '✅ Budget met, nothing to see here');
            } else {
              const comment = assertions.map((result) => {
                return `
            ❌ **${result.auditProperty || ''}.${result.auditId}** failure on [${result.url}](${result.url})
            *${result.auditTitle}* - [docs](${result.auditDocumentationLink})
            | Actual | Expected |
            | --- | --- |
            | ${result.actual} | ${result.operator} ${result.expected} |
            `;
              }).join('---');
              core.setOutput("comment", comment);
            }
      - name: Add Lighthouse comment to PR
        id: lighthouse_comment_to_pr
        if: ${{ always() }}
        uses: marocchino/sticky-pull-request-comment@v1
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          number: ${{ github.event.pull_request.number }}
          header: lighthouse
          message: |
            ${{ steps.lighthouse_result.outputs.comment }}
      - name: Add Budget comment to PR
        id: budget_comment_to_pr
        if: ${{ always() }}
        uses: marocchino/sticky-pull-request-comment@v1
        with:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          number: ${{ github.event.pull_request.number }}
          header: budget
          message: |
            ${{ steps.budget_result.outputs.comment }}

  test_e2e:
    needs: test_setup
    name: Playwright tests
    timeout-minutes: 5
    runs-on: ubuntu-latest
    steps:
      - name: Prepare testing env
        uses: actions/checkout@v2
      - uses: actions/setup-node@v2
        with:
          node-version: '18.9.0'
      - run: npm install -g pnpm
      - run: pnpm i
      - run: npx playwright install --with-deps
      - name: Run tests
        run: |
          xvfb-run --auto-servernum -- \
            pnpm run test:e2e
        env:
          PLAYWRIGHT_TEST_BASE_URL: ${{ steps.vercel_action.outputs.preview-url }}