From 0577e1b6658acfb57eb2528b4d2481bcedcd9c04 Mon Sep 17 00:00:00 2001 From: Achanandhi-M Date: Tue, 29 Apr 2025 18:33:04 +0530 Subject: [PATCH 1/2] feat: lighthouse-integration-added Signed-off-by: Achanandhi-M --- .github/workflows/lighthouse.yml | 49 ++++++++++++++++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 .github/workflows/lighthouse.yml diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml new file mode 100644 index 00000000..9d344360 --- /dev/null +++ b/.github/workflows/lighthouse.yml @@ -0,0 +1,49 @@ +name: Lighthouse score + +on: + pull_request: + branches: + - '**' + +jobs: + lighthouse: + runs-on: ubuntu-latest + steps: + - name: Checkout PR branch + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: 18 + + - name: Install static server + run: npm install -g serve + + - name: Serve PR branch (background on port 3001) + run: | + serve . -l 3001 & + sleep 5 + - name: Checkout main branch into separate folder + run: | + git fetch origin main + git worktree add main-branch origin/main + - name: Serve Main branch (background on port 3000) + run: | + cd main-branch + serve . -l 3000 & + cd .. + sleep 5 + + - name: Create output directory for Lighthouse + run: mkdir -p ${{ github.workspace }}/tmp/artifacts + + - name: Run Lighthouse audit for both PR and Main + uses: foo-software/lighthouse-check-action@master + with: + gitAuthor: ${{ github.actor }} + gitBranch: ${{ github.head_ref }} + gitHubAccessToken: ${{ secrets.GITHUB_TOKEN }} + outputDirectory: ${{ github.workspace }}/tmp/artifacts + urls: 'http://localhost:3000/?branch=main,http://localhost:3001/?branch=pr' + sha: ${{ github.sha }} \ No newline at end of file From 71e2980a0ce106151d1945464beb0a515b9561d5 Mon Sep 17 00:00:00 2001 From: Achanandhi-M Date: Fri, 2 May 2025 18:10:24 +0530 Subject: [PATCH 2/2] chore: Update lighthouse Integration Signed-off-by: Achanandhi-M --- .github/scripts/lighthouse-report.js | 69 ++++++++++++++++++++++++++++ .github/workflows/lighthouse.yml | 38 ++++++++------- 2 files changed, 91 insertions(+), 16 deletions(-) create mode 100644 .github/scripts/lighthouse-report.js diff --git a/.github/scripts/lighthouse-report.js b/.github/scripts/lighthouse-report.js new file mode 100644 index 00000000..167ed36a --- /dev/null +++ b/.github/scripts/lighthouse-report.js @@ -0,0 +1,69 @@ +const fs = require('fs'); +const path = require('path'); + +const dir = '.lighthouseci'; +const files = fs.readdirSync(dir).filter(file => file.endsWith('.report.json')); + +if (files.length < 2) { + console.error('❌ Not enough Lighthouse reports found.'); + process.exit(1); +} + +let mainReport = ''; +let prReport = ''; + +for (const file of files) { + const json = JSON.parse(fs.readFileSync(path.join(dir, file), 'utf8')); + const url = json.finalUrl; + + if (url.includes('3000')) mainReport = json; + else if (url.includes('3001')) prReport = json; +} + +function extract(report) { + return { + performance: report.categories.performance.score * 100, + accessibility: report.categories.accessibility.score * 100, + bestPractices: report.categories['best-practices'].score * 100, + seo: report.categories.seo.score * 100, + }; +} + +const main = extract(mainReport); +const pr = extract(prReport); + +const md = ` +**🔍 Lighthouse Scores** + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Metric⚡ PR Branch📦 Main Branch
Performance${pr.performance}${main.performance}
Accessibility${pr.accessibility}${main.accessibility}
Best Practices${pr.bestPractices}${main.bestPractices}
SEO${pr.seo}${main.seo}
+`; + + +fs.writeFileSync('lighthouse-comment.md', md); +console.log('✅ Comment written to lighthouse-comment.md'); diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 9d344360..47e593dd 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -9,41 +9,47 @@ jobs: lighthouse: runs-on: ubuntu-latest steps: - - name: Checkout PR branch - uses: actions/checkout@v4 + - uses: actions/checkout@v4 - name: Set up Node.js uses: actions/setup-node@v4 with: node-version: 18 - - name: Install static server - run: npm install -g serve + - run: npm install -g serve - - name: Serve PR branch (background on port 3001) + - name: Serve PR branch (port 3001) run: | serve . -l 3001 & sleep 5 + - name: Checkout main branch into separate folder run: | git fetch origin main git worktree add main-branch origin/main - - name: Serve Main branch (background on port 3000) + + - name: Serve Main branch (port 3000) run: | cd main-branch serve . -l 3000 & cd .. sleep 5 - - name: Create output directory for Lighthouse - run: mkdir -p ${{ github.workspace }}/tmp/artifacts + - name: Run Lighthouse audits + uses: treosh/lighthouse-ci-action@v12 + with: + urls: | + http://localhost:3000/ + http://localhost:3001/ + uploadArtifacts: true + temporaryPublicStorage: true + + - name: Parse reports and generate comment + run: node .github/scripts/lighthouse-report.js - - name: Run Lighthouse audit for both PR and Main - uses: foo-software/lighthouse-check-action@master + - name: Comment on PR with Lighthouse scores + uses: peter-evans/create-or-update-comment@v4 with: - gitAuthor: ${{ github.actor }} - gitBranch: ${{ github.head_ref }} - gitHubAccessToken: ${{ secrets.GITHUB_TOKEN }} - outputDirectory: ${{ github.workspace }}/tmp/artifacts - urls: 'http://localhost:3000/?branch=main,http://localhost:3001/?branch=pr' - sha: ${{ github.sha }} \ No newline at end of file + token: ${{ secrets.LIGHTHOUSE_TOKEN }} + issue-number: ${{ github.event.pull_request.number }} + body-path: lighthouse-comment.md