feat: implement automated Lighthouse CI testing for sitemap URLs with dedicated configuration and scripts.
This commit is contained in:
@@ -309,11 +309,63 @@ jobs:
|
||||
fi
|
||||
|
||||
# ──────────────────────────────────────────────────────────────────────────────
|
||||
# JOB 5: Notifications
|
||||
# JOB 5: PageSpeed Test
|
||||
# ──────────────────────────────────────────────────────────────────────────────
|
||||
pagespeed:
|
||||
name: ⚡ PageSpeed
|
||||
needs: [prepare, deploy]
|
||||
if: |
|
||||
always() &&
|
||||
needs.prepare.outputs.target != 'skip' &&
|
||||
needs.deploy.result == 'success' &&
|
||||
github.event.inputs.skip_long_checks != 'true'
|
||||
runs-on: docker
|
||||
outputs:
|
||||
report_url: ${{ steps.save.outputs.report_url }}
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v4
|
||||
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: 20
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: 🔍 Install Chrome for Lighthouse
|
||||
run: |
|
||||
apt-get update && apt-get install -y wget gnupg
|
||||
wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
|
||||
sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list'
|
||||
apt-get update && apt-get install -y google-chrome-stable --no-install-recommends
|
||||
continue-on-error: true # Might fail if runner is not debian-based or restricted
|
||||
|
||||
- name: 🧪 Run PageSpeed (Lighthouse)
|
||||
env:
|
||||
NEXT_PUBLIC_BASE_URL: ${{ needs.prepare.outputs.next_public_base_url }}
|
||||
GATEKEEPER_PASSWORD: ${{ secrets.GATEKEEPER_PASSWORD || 'klz2026' }}
|
||||
PAGESPEED_LIMIT: 8
|
||||
run: npm run pagespeed:test
|
||||
|
||||
- name: 💾 Save Report URL
|
||||
id: save
|
||||
if: always()
|
||||
run: |
|
||||
if [ -f pagespeed-report-url.txt ]; then
|
||||
URL=$(cat pagespeed-report-url.txt)
|
||||
echo "report_url=$URL" >> $GITHUB_OUTPUT
|
||||
echo "✅ Report URL found: $URL"
|
||||
fi
|
||||
|
||||
# ──────────────────────────────────────────────────────────────────────────────
|
||||
# JOB 6: Notifications
|
||||
# ──────────────────────────────────────────────────────────────────────────────
|
||||
notifications:
|
||||
name: 🔔 Notifications
|
||||
needs: [prepare, qa, build, deploy]
|
||||
needs: [prepare, qa, build, deploy, pagespeed]
|
||||
if: always()
|
||||
runs-on: docker
|
||||
steps:
|
||||
@@ -332,9 +384,14 @@ jobs:
|
||||
- name: 🔔 Gotify - Success
|
||||
if: needs.deploy.result == 'success'
|
||||
run: |
|
||||
REPORT_MSG=""
|
||||
if [ -n "${{ needs.pagespeed.outputs.report_url }}" ]; then
|
||||
REPORT_MSG="\n\n⚡ **PageSpeed Report:**\n${{ needs.pagespeed.outputs.report_url }}"
|
||||
fi
|
||||
|
||||
curl -s -k -X POST "${{ secrets.GOTIFY_URL }}/message?token=${{ secrets.GOTIFY_TOKEN }}" \
|
||||
-F "title=${{ needs.prepare.outputs.gotify_title }}" \
|
||||
-F "message=Erfolgreich deployt auf **${{ needs.prepare.outputs.target }}**\n\nVersion: **${{ needs.prepare.outputs.image_tag }}**\nCommit: ${{ needs.prepare.outputs.short_sha }} (${{ needs.prepare.outputs.commit_msg }})\nVon: ${{ github.actor }}\nRun: ${{ github.run_id }}" \
|
||||
-F "message=Erfolgreich deployt auf **${{ needs.prepare.outputs.target }}**\n\nVersion: **${{ needs.prepare.outputs.image_tag }}**\nCommit: ${{ needs.prepare.outputs.short_sha }} (${{ needs.prepare.outputs.commit_msg }})\nVon: ${{ github.actor }}\nRun: ${{ github.run_id }}${REPORT_MSG}" \
|
||||
-F "priority=4" || true
|
||||
|
||||
- name: 🔔 Gotify - Failure
|
||||
|
||||
22
lighthouserc.js
Normal file
22
lighthouserc.js
Normal file
@@ -0,0 +1,22 @@
|
||||
module.exports = {
|
||||
ci: {
|
||||
collect: {
|
||||
numberOfRuns: 1,
|
||||
settings: {
|
||||
preset: 'desktop',
|
||||
onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo'],
|
||||
},
|
||||
},
|
||||
assert: {
|
||||
assertions: {
|
||||
'categories:performance': ['warn', { minScore: 0.9 }],
|
||||
'categories:accessibility': ['warn', { minScore: 0.9 }],
|
||||
'categories:best-practices': ['warn', { minScore: 0.9 }],
|
||||
'categories:seo': ['warn', { minScore: 0.9 }],
|
||||
},
|
||||
},
|
||||
upload: {
|
||||
target: 'temporary-public-storage',
|
||||
},
|
||||
},
|
||||
};
|
||||
3030
package-lock.json
generated
3030
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -37,6 +37,7 @@
|
||||
"zod": "^4.3.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@lhci/cli": "^0.15.1",
|
||||
"@tailwindcss/cli": "^4.1.18",
|
||||
"@tailwindcss/postcss": "^4.1.18",
|
||||
"@types/node": "^22.19.3",
|
||||
@@ -74,7 +75,9 @@
|
||||
"directus:push:testing": "./scripts/sync-directus.sh push testing",
|
||||
"directus:pull:testing": "./scripts/sync-directus.sh pull testing",
|
||||
"directus:push:prod": "./scripts/sync-directus.sh push production",
|
||||
"directus:pull:prod": "./scripts/sync-directus.sh pull production"
|
||||
"directus:pull:prod": "./scripts/sync-directus.sh pull production",
|
||||
"pagespeed:test": "tsx ./scripts/pagespeed-sitemap.ts",
|
||||
"pagespeed:urls": "tsx -e \"import sitemap from './app/sitemap'; sitemap().then(urls => console.log(urls.map(u => u.url).join('\\n')))\""
|
||||
},
|
||||
"version": "1.0.0"
|
||||
}
|
||||
115
scripts/pagespeed-sitemap.ts
Normal file
115
scripts/pagespeed-sitemap.ts
Normal file
@@ -0,0 +1,115 @@
|
||||
import axios from 'axios';
|
||||
import * as cheerio from 'cheerio';
|
||||
import { execSync } from 'child_process';
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
/**
|
||||
* PageSpeed Test Script
|
||||
*
|
||||
* 1. Fetches sitemap.xml from the target URL
|
||||
* 2. Extracts all URLs
|
||||
* 3. Runs Lighthouse CI on those URLs
|
||||
*/
|
||||
|
||||
const targetUrl = process.argv[2] || process.env.NEXT_PUBLIC_BASE_URL || 'https://testing.klz-cables.com';
|
||||
const limit = process.env.PAGESPEED_LIMIT ? parseInt(process.env.PAGESPEED_LIMIT) : 20; // Default limit to avoid infinite runs
|
||||
const gatekeeperPassword = process.env.GATEKEEPER_PASSWORD || 'klz2026';
|
||||
|
||||
async function main() {
|
||||
console.log(`\n🚀 Starting PageSpeed test for: ${targetUrl}`);
|
||||
console.log(`📊 Limit: ${limit} pages\n`);
|
||||
|
||||
try {
|
||||
// 1. Fetch Sitemap
|
||||
const sitemapUrl = `${targetUrl.replace(/\/$/, '')}/sitemap.xml`;
|
||||
console.log(`📥 Fetching sitemap from ${sitemapUrl}...`);
|
||||
|
||||
// We might need to bypass gatekeeper for the sitemap fetch too
|
||||
const response = await axios.get(sitemapUrl, {
|
||||
headers: {
|
||||
'Cookie': `klz_gatekeeper_session=${gatekeeperPassword}`
|
||||
},
|
||||
validateStatus: (status) => status < 400
|
||||
});
|
||||
|
||||
const $ = cheerio.load(response.data, { xmlMode: true });
|
||||
let urls = $('url loc').map((i, el) => $(el).text()).get();
|
||||
|
||||
// Cleanup and filter
|
||||
urls = [...new Set(urls)].filter(u => u.startsWith('http')).sort();
|
||||
|
||||
console.log(`✅ Found ${urls.length} URLs in sitemap.`);
|
||||
|
||||
if (urls.length === 0) {
|
||||
console.error('❌ No URLs found in sitemap. Is the site up?');
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
if (urls.length > limit) {
|
||||
console.log(`⚠️ Too many pages (${urls.length}). Limiting to ${limit} representative pages.`);
|
||||
// Try to pick a variety: home, some products, some blog posts
|
||||
const home = urls.filter(u => u.endsWith('/de') || u.endsWith('/en') || u === targetUrl);
|
||||
const others = urls.filter(u => !home.includes(u));
|
||||
urls = [...home, ...others.slice(0, limit - home.length)];
|
||||
}
|
||||
|
||||
console.log(`🧪 Pages to be tested:`);
|
||||
urls.forEach(u => console.log(` - ${u}`));
|
||||
|
||||
// 2. Prepare LHCI command
|
||||
// We use --collect.url multiple times
|
||||
const urlArgs = urls.map(u => `--collect.url="${u}"`).join(' ');
|
||||
|
||||
// Handle authentication for staging/testing
|
||||
// Lighthouse can set cookies via --collect.settings.extraHeaders
|
||||
const extraHeaders = JSON.stringify({
|
||||
'Cookie': `klz_gatekeeper_session=${gatekeeperPassword}`
|
||||
});
|
||||
|
||||
console.log(`\n🏗️ Running Lighthouse CI...`);
|
||||
|
||||
// Using a more robust way to execute and capture output
|
||||
const lhciCommand = `npx lhci collect ${urlArgs} --collect.settings.chromeFlags='--no-sandbox --disable-setuid-sandbox' --collect.settings.extraHeaders='${extraHeaders}' && npx lhci assert && npx lhci upload`;
|
||||
|
||||
console.log(`💻 Executing LHCI...`);
|
||||
|
||||
try {
|
||||
const output = execSync(lhciCommand, {
|
||||
encoding: 'utf8',
|
||||
stdio: ['inherit', 'pipe', 'inherit'] // Pipe stdout so we can parse it
|
||||
});
|
||||
|
||||
console.log(output);
|
||||
|
||||
// Extract report URL from LHCI output
|
||||
const reportMatch = output.match(/Sent to (https:\/\/storage\.googleapis\.com\/lighthouse-infrastructure\.appspot\.com\/reports\/[^\s]+)/);
|
||||
if (reportMatch && reportMatch[1]) {
|
||||
const reportUrl = reportMatch[1];
|
||||
console.log(`\n📊 Report URL: ${reportUrl}`);
|
||||
fs.writeFileSync('pagespeed-report-url.txt', reportUrl);
|
||||
}
|
||||
|
||||
} catch (err: any) {
|
||||
console.error('❌ LHCI execution failed.');
|
||||
if (err.stdout) console.log(err.stdout);
|
||||
if (err.stderr) console.error(err.stderr);
|
||||
throw err;
|
||||
}
|
||||
|
||||
console.log(`\n✨ PageSpeed tests completed successfully!`);
|
||||
|
||||
} catch (error: any) {
|
||||
console.error(`\n❌ Error during PageSpeed test:`);
|
||||
if (axios.isAxiosError(error)) {
|
||||
console.error(`Status: ${error.response?.status}`);
|
||||
console.error(`StatusText: ${error.response?.statusText}`);
|
||||
console.error(`URL: ${error.config?.url}`);
|
||||
} else {
|
||||
console.error(error.message);
|
||||
}
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
main();
|
||||
Reference in New Issue
Block a user