CI: Display LightHouse stats in nicer way

.github/workflows/validate.yml

@@ -101,11 +101,48 @@ jobs:
         with:
           name: Built site ${{ github.run_number }}
           path: ./_site
+
       - name: Audit with Lighthouse
+        id: lighthouse_audit
         uses: treosh/lighthouse-ci-action@v8
         with:
           configPath: ".github/workflows/lighthouserc.json"
           temporaryPublicStorage: true
           uploadArtifacts: true
           # Multiple runs for more stable results. If builds are too slow, we can try to reduce this.
           runs: 4
+
+      - name: Lighthouse Score Report
+        id: lighthouse_score_report
+        uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const result = ${{ steps.lighthouse_audit.outputs.manifest }}[0].summary
+            const links = ${{ steps.lighthouse_audit.outputs.links }}
+            const formatResult = (res) => Math.round((res * 100))
+            Object.keys(result).forEach(key => result[key] = formatResult(result[key]))
+            const score = res => res >= 90 ? '🟢' : res >= 50 ? '🟠' : '🔴'
+            const comment = [
+                `⚡️ [Lighthouse report](${Object.values(links)[0]}) for the changes in this PR:`,
+                '| Category | Score |',
+                '| --- | --- |',
+                `| ${score(result.performance)} Performance | ${result.performance} |`,
+                `| ${score(result.accessibility)} Accessibility | ${result.accessibility} |`,
+                `| ${score(result['best-practices'])} Best practices | ${result['best-practices']} |`,
+                `| ${score(result.seo)} SEO | ${result.seo} |`,
+                `| ${score(result.pwa)} PWA | ${result.pwa} |`,
+                ' ',
+                `*Lighthouse ran on [${Object.keys(links)[0]}](${Object.keys(links)[0]})*`
+            ].join('\n')
+             core.setOutput("comment", comment);
+
+      - name: LightHouse Statistic Comment
+        if: github.event_name == 'pull_request'
+        id: lighthouse_statistic_comment
+        uses: marocchino/[email protected]
+        with:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          number: ${{ github.event.pull_request.number }}
+          header: lighthouse
+          message: ${{ steps.lighthouse_score_report.outputs.comment }}