feat: Community lab media page #4694
Workflow file for this run
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# Don't change the name, it's used in lighthouse-pr-comment.yml | |
# to detect the end of this workflow | |
name: lighthouse | |
on: | |
pull_request: | |
jobs: | |
lighthouse: | |
runs-on: ubuntu-latest | |
steps: | |
- uses: actions/checkout@v3 | |
- uses: actions/setup-node@v3 | |
with: | |
node-version: 18 | |
- run: npm ci | |
- run: npm run build:dev | |
- uses: treosh/lighthouse-ci-action@v9 | |
id: lighthouse_audit | |
with: | |
# Check sample pages from the main layouts, see "url" key in the config file. | |
# | |
# Note from lighthouse-ci docs: | |
# URLs will have their port replaced with the port of the local server that | |
# Lighthouse CI starts for you. This allows you to write URLs without worrying | |
# about the chosen temporary port. | |
configPath: './.lighthouserc.json' | |
temporaryPublicStorage: true | |
# Based on | |
# https://github.com/OskarAhl/Lighthouse-github-action-comment/blob/main/.github/workflows/ | |
- uses: actions/github-script@v6 | |
id: format_lighthouse_score | |
env: | |
MANIFEST: ${{ steps.lighthouse_audit.outputs.manifest }} | |
LINKS: ${{ steps.lighthouse_audit.outputs.links }} | |
PR: ${{ github.event.number }} | |
with: | |
script: | | |
const manifest = JSON.parse(process.env.MANIFEST) | |
const links = JSON.parse(process.env.LINKS) | |
const pr = process.env.PR | |
console.log('Raw output:\n', manifest, '\n', links) | |
const formatResult = (res) => Math.round((res * 100)) | |
const score = res => res >= 90 ? '🟢' : res >= 50 ? '🟠' : '🔴' | |
manifest | |
.forEach(result => Object.keys(result.summary) | |
.forEach(metric => result.summary[metric] = formatResult(result.summary[metric])) | |
) | |
const home_page = manifest.find(result => new URL(result.url).pathname === '/') | |
const other_pages = manifest.filter(result => new URL(result.url).pathname !== '/') | |
let comment = [ | |
`### ⚡ Lighthouse report for the home page 🏠`, | |
'| Category | Score |', | |
'| --- | --: |', | |
`| ${score(home_page.summary.performance)} Performance | ${home_page.summary.performance} |`, | |
`| ${score(home_page.summary.accessibility)} Accessibility | ${home_page.summary.accessibility} |`, | |
`| ${score(home_page.summary['best-practices'])} Best practices | ${home_page.summary['best-practices']} |`, | |
`| ${score(home_page.summary.seo)} SEO | ${home_page.summary.seo} |`, | |
' ', | |
`[See the full report...](${links[home_page.url]})`, | |
' ', | |
`#### Other pages`, | |
...other_pages.map(result => { | |
const pathname = new URL(result.url).pathname | |
return `* [${pathname}](${links[result.url]}) \ | |
[${score(result.summary.performance)}](## "Performance") ${result.summary.performance} \ | |
[${score(result.summary.accessibility)}](## "Accessibility") ${result.summary.accessibility} \ | |
[${score(result.summary['best-practices'])}](## "Best practices") ${result.summary['best-practices']} \ | |
[${score(result.summary.seo)}](## "SEO") ${result.summary.seo}` | |
}) | |
].join('\n') | |
const errors = [home_page, ...other_pages].reduce((acc, p) => { | |
const pageErrors = ['accessibility', 'best-practices', 'seo'] | |
.map(c => ({ pathname: new URL(p.url).pathname, category: c, score: p.summary[c] })) | |
.filter(res => res.score !== 100) | |
return [...acc, ...pageErrors] | |
}, []) | |
if (errors.length > 0) { | |
const warning = [ | |
`⚠️ @${{ github.event.pull_request.user.login }} your PR decreased Lighthouse scores! ⚠️`, | |
...errors.map(e => `* ⚠️ \`${e.pathname}\` ${e.category} down to **${e.score}**`) | |
].join('\n') | |
comment = `${warning}\n\n${comment}` | |
core.setFailed('Lighthouse scores decreased because of this PR') | |
} | |
const fs = require('fs') | |
fs.writeFileSync(`lighthouse-pr-comment-${pr}.txt`, comment) | |
- uses: actions/upload-artifact@v3 | |
if: always() | |
with: | |
name: lighthouse-pr-comment | |
path: lighthouse-pr-comment-${{ github.event.number }}.txt | |
# Don't need the full default retention of 90 days. | |
retention-days: 3 |