From b3ee6db288d6ba78d3c683701991213cf5829dda Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Tue, 6 Oct 2020 16:00:17 +0530 Subject: [PATCH 1/8] added lighthouse ci action --- .github/workflows/lighthouse.yml | 52 ++++++++++++++++++++++++++++++++ lighthouserc.js | 10 ++++++ 2 files changed, 62 insertions(+) create mode 100644 .github/workflows/lighthouse.yml create mode 100644 lighthouserc.js diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml new file mode 100644 index 000000000..524e138d5 --- /dev/null +++ b/.github/workflows/lighthouse.yml @@ -0,0 +1,52 @@ +name: Lighthouse CI +on: + push: + branches-ignore: + - master + +jobs: + build: + runs-on: ubuntu-latest + + steps: + - uses: actions/checkout@v2 + + - name: Read .nvmrc + run: echo ::set-output name=NVMRC::$(cat .nvmrc) + id: nvm + + - name: Use Node + uses: actions/setup-node@v1 + with: + always-auth: true + registry-url: https://registry.npmjs.org + node-version: '${{ steps.nvm.outputs.NVMRC }}' + + - name: Get yarn cache directory path + id: yarn-cache-dir-path + run: echo "::set-output name=dir::$(yarn cache dir)" + + - name: Use cached node_modules + uses: actions/cache@v2 + id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) + with: + path: ${{ steps.yarn-cache-dir-path.outputs.dir }} + key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} + restore-keys: | + ${{ runner.os }}-yarn- + + - name: Install dependencies + run: yarn install --frozen-lockfile --non-interactive + + - name: Audit URLs using Lighthouse + uses: treosh/lighthouse-ci-action@v3 + with: + urls: | + https://operationcode.org/ + https://operationcode.org/about/ + https://operationcode.org/events/ + https://operationcode.org/get_involved/ + https://operationcode.org/donate/ + configPath: './lighthouserc.js' + uploadArtifacts: true + temporaryPublicStorage: true \ No newline at end of file diff --git a/lighthouserc.js b/lighthouserc.js new file mode 100644 index 000000000..b8908f32c --- /dev/null +++ b/lighthouserc.js @@ -0,0 +1,10 @@ +module.exports = { + ci: { + assert: { + preset: 'lighthouse:recommended', + }, + upload: { + target: 'temporary-public-storage', + }, + }, +}; From e7453cd7af86fea594816f5c389ce6cdf86fc643 Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Tue, 6 Oct 2020 16:39:57 +0530 Subject: [PATCH 2/8] added in mergify --- .github/workflows/lighthouse.yml | 4 ++-- .mergify.yml | 2 ++ 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 524e138d5..dacdd49be 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -1,11 +1,11 @@ -name: Lighthouse CI +name: lighthouse on: push: branches-ignore: - master jobs: - build: + performance_check: runs-on: ubuntu-latest steps: diff --git a/.mergify.yml b/.mergify.yml index 34d299d45..97f715040 100644 --- a/.mergify.yml +++ b/.mergify.yml @@ -8,9 +8,11 @@ pull_request_rules: - 'status-success=ci/circleci: lint' - 'status-success=ci/circleci: unit_tests' - 'status-success=cypress: all tests' + - 'status-success=lighthouse/performance_check' - status-success=codeclimate/diff-coverage - status-success=codeclimate/total-coverage actions: merge: method: rebase strict: true + \ No newline at end of file From 24798829811656f8bd373861fd9a468d46912f9e Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Thu, 8 Oct 2020 12:40:09 +0530 Subject: [PATCH 3/8] updated lighthouse actions --- .github/workflows/lighthouse.yml | 9 +-------- lighthouserc.js | 3 --- 2 files changed, 1 insertion(+), 11 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index dacdd49be..2ef24ef3e 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -1,8 +1,5 @@ name: lighthouse -on: - push: - branches-ignore: - - master +on: [push, pull_request] jobs: performance_check: @@ -43,10 +40,6 @@ jobs: with: urls: | https://operationcode.org/ - https://operationcode.org/about/ - https://operationcode.org/events/ - https://operationcode.org/get_involved/ - https://operationcode.org/donate/ configPath: './lighthouserc.js' uploadArtifacts: true temporaryPublicStorage: true \ No newline at end of file diff --git a/lighthouserc.js b/lighthouserc.js index b8908f32c..9a1a8b072 100644 --- a/lighthouserc.js +++ b/lighthouserc.js @@ -1,8 +1,5 @@ module.exports = { ci: { - assert: { - preset: 'lighthouse:recommended', - }, upload: { target: 'temporary-public-storage', }, From e2effde25efb8b92cd04393938f81bede3120435 Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Sun, 11 Oct 2020 11:05:24 +0530 Subject: [PATCH 4/8] added github status check and some assertions --- .github/workflows/lighthouse.yml | 6 ++++-- lighthouserc.js | 15 +++++++++++++++ 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 2ef24ef3e..e85598137 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -7,6 +7,8 @@ jobs: steps: - uses: actions/checkout@v2 + with: + ref: ${{ github.event.pull_request.head.sha }} - name: Read .nvmrc run: echo ::set-output name=NVMRC::$(cat .nvmrc) @@ -37,9 +39,9 @@ jobs: - name: Audit URLs using Lighthouse uses: treosh/lighthouse-ci-action@v3 + env: + LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} with: - urls: | - https://operationcode.org/ configPath: './lighthouserc.js' uploadArtifacts: true temporaryPublicStorage: true \ No newline at end of file diff --git a/lighthouserc.js b/lighthouserc.js index 9a1a8b072..b11659ceb 100644 --- a/lighthouserc.js +++ b/lighthouserc.js @@ -1,7 +1,22 @@ module.exports = { ci: { + collect: { + numberOfRuns: 3, + url: ['https://operationcode.org/'], + }, upload: { target: 'temporary-public-storage', }, + assert: { + assertions: { + 'categories:accessibility': ['error', { minScore: 0.9 }], + 'categories:best-practices': ['error', { minScore: 0.9 }], + 'categories:performance': ['warn', { minScore: 0.75 }], + 'categories:seo': ['warn', { minScore: 0.9 }], + 'dom-size': ['warn', { maxNumericValue: 2500 }], + 'first-contentful-paint': ['error', { maxNumericValue: 3000 }], + interactive: ['error', { maxNumericValue: 7000 }], + }, + }, }, }; From f93b932410781df21e30ce4c1b5d990acfe51d05 Mon Sep 17 00:00:00 2001 From: Kyle Holmberg Date: Wed, 14 Oct 2020 17:07:07 -0700 Subject: [PATCH 5/8] fix typo --- .github/workflows/lighthouse.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index e85598137..8429e1eb6 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -40,8 +40,8 @@ jobs: - name: Audit URLs using Lighthouse uses: treosh/lighthouse-ci-action@v3 env: - LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} + LHCI_GITHUB_TOKEN: ${{ secrets.LHCI_GITHUB_TOKEN }} with: configPath: './lighthouserc.js' uploadArtifacts: true - temporaryPublicStorage: true \ No newline at end of file + temporaryPublicStorage: true From 9b07d29e343f8ce97a5106df7b7acfa60d1874fe Mon Sep 17 00:00:00 2001 From: Kyle Holmberg Date: Wed, 14 Oct 2020 17:07:55 -0700 Subject: [PATCH 6/8] fix typo - for real! --- .github/workflows/lighthouse.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 8429e1eb6..bb1eae465 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -40,7 +40,7 @@ jobs: - name: Audit URLs using Lighthouse uses: treosh/lighthouse-ci-action@v3 env: - LHCI_GITHUB_TOKEN: ${{ secrets.LHCI_GITHUB_TOKEN }} + LHCI_GITHUB_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} with: configPath: './lighthouserc.js' uploadArtifacts: true From 4da769b55b57a6b10b18445913e0c0713a56778b Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Sun, 18 Oct 2020 10:14:24 +0530 Subject: [PATCH 7/8] replaced treosh with lhci --- .github/workflows/lighthouse.yml | 7 ++++++- lighthouserc.js | 5 +++-- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index e85598137..78447ad53 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -37,8 +37,13 @@ jobs: - name: Install dependencies run: yarn install --frozen-lockfile --non-interactive + - name: Run Build + run: yarn build + - name: Audit URLs using Lighthouse - uses: treosh/lighthouse-ci-action@v3 + run: | + npm install -g @lhci/cli@0.4.x + lhci autorun env: LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} with: diff --git a/lighthouserc.js b/lighthouserc.js index b11659ceb..3c40464b0 100644 --- a/lighthouserc.js +++ b/lighthouserc.js @@ -2,6 +2,7 @@ module.exports = { ci: { collect: { numberOfRuns: 3, + startServerCommand: 'yarn start', url: ['https://operationcode.org/'], }, upload: { @@ -11,11 +12,11 @@ module.exports = { assertions: { 'categories:accessibility': ['error', { minScore: 0.9 }], 'categories:best-practices': ['error', { minScore: 0.9 }], - 'categories:performance': ['warn', { minScore: 0.75 }], + 'categories:performance': ['warn', { minScore: 0.7 }], 'categories:seo': ['warn', { minScore: 0.9 }], 'dom-size': ['warn', { maxNumericValue: 2500 }], 'first-contentful-paint': ['error', { maxNumericValue: 3000 }], - interactive: ['error', { maxNumericValue: 7000 }], + interactive: ['error', { maxNumericValue: 8000 }], }, }, }, From 397540d5dd7e4251ef49186607555a8e13cfcaf2 Mon Sep 17 00:00:00 2001 From: BhuwanChandra Date: Wed, 21 Oct 2020 23:39:19 +0530 Subject: [PATCH 8/8] updated lighthouse check --- .github/workflows/lighthouse.yml | 111 +++++++++++++++++-------------- 1 file changed, 62 insertions(+), 49 deletions(-) diff --git a/.github/workflows/lighthouse.yml b/.github/workflows/lighthouse.yml index 87be090d4..03c071277 100644 --- a/.github/workflows/lighthouse.yml +++ b/.github/workflows/lighthouse.yml @@ -1,52 +1,65 @@ -name: lighthouse +name: Lighthouse Audit + on: [push, pull_request] jobs: - performance_check: - runs-on: ubuntu-latest - - steps: - - uses: actions/checkout@v2 - with: - ref: ${{ github.event.pull_request.head.sha }} - - - name: Read .nvmrc - run: echo ::set-output name=NVMRC::$(cat .nvmrc) - id: nvm - - - name: Use Node - uses: actions/setup-node@v1 - with: - always-auth: true - registry-url: https://registry.npmjs.org - node-version: '${{ steps.nvm.outputs.NVMRC }}' - - - name: Get yarn cache directory path - id: yarn-cache-dir-path - run: echo "::set-output name=dir::$(yarn cache dir)" - - - name: Use cached node_modules - uses: actions/cache@v2 - id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-yarn- - - - name: Install dependencies - run: yarn install --frozen-lockfile --non-interactive - - - name: Run Build - run: yarn build - - - name: Audit URLs using Lighthouse - run: | - npm install -g @lhci/cli@0.4.x - lhci autorun - env: - LHCI_GITHUB_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} - with: - configPath: './lighthouserc.js' - uploadArtifacts: true - temporaryPublicStorage: true + performance_check: + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - name: Add comment to PR + id: loading_comment_to_pr + uses: marocchino/sticky-pull-request-comment@v1 + with: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + number: ${{ github.event.issue.number }} + header: lighthouse + message: | + Running Lighthouse audit... + - name: Capture Vercel preview URL + id: vercel_preview_url + uses: aaron-binary/vercel-preview-url-action@v0.0.2 + with: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + - uses: actions/checkout@v2 + - name: Audit preview URL with Lighthouse + id: lighthouse_audit + uses: treosh/lighthouse-ci-action@v3 + with: + urls: | + ${{ steps.vercel_preview_url.outputs.vercel_preview_url }} + uploadArtifacts: true + temporaryPublicStorage: true + - name: Format lighthouse score + id: format_lighthouse_score + uses: actions/github-script@v3 + 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: Add comment to PR + id: comment_to_pr + uses: marocchino/sticky-pull-request-comment@v1 + with: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + number: ${{ github.event.issue.number }} + header: lighthouse + message: | + ${{ steps.format_lighthouse_score.outputs.comment }}