Merge pull request #210 from bartvdbraak/unlighthouse-fixes

Refactor loading and titles
This commit is contained in:
Bart van der Braak 2024-02-18 15:38:17 +01:00 committed by GitHub
commit 7b69ce71bc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -15,6 +15,9 @@ jobs:
COMMENT_ID: unlighthouse-node${{matrix.node-version}}
PORT: 8000
CLOUDFLARE_PROJECT: omnidash-unlighthouse
WEBSITE_URL: https://omnidash.io
BADGE_FILE: omnidash.io-unlighthouse.json
BADGE_GIST: b948b29508e19955106a1037d2a615e6
strategy:
matrix:
node-version: [20]
@ -25,18 +28,19 @@ jobs:
with:
header: ${{ env.COMMENT_ID }}
message: |
⚡️ Lighthouse report
## 🔄 **Unlighthouse report in progress** 🗼
![loading](https://github.com/bartvdbraak/hellob.art/assets/3996360/0e00b3fc-d5f9-490b-9aa7-07cb4b59f85f)
<div align="center"></br></br><img src="https://github.com/bartvdbraak/omnidash/assets/3996360/f994f62a-6a85-450b-bb4d-927a56542e33"></div>
- name: Set variables based on trigger
id: set_variables
run: |
if [[ ${{ github.ref == 'refs/heads/main' }} == true ]]; then
echo "CLOUDFLARE_BRANCH=main" >> $GITHUB_ENV
echo "CLOUDFLARE_URL=https://${{ env.CLOUDFLARE_PROJECT }}.pages.dev" >> $GITHUB_ENV
echo "CLOUDFLARE_BRANCH=main" >> $GITHUB_OUTPUT
echo "CLOUDFLARE_URL=https://${{ env.CLOUDFLARE_PROJECT }}.pages.dev" >> $GITHUB_OUTPUT
else
echo "CLOUDFLARE_BRANCH=pull-${{ github.event.pull_request.number }}" >> $GITHUB_ENV
echo "CLOUDFLARE_URL=https://pull-${{ github.event.pull_request.number }}.${{ env.CLOUDFLARE_PROJECT }}.pages.dev" >> $GITHUB_ENV
echo "CLOUDFLARE_BRANCH=pull-${{ github.event.pull_request.number }}" >> $GITHUB_OUTPUT
echo "CLOUDFLARE_URL=https://pull-${{ github.event.pull_request.number }}.${{ env.CLOUDFLARE_PROJECT }}.pages.dev" >> $GITHUB_OUTPUT
fi
- name: Checkout repository
@ -75,7 +79,7 @@ jobs:
- name: Run Unlighthouse
run: |
unlighthouse-ci \
--site "${{ github.ref == 'refs/heads/main' && 'https://omnidash.io' || steps.vercel_preview_url.outputs.preview_url }}" \
--site "${{ github.ref == 'refs/heads/main' && env.WEBSITE_URL || steps.vercel_preview_url.outputs.preview_url }}" \
--reporter jsonExpanded \
--build-static
@ -83,28 +87,24 @@ jobs:
uses: cloudflare/wrangler-action@v3.4.1
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
command: pages deploy .unlighthouse --project-name="${{ env.CLOUDFLARE_PROJECT }}" --branch=${{ env.CLOUDFLARE_BRANCH }}
command: pages deploy .unlighthouse --project-name="${{ env.CLOUDFLARE_PROJECT }}" --branch=${{ steps.set_variables.outputs.CLOUDFLARE_BRANCH }}
- name: Create result content
id: create_result_content
- name: Create comment content
id: create_comment
uses: actions/github-script@v7.0.1
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
result-encoding: string
script: |
const fs = require('fs');
const result = JSON.parse(fs.readFileSync('.unlighthouse/ci-result.json', 'utf8'));
const formatScore = score => `${Math.round(score * 100)} (${score})`;
const getEmoji = score => score >= 0.9 ? '🟢' : score >= 0.5 ? '🟠' : '🔴';
const getColor = score => score >= 0.9 ? '4c1' : score >= 0.5 ? 'ffa400' : 'eb0f00';
const score = res => `${getEmoji(res)} ${formatScore(res)}`;
const reportUrl = `${{ env.CLOUDFLARE_URL }}`;
const comment = [
`⚡️ Lighthouse report for the changes in this PR:`,
const reportUrl = `${{ steps.set_variables.outputs.CLOUDFLARE_URL }}`;
return [
`## ✅ **Unlighthouse report** 🗼`,
'| Category | Score |',
'| --- | --- |',
`| Performance | ${score(result.summary.categories.performance.averageScore)} |`,
@ -128,28 +128,47 @@ jobs:
`View the full Lighthouse report [here](${reportUrl}).`,
].join('\n');
core.setOutput("comment", comment);
core.setOutput("score", `${Math.round(result.summary.score * 100)}`);
core.setOutput("scoreColor", getColor(result.summary.score));
- name: Create summary score
id: create_score
uses: actions/github-script@v7.0.1
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
result-encoding: string
script: |
const fs = require('fs');
const result = JSON.parse(fs.readFileSync('.unlighthouse/ci-result.json', 'utf8'));
return `${Math.round(result.summary.score * 100)}`;
- name: Create summary score color
id: create_score_color
uses: actions/github-script@v7.0.1
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
result-encoding: string
script: |
const fs = require('fs');
const result = JSON.parse(fs.readFileSync('.unlighthouse/ci-result.json', 'utf8'));
const getColor = score => score >= 0.9 ? '4c1' : score >= 0.5 ? 'ffa400' : 'eb0f00';
return getColor(result.summary.score);
- name: Update comment with result
uses: marocchino/sticky-pull-request-comment@v2.9.0
if: github.ref != 'refs/heads/main'
with:
header: ${{ env.COMMENT_ID }}
message: ${{ steps.create_result_content.outputs.comment }}
message: ${{ steps.create_comment.outputs.result }}
- name: Create Lighthouse Score badge
uses: schneegans/dynamic-badges-action@v1.7.0
if: github.ref == 'refs/heads/main'
with:
auth: ${{ secrets.GIST_SECRET }}
gistID: 795a3d6af5b0db5754cf7279898c3c16
filename: omnidash.io-unlighthouse.json
gistID: ${{ env.BADGE_GIST }}
filename: ${{ env.BADGE_FILE }}
namedLogo: Lighthouse
label: lighthouse
message: ${{ steps.create_result_content.outputs.score }}
color: ${{ steps.create_result_content.outputs.scoreColor }}
message: ${{ steps.create_score.outputs.result }}
color: ${{ steps.create_score_color.outputs.result }}
- name: Update comment on failure
uses: marocchino/sticky-pull-request-comment@v2.9.0
@ -157,9 +176,9 @@ jobs:
with:
header: ${{ env.COMMENT_ID }}
message: |
⚡️ Lighthouse report failed
## ❌ **Unlighthouse report failed** 🗼
See deployment for any errors
<div align="center"></br></br><img src="https://github.com/bartvdbraak/omnidash/assets/3996360/cc1c6fb9-f9be-4a69-9666-655d6733abeb"></div>
- name: Update comment on cancel
uses: marocchino/sticky-pull-request-comment@v2.9.0
@ -167,4 +186,6 @@ jobs:
with:
header: ${{ env.COMMENT_ID }}
message: |
⚡️ Lighthouse report cancelled
## 🛑 **Unlighthouse report was cancelled** 🗼
<div align="center"></br></br><img src="https://github.com/bartvdbraak/omnidash/assets/3996360/cc1c6fb9-f9be-4a69-9666-655d6733abeb"></div>