Repository: andreasonny83/lighthouse-ci Branch: main Commit: c600b8792a54 Files: 27 Total size: 53.8 KB Directory structure: gitextract_dye7ihm5/ ├── .all-contributorsrc ├── .editorconfig ├── .gitignore ├── .npmrc ├── .prettierrc ├── .snyk ├── .travis.yml ├── LICENSE ├── README.md ├── __tests__/ │ ├── budgets-analyzer.test.js │ ├── helpers.test.js │ ├── reporter.test.js │ └── score-analyzer.test.js ├── bin/ │ └── cli.js ├── demo/ │ ├── .dockerignore │ ├── .npmrc │ ├── Dockerfile │ ├── Makefile │ ├── index.html │ └── package.json ├── lib/ │ ├── budgets-analyzer.js │ ├── calculate-results.js │ ├── config.js │ ├── helpers.js │ ├── lighthouse-reporter.js │ └── score-analyzer.js └── package.json ================================================ FILE CONTENTS ================================================ ================================================ FILE: .all-contributorsrc ================================================ { "projectName": "lighthouse-ci", "projectOwner": "andreasonny83", "repoType": "github", "repoHost": "https://github.com", "files": [ "README.md" ], "imageSize": 100, "commit": true, "contributors": [ { "login": "andreasonny83", "name": "Andrea Sonny", "avatar_url": "https://avatars0.githubusercontent.com/u/8806300?v=4", "profile": "https://about.me/andreasonny83", "contributions": [ "question", "code", "doc" ] }, { "login": "celsosantarosa", "name": "Celso Santa Rosa", "avatar_url": "https://avatars1.githubusercontent.com/u/1007970?v=4", "profile": "https://snap-ci.com", "contributions": [ "code" ] }, { "login": "BenAHammond", "name": "Ben Hammond", "avatar_url": "https://avatars3.githubusercontent.com/u/3516389?v=4", "profile": "https://github.com/BenAHammond", "contributions": [ "bug", "code" ] }, { "login": "alexecus", "name": "Alex Tenepere", "avatar_url": "https://avatars1.githubusercontent.com/u/12739106?v=4", "profile": "https://github.com/alexecus", "contributions": [ "bug", "code" ] }, { "login": "ikigeg", "name": "Michael Griffiths", "avatar_url": "https://avatars0.githubusercontent.com/u/8846301?v=4", "profile": "https://ikigeg.com", "contributions": [ "code" ] }, { "login": "cmarkwell", "name": "Connor Markwell", "avatar_url": "https://avatars0.githubusercontent.com/u/23330646?v=4", "profile": "https://github.com/cmarkwell", "contributions": [ "code" ] }, { "login": "Juuro", "name": "Sebastian Engel", "avatar_url": "https://avatars2.githubusercontent.com/u/559017?v=4", "profile": "https://github.com/Juuro", "contributions": [ "bug", "code" ] }, { "login": "asmagin", "name": "Alex Smagin", "avatar_url": "https://avatars3.githubusercontent.com/u/1803342?v=4", "profile": "https://asmagin.com/", "contributions": [ "code", "ideas" ] }, { "login": "marcschaller", "name": "Marc Schaller", "avatar_url": "https://avatars2.githubusercontent.com/u/31402947?v=4", "profile": "https://github.com/marcschaller", "contributions": [ "bug", "code" ] }, { "login": "Remi-p", "name": "Rémi Perrot", "avatar_url": "https://avatars3.githubusercontent.com/u/6367611?v=4", "profile": "https://github.com/Remi-p", "contributions": [ "bug", "code" ] } ], "commitConvention": "none" } ================================================ FILE: .editorconfig ================================================ root = true [*] indent_style = space indent_size = 2 end_of_line = lf charset = utf-8 trim_trailing_whitespace = true insert_final_newline = true [Makefile] indent_style = tab indent_size = 2 ================================================ FILE: .gitignore ================================================ # Logs logs *.log npm-debug.log* yarn-debug.log* yarn-error.log* # Runtime data pids *.pid *.seed *.pid.lock # Directory for instrumented libs generated by jscoverage/JSCover lib-cov # Coverage directory used by tools like istanbul coverage # Lighthouse /Lighthouse /demo/Lighthouse budget.json # nyc test coverage .nyc_output # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) .grunt # Bower dependency directory (https://bower.io/) bower_components # node-waf configuration .lock-wscript # Compiled binary addons (https://nodejs.org/api/addons.html) build/Release # Dependency directories node_modules/ jspm_packages/ # TypeScript v1 declaration files typings/ # Optional npm cache directory .npm # Optional eslint cache .eslintcache # Optional REPL history .node_repl_history # Output of 'npm pack' *.tgz # Yarn Integrity file .yarn-integrity # dotenv environment variables file .env # next.js build output .next # vuepress build output .vuepress/dist # Serverless directories .serverless # VSCode .vscode/ ================================================ FILE: .npmrc ================================================ registry=https://registry.npmjs.org/ ================================================ FILE: .prettierrc ================================================ { "trailingComma": "all", "semi": true, "singleQuote": true, "printWidth": 120, "useTabs": false, "tabWidth": 2, "bracketSpacing": true } ================================================ FILE: .snyk ================================================ # Snyk (https://snyk.io) policy file, patches or ignores known vulnerabilities. version: v1.16.0 ignore: {} # patches apply the minimum changes required to fix a vulnerability patch: SNYK-JS-LODASH-567746: - lighthouse > inquirer > lodash: patched: '2020-07-02T08:17:50.395Z' ================================================ FILE: .travis.yml ================================================ language: node_js node_js: - '10.16' before_script: - export DISPLAY=:99.0 - export CHROME_PATH="$(pwd)/chrome-linux/chrome" services: - xvfb addons: chrome: stable ================================================ FILE: LICENSE ================================================ MIT License Copyright (c) 2018 AndreaSonny (https://github.com/andreasonny83) Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ================================================ FILE: README.md ================================================ # Lighthouse CI [![Build Status](https://travis-ci.com/andreasonny83/lighthouse-ci.svg?branch=main)](https://travis-ci.com/andreasonny83/lighthouse-ci) [![All Contributors](https://img.shields.io/badge/all_contributors-8-orange.svg?style=flat-square)](#contributors) [![npm version](https://badge.fury.io/js/lighthouse-ci.svg)](https://badge.fury.io/js/lighthouse-ci) [![npm](https://img.shields.io/npm/dt/lighthouse-ci.svg)](https://www.npmjs.com/package/lighthouse-ci) [![Known Vulnerabilities](https://snyk.io/test/github/andreasonny83/lighthouse-ci/badge.svg?targetFile=package.json)](https://snyk.io/test/github/andreasonny83/lighthouse-ci?targetFile=package.json) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) [![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg)](https://github.com/xojs/xo) > A useful wrapper around Google Lighthouse CLI ## NOTE #### Node v12 is now the minimum required version starting from Lighthouse CI v.1.13.0 Lighthouse CI logo ## Install ``` $ npm install -g lighthouse-ci ``` ## Table of Contents - [Lighthouse CI](#lighthouse-ci) - [NOTE](#note) - [Node v12 is now the minimum required version starting from Lighthouse CI v.1.13.0](#node-v12-is-now-the-minimum-required-version-starting-from-lighthouse-ci-v1130) - [Install](#install) - [Table of Contents](#table-of-contents) - [Usage](#usage) - [CLI](#cli) - [Lighthouse flags](#lighthouse-flags) - [Chrome flags](#chrome-flags) - [Configuration](#configuration) - [Budgets](#budgets) - [Option 1.](#option-1) - [Option 2.](#option-2) - [Option 3.](#option-3) - [Performance Budget](#performance-budget) - [Timing Budget](#timing-budget) - [Codechecks](#codechecks) - [Demo App](#demo-app) - [How to](#how-to) - [Test a page that requires authentication](#test-a-page-that-requires-authentication) - [Wait for post-load JavaScript to execute before ending a trace](#wait-for-post-load-javascript-to-execute-before-ending-a-trace) - [Contributors](#contributors) - [License](#license) ## Usage ```sh lighthouse-ci --help ``` ## CLI ``` $ lighthouse-ci --help Usage $ lighthouse-ci Example $ lighthouse-ci https://example.com $ lighthouse-ci https://example.com -s $ lighthouse-ci https://example.com --score=75 $ lighthouse-ci https://example.com --accessibility=90 --seo=80 $ lighthouse-ci https://example.com --accessibility=90 --seo=80 --report=folder $ lighthouse-ci https://example.com --report=folder --config-path=configs.json Options -s, --silent Run Lighthouse without printing report log --report= Generate an HTML report inside a specified folder --filename= Specify the name of the generated HTML report file (requires --report) -json, --jsonReport Generate JSON report in addition to HTML (requires --report) --config-path The path to the Lighthouse config JSON (read more here: https://github.com/GoogleChrome/lighthouse/blob/master/docs/configuration.md) --budget-path The path to the Lighthouse budgets config JSON (read more here: https://developers.google.com/web/tools/lighthouse/audits/budgets) --score= Specify a score threshold for the CI to pass --performance= Specify a minimal performance score for the CI to pass --pwa= Specify a minimal pwa score for the CI to pass --accessibility= Specify a minimal accessibility score for the CI to pass --best-practice= [DEPRECATED] Use best-practices instead --best-practices= Specify a minimal best-practice score for the CI to pass --seo= Specify a minimal seo score for the CI to pass --fail-on-budgets Specify CI should fail if budgets are exceeded --budget.. Specify individual budget threshold (if --budget-path not set) In addition to listed "lighthouse-ci" configuration flags, it is also possible to pass any native "lighthouse" flag To see the full list of available flags, please refer to the official Google Lighthouse documentation at https://github.com/GoogleChrome/lighthouse#cli-options ``` ## Lighthouse flags In addition to listed `lighthouse-ci` configuration flags, it is also possible to pass any native `lighthouse` flags. To see the full list of available flags, please refer to the official [Google Lighthouse documentation](https://github.com/GoogleChrome/lighthouse#cli-options). eg. ```sh # Launches browser, collects artifacts, saves them to disk (in `./test-report/`) and quits $ lighthouse-ci --gather-mode=test-report https://my.website.com # skips browser interaction, loads artifacts from disk (in `./test-report/`), runs audits on them, generates report $ lighthouse-ci --audit-mode=test-report https://my.website.com ``` ### Chrome flags In addition of the lighthouse flags, you can also specify extra chrome flags comma separated. eg. ```sh $ lighthouse-ci --chrome-flags=--cellular-only,--force-ui-direction=rtl https://my.website.com ``` eg. ```sh $ lighthouse-ci --emulated-form-factor desktop --seo 92 https://my.website.com ``` ## Configuration Lighthouse CI allows you to pass a custom Lighthouse configuration file. Read [Lighthouse Configuration](https://github.com/GoogleChrome/lighthouse/blob/master/docs/configuration.md) to learn more about the configuration options available. Just generate your configuration file. For example this `config.json` ```json { "extends": "lighthouse:default", "audits": [ "user-timings", "critical-request-chains" ], "categories": { "performance": { "name": "Performance Metrics", "description": "Sample description", "audits": [ {"id": "user-timings", "weight": 1}, {"id": "critical-request-chains", "weight": 1} ] } } } ``` Then run Lighthouse CI with the `--config-path` flag ```sh $ lighthouse-ci https://example.com --report=reports --config-path=config.json ``` The generated report inside `reports` folder will follow the custom configuration listed under the `config.json` file. ## Budgets Lighthouse CI allows you to pass a budget configuration file (see [Lighthouse Budgets](https://developers.google.com/web/tools/lighthouse/audits/budgets)). There are several options to pass a budget config: #### Option 1. Add configurations to your `config.json` file like and use instructions above. ``` json { "extends": "lighthouse:default", "settings": { "budgets": [ { "resourceCounts": [ { "resourceType": "total", "budget": 10 }, ], "resourceSizes": [ { "resourceType": "total", "budget": 100 }, ] } ] } } ``` #### Option 2. Generate `budget.json` with content like: ``` json [ { "resourceCounts": [ { "resourceType": "total", "budget": 10 }, ], "resourceSizes": [ { "resourceType": "total", "budget": 100 }, ] } ] ``` Then run Lighthouse CI with the `--budget-path` flag ```sh $ lighthouse-ci https://example.com --report=reports --budget-path=budget.json ``` #### Option 3. Pass individual parameters via CLI ```sh $ lighthouse-ci https://example.com --report=reports --budget.counts.total=20 --budget.sizes.fonts=100000 ``` ### Performance Budget Performance budgets can be specified inside your [budget configuration file)(#budgets). You can specify any available [performance budget](https://github.com/GoogleChrome/lighthouse/blob/master/docs/performance-budgets.md#budgetjson) like in the following example ```json [ { "path": "/*", "resourceSizes": [ { "resourceType": "script", "budget": 400000 }, { "resourceType": "total", "budget": 5050 } ], "resourceCounts": [ { "resourceType": "total", "budget": 95 }, { "resourceType": "third-party", "budget": 55 } ] } ] ``` ### Timing Budget Timing budgets can be specified inside your [budget configuration file)(#budgets). You can specify any available [timing budget](https://github.com/GoogleChrome/lighthouse/blob/master/docs/performance-budgets.md#timing-budgets) like in the following example ```json [ { "path": "/*", "timings": [ { "metric": "interactive", "budget": 100 }, { "metric": "first-meaningful-paint", "budget": 100 } ] } ] ``` ## Codechecks You can now easily integrate Lighthouse-CI as part of your automated CI with [codechecks.io](https://codechecks.io/). **Running Lighthouse-CI with Codechecks** ```sh $ npm install --save-dev @codechecks/client @codechecks/lighthouse-keeper ``` Now, create a `codechecks.yml` (json is supported as well) file required for codechecks to automatically run against your project. `codechecks.yml:` ```yml checks: - name: lighthouse-keeper options: # just provide path to your build buildPath: ./build # or full url # url: https://google.com # ... ``` Read more from the official documentation from [https://github.com/codechecks/lighthouse-keeper](https://github.com/codechecks/lighthouse-keeper). Read more about Codechecks on the [official project website](https://codechecks.io/) ## Demo App This project contains a demo folder where a project as been created for demo purposes only. Once inside the `demo` folder, if you have Docker installed on your machine, you can simply launch the demo app inside a Docker container with `make demo`. If you just want to run the demo locally, make sure to install the node dependencies first with `npm install`, then run the demo with: ``` $ npm start ``` ## How to ### Test a page that requires authentication By default `lighthouse-cli` is just creating the report against a specific URL without letting the engineer to interact with the browser. Sometimes, however, the page for which you want to generate the report, requires the user to be authenticated. Depending on the authentication mechanism, you can inject extra header information into the page. ```sh lighthouse-ci https://example.com --extra-headers=./extra-headers.js ``` Where `extra-headers.json` contains: ```js module.exports = { Authorization: 'Bearer MyAccessToken', Cookie: "user=MySecretCookie;" }; ``` ### Wait for post-load JavaScript to execute before ending a trace Your website might require extra time to load and execute all the JavaScript logic. It is possible to let LightHouse wait for a certain amount of time, before ending a trace, by providing a `pauseAfterLoadMs` value to a custom configuration file. eg. ```sh lighthouse-ci https://example.com --config-path ./config.json ``` Where `config.json` contains: ```json { "extends": "lighthouse:default", "passes": [{ "recordTrace": true, "pauseAfterLoadMs": 5000, "networkQuietThresholdMs": 5000 }] } ``` ## Contributors Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):

Andrea Sonny

💬 💻 📖

Celso Santa Rosa

💻

Ben Hammond

🐛 💻

Alex Tenepere

🐛 💻

Michael Griffiths

💻

Connor Markwell

💻

Sebastian Engel

🐛 💻

Alex Smagin

💻 🤔

Marc Schaller

🐛 💻

Rémi Perrot

🐛 💻
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome! ## License MIT --- Created with 🦄 by [andreasonny83](https://about.me/andreasonny83) ================================================ FILE: __tests__/budgets-analyzer.test.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const analyzeBudgets = require('../lib/budgets-analyzer'); describe('budgets-analyzer', () => { const processExit = process.exit; beforeEach(() => { process.exit = jest.fn(); }); afterEach(() => { process.exit = processExit; }); it('should return `false` if any over-budget reported and `--fail-on-budgets` set to `true`', () => { const mockBudgetsReport = { 'total-count': '323 requests', 'total-size': '12677kb', }; const result = analyzeBudgets(mockBudgetsReport, true); expect(result).toEqual(false); }); it('should return `true` if no over-budget reported and `--fail-on-budgets` set to `true`', () => { const mockBudgetsReport = {}; const result = analyzeBudgets(mockBudgetsReport, true); expect(result).toEqual(true); }); it('should return `true` if any over-budget reported and `--fail-on-budgets` set to `false`', () => { const mockBudgetsReport = { 'total-count': '323 requests', 'total-size': '12677kb', }; const result = analyzeBudgets(mockBudgetsReport, true); expect(result).toEqual(false); }); }); ================================================ FILE: __tests__/helpers.test.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const mkdirp = require('mkdirp'); const rimraf = require('rimraf'); const { clean, createDir, scoreReducer, createDefaultConfig, getOwnProps, convertToBudgetList, convertToResourceKey, } = require('../lib/helpers'); jest.mock('rimraf'); jest.mock('mkdirp'); describe('helpers', () => { beforeEach(() => { jest.resetAllMocks(); }); describe('clean', () => { it('should return a promise', () => { // Arrange const response = clean(); // Assert expect(response).toBeInstanceOf(Promise); }); it('should reject the promise if an error if present', () => { // Arrange const expectedError = 'err'; rimraf.mockImplementation((target, callback) => callback(expectedError)); // Act const response = clean(); // Assert expect(response).rejects.toEqual(expectedError); }); it('should try to remove a "lighthouse" folder', () => { // Arrange const expectedFolderName = './lighthouse/'; rimraf.mockImplementation((target, callback) => { expect(target).toEqual(expectedFolderName); callback(); }); // Act const response = clean(); // Assert expect(response).resolves.toEqual(); expect(rimraf).toHaveBeenCalledWith(expectedFolderName, expect.any(Function)); }); }); describe('createDir', () => { it('should return a promise', () => { // Arrange const response = createDir(); // Assert expect(response).toBeInstanceOf(Promise); }); it('should reject the promise if an error if present', () => { // Arrange const expectedError = 'err'; mkdirp.mockImplementation((target, callback) => callback(expectedError)); // Act const response = createDir(); // Assert expect(response).rejects.toEqual(expectedError); }); it('should try to create a "lighthouse" folder', () => { // Arrange const expectedFolderName = './lighthouse'; mkdirp.mockImplementation((target, callback) => { expect(target).toEqual(expectedFolderName); callback(); }); // Act const response = createDir(); // Assert expect(response).resolves.toEqual(); expect(mkdirp).toHaveBeenCalledWith(expectedFolderName, expect.any(Function)); }); }); describe('scoreReducer', () => { it('should return a score if present in the flags', () => { // Arrange const expectedScore = 'testScore'; const mockFlags = { score: expectedScore }; // Act const response = scoreReducer(mockFlags); // Assert expect(response).toEqual(expectedScore); }); it('should return an object of only known flags', () => { // Arrange const mockFlags = { performance: '10', accessibility: '90', test: '10', }; const mockScores = ['performance', 'pwa', 'accessibility']; const expectedResponse = { accessibility: '90', performance: '10' }; // Act const response = scoreReducer(mockFlags, mockScores); // Assert expect(response).toEqual(expectedResponse); }); }); describe('getOwnProps', () => { it('should return all own props', () => { // Arrange const expectedProp = 'foo'; const mockObject = { foo: 0 }; // Act const response = getOwnProps(mockObject); // Assert expect(response).not.toBeNull(); expect(response).toContain(expectedProp); expect(response).toHaveLength(1); }); it('should not return inherited props', () => { // Arrange const expectedProp = 'foo'; const Func = function () { this.foo = 1; }; const input = new Func(); Func.prototype.bar = 2; // Act const response = getOwnProps(input); // Assert expect(response).not.toBeNull(); expect(response).toContain(expectedProp); expect(response).toHaveLength(1); }); }); describe('createDefaultConfig', () => { it('should not override existing config', () => { // Arrange const expectedConfig = { foo: 1, bar: 2 }; // Act const response = createDefaultConfig(expectedConfig); // Assert expect(response).toEqual(expectedConfig); }); it('should set `extends` and `settings`', () => { // Arrange const expectedExtends = 'lighthouse:default'; // Act const response = createDefaultConfig(); // Assert expect(response.extends).toEqual(expectedExtends); expect(response.settings).not.toBeNull(); }); }); describe('convertToBudgetList', () => { it('Should return list of objects in specified format', () => { // Arrange const expected = [ { resourceType: 'script', budget: 1, }, { resourceType: 'total', budget: 2, }, ]; const input = { script: 1, total: 2 }; // Act const response = convertToBudgetList(input); // Assert expect(response).toHaveLength(2); expect(response).toEqual(expected); }); }); describe('convertToResourceKey', () => { it('Should convert `sizes` to `resourceSizes`', () => { // Arrange const expected = 'resourceSizes'; const input = 'sizes'; // Act const response = convertToResourceKey(input); // Assert expect(response).toEqual(expected); }); }); }); ================================================ FILE: __tests__/reporter.test.js ================================================ const writeReport = require('../lib/lighthouse-reporter'); describe('Reporter', () => { jest.setTimeout(20000); // Allows more time to run all tests it('should launch Chrome and generate a report', async () => { const result = await writeReport('http://example.com/'); expect(result).toEqual( expect.objectContaining({ categoryReport: { performance: expect.any(Number), accessibility: expect.any(Number), 'best-practices': expect.any(Number), seo: expect.any(Number), pwa: expect.any(Number), }, budgetsReport: expect.any(Object), htmlReport: expect.any(Object), jsonReport: expect.any(Object), }), ); }); }); ================================================ FILE: __tests__/score-analyzer.test.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const analyzeScore = require('../lib/score-analyzer'); describe('score-analyzer', () => { const processExit = process.exit; beforeEach(() => { process.exit = jest.fn(); }); afterEach(() => { process.exit = processExit; }); it('a threshold must be specified', () => { const mockCategoryReport = { performance: 0.07, pwa: 0.36, accessibility: 0.57, 'best-practices': 0.69, seo: 0.73, }; expect(() => analyzeScore(mockCategoryReport)).toThrowError('Invalid threshold score.'); }); it('should return `false` if one or more category index is below the threshold', () => { const threshold = 75; const mockCategoryReport = { performance: 7, pwa: 36, accessibility: 57, 'best-practices': 69, seo: 73, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); it('should return `true` if all the category indexes are above the threshold', () => { const threshold = 70; const mockCategoryReport = { performance: 70, pwa: 90, accessibility: 87, 'best-practices': 79, seo: 73, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); describe('category thresholds', () => { const mockCategoryReport = { performance: 70, pwa: 90, accessibility: 10, 'best-practices': 10, seo: 10, }; it('should return `true` if the target categories indexes are above the thresholds', () => { const threshold = { performance: 70, pwa: 80, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should pass if the target categories indexes are above the "best-practices" thresholds', () => { const threshold = { 'best-practices': 10, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should pass if the target categories indexes are above the "seo" thresholds', () => { const threshold = { seo: 10, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should pass if the target categories indexes are above the "performance" thresholds', () => { const threshold = { performance: 70, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should pass if the target categories indexes are above the "pwa" thresholds', () => { const threshold = { pwa: 90, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should pass if the target categories indexes are above the "accessibility" thresholds', () => { const threshold = { accessibility: 10, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(true); }); it('should fail if the target categories indexes are above the "best-practices" thresholds', () => { const threshold = { 'best-practices': 11, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); it('should fail if the target categories indexes are above the "seo" thresholds', () => { const threshold = { seo: 11, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); it('should fail if the target categories indexes are above the "performance" thresholds', () => { const threshold = { performance: 71, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); it('should fail if the target categories indexes are above the "pwa" thresholds', () => { const threshold = { pwa: 91, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); it('should fail if the target categories indexes are above the "accessibility" thresholds', () => { const threshold = { accessibility: 11, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); }); it('should return `false` if one or more target category index is below the thresholds', () => { const threshold = { performance: 70, pwa: 80, }; const mockCategoryReport = { performance: 70, pwa: 79, accessibility: 10, 'best-practices': 10, seo: 10, }; const result = analyzeScore(mockCategoryReport, threshold); expect(result).toEqual(false); }); }); ================================================ FILE: bin/cli.js ================================================ #!/usr/bin/env node /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const fs = require('fs'); const path = require('path'); const meow = require('meow'); const ora = require('ora'); const chalk = require('chalk'); const updateNotifier = require('update-notifier'); const pkg = require('../package.json'); const { getChromeFlags } = require('../lib/config'); const lighthouseReporter = require('../lib/lighthouse-reporter'); const { calculateResults } = require('../lib/calculate-results'); const spinner = ora({ color: 'yellow', }); const cli = meow( ` Usage $ lighthouse-ci Example $ lighthouse-ci https://example.com $ lighthouse-ci https://example.com -s $ lighthouse-ci https://example.com --score=75 $ lighthouse-ci https://example.com --accessibility=90 --seo=80 $ lighthouse-ci https://example.com --accessibility=90 --seo=80 --report=folder $ lighthouse-ci https://example.com -report=folder --config-path=configs.json Options -s, --silent Run Lighthouse without printing report log --report= Generate an HTML report inside a specified folder --filename= Specify the name of the generated HTML report file (requires --report) -json, --jsonReport Generate JSON report in addition to HTML (requires --report) --config-path The path to the Lighthouse config JSON (read more here: https://github.com/GoogleChrome/lighthouse/blob/master/docs/configuration.md) --budget-path The path to the Lighthouse budgets config JSON (read more here: https://developers.google.com/web/tools/lighthouse/audits/budgets) --score= Specify a score threshold for the CI to pass --performance= Specify a minimal performance score for the CI to pass --pwa= Specify a minimal pwa score for the CI to pass --accessibility= Specify a minimal accessibility score for the CI to pass --best-practice= [DEPRECATED] Use best-practices instead --best-practices= Specify a minimal best-practice score for the CI to pass --seo= Specify a minimal seo score for the CI to pass --fail-on-budgets Specify CI should fail if budgets are exceeded --budget.. Specify individual budget threshold (if --budget-path not set) In addition to listed "lighthouse-ci" configuration flags, it is also possible to pass any native "lighthouse" flag To see the full list of available flags, please refer to the official Google Lighthouse documentation at https://github.com/GoogleChrome/lighthouse#cli-options `, { flags: { report: { type: 'string', }, filename: { type: 'string', alias: 'f', default: 'report.html', }, jsonReport: { type: 'boolean', alias: 'json', default: false, }, silent: { type: 'boolean', alias: 's', default: false, }, score: { type: 'string', }, performance: { type: 'string', }, pwa: { type: 'string', }, accessibility: { type: 'string', }, bestPractice: { type: 'string', }, bestPractices: { type: 'string', }, seo: { type: 'string', }, failOnBudgets: { type: 'boolean', default: false, }, budget: { type: 'string', }, }, }, ); const { report, filename, json, jsonReport, silent, s, score, performance, pwa, accessibility, bestPractice, bestPractices, seo, failOnBudgets, ...lighthouseFlags } = cli.flags; const calculatedBestPractices = bestPractice || bestPractices; const flags = { report, filename, jsonReport: json || jsonReport, silent, s, score, performance, pwa, accessibility, ...(calculatedBestPractices && { 'best-practices': calculatedBestPractices, }), seo, failOnBudgets, }; async function init(args, chromeFlags) { const testUrl = args[0]; // Run Google Lighthouse const { categoryReport, budgetsReport, htmlReport, jsonReport } = await lighthouseReporter( testUrl, flags, chromeFlags, lighthouseFlags, ); const { silent } = flags; if (flags.report) { const outputPath = path.resolve(flags.report, flags.filename); await fs.writeFileSync(outputPath, htmlReport); if (flags.jsonReport && jsonReport) { const jsonReportPath = outputPath.replace(/\.[^.]+$/, '.json'); await fs.writeFileSync(jsonReportPath, jsonReport); } } return { categoryReport, budgetsReport, silent, }; } Promise.resolve() .then(() => { updateNotifier({ pkg }).notify(); if (cli.input.length === 0) { return cli.showHelp(); } spinner.text = `Running Lighthouse on ${cli.input} ...\n`; spinner.start(); return init(cli.input, getChromeFlags()); }) .then(({ categoryReport, budgetsReport, silent }) => { spinner.stop(); if (!silent) { for (const category in categoryReport) { if (typeof categoryReport[category] === 'undefined') { continue; } console.log(`${chalk.yellow(category)}: ${chalk.yellow(categoryReport[category])}`); } for (const budget in budgetsReport) { if (!budgetsReport[budget]) { continue; } if (budgetsReport[budget]) { console.log(`Budget '${chalk.yellow(budget)}' exceeded by ${chalk.yellow(budgetsReport[budget])}`); } } } return { categoryReport, budgetsReport }; }) .then(({ categoryReport, budgetsReport }) => { const result = calculateResults(flags, categoryReport, budgetsReport, failOnBudgets); if (result.passed) { console.log(chalk.green('\nAll checks are passing. 🎉\n')); return process.exit(0); } console.log(chalk.red('\nFailed. ❌')); if (result.score === false) { throw new Error('Target score not reached.'); } if (result.budget === false) { throw new Error('Target budget not reached.'); } throw new Error('lighthouse-ci test failed.'); }) .catch((error) => { spinner.stop(); console.log(chalk.red(error), '\n'); return process.exit(1); }); ================================================ FILE: demo/.dockerignore ================================================ node_modules *.log ================================================ FILE: demo/.npmrc ================================================ package-lock=false ================================================ FILE: demo/Dockerfile ================================================ FROM node:10 WORKDIR /demo ENV CHROME_BIN=/usr/bin/google-chrome-stable EXPOSE 8080 # Install Chrome RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - RUN sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list' RUN apt-get update && apt-get install -y google-chrome-stable COPY package.json . RUN npm install COPY . . ================================================ FILE: demo/Makefile ================================================ .PHONY: demo build run dev build: docker build --rm -t sonny/lighthouse-demo . run: docker run --rm sonny/lighthouse-demo npm start dev: docker run -it --rm -v ${PWD}:/demo sonny/lighthouse-demo /bin/bash demo: build run ================================================ FILE: demo/index.html ================================================ Document

Allo!

================================================ FILE: demo/package.json ================================================ { "name": "demo-project", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "serve": "http-server", "lighthouse": "lighthouse-ci http://127.0.0.1:8080 --report", "start": "concurrently -r -s first -k \"npm run serve\" \"npm run lighthouse\"" }, "author": "", "license": "MIT", "devDependencies": { "concurrently": "^5.1.0", "http-server": "^0.12.1", "lighthouse-ci": "^1.10.0" } } ================================================ FILE: lib/budgets-analyzer.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ function analyzeBudgets(budgetsReport, failOnBudgets) { if (!failOnBudgets) { return true; } const budgetLength = Object.keys(budgetsReport || {}).length; return budgetLength === 0; } module.exports = analyzeBudgets; ================================================ FILE: lib/calculate-results.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const { scoreReducer } = require('./helpers'); const analyzeScore = require('./score-analyzer'); const analyzeBudgets = require('./budgets-analyzer'); const { getScores } = require('./config'); const calculateResults = (flags, categoryReport, budgetsReport, failOnBudgets) => { let thresholds = scoreReducer(flags, getScores()); thresholds = Object.keys(thresholds).length === 0 ? { score: 100, } : thresholds; if (thresholds && Object.keys(thresholds).length > 0) { const isScorePassing = analyzeScore(categoryReport, thresholds); const areBudgetsPassing = analyzeBudgets(budgetsReport, failOnBudgets); if (isScorePassing && areBudgetsPassing) { return { passed: true, }; } return { passed: false, score: isScorePassing, budget: areBudgetsPassing, }; } return { passed: false, }; }; module.exports = { calculateResults, }; ================================================ FILE: lib/config.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const scores = ['performance', 'pwa', 'accessibility', 'best-practices', 'seo']; const chromeFlags = ['--disable-gpu', '--headless', '--no-zygote', '--no-sandbox']; const getScores = () => scores; const getChromeFlags = () => chromeFlags; module.exports = { getScores, getChromeFlags }; ================================================ FILE: lib/helpers.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const mkdirp = require('mkdirp'); const rimraf = require('rimraf'); const clean = () => new Promise((resolve, reject) => { rimraf('./lighthouse/', (err) => { if (err) { return reject(err); } return resolve(); }); }); const createDir = () => new Promise((resolve, reject) => { mkdirp('./lighthouse', (err) => { if (err) { return reject(err); } return resolve(); }); }); const scoreReducer = (flags, scoreList) => { if (flags.score) { return flags.score; } return scoreList.reduce((scores, flag) => { if (!Object.prototype.hasOwnProperty.call(flags, flag)) { return scores; } return { ...scores, [flag]: flags[flag], }; }, {}); }; const createDefaultConfig = (config) => { if (!config) { config = { extends: 'lighthouse:default', settings: {}, }; } if (!config.settings) { config.settings = {}; } return config; }; const getOwnProps = (object) => { return Object.keys(object).filter((key) => Object.prototype.hasOwnProperty.call(object, key)); }; const convertToBudgetList = (object) => { return getOwnProps(object) .filter((key) => object[key]) .reduce((acc, key) => { acc.push({ resourceType: key, budget: object[key], }); return acc; }, []); }; const convertToResourceKey = (key) => 'resource' + key.charAt(0).toUpperCase() + key.slice(1); module.exports = { clean, createDir, scoreReducer, createDefaultConfig, getOwnProps, convertToBudgetList, convertToResourceKey, }; ================================================ FILE: lib/lighthouse-reporter.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ const fs = require('fs'); const path = require('path'); const { promisify } = require('util'); const lighthouse = require('lighthouse'); const chromeLauncher = require('chrome-launcher'); const ReportGenerator = require('lighthouse/report/generator/report-generator'); const chalk = require('chalk'); const { createDefaultConfig, getOwnProps, convertToBudgetList, convertToResourceKey } = require('./helpers'); const readFile = promisify(fs.readFile); const launchChromeAndRunLighthouse = async (url, chromeFlags, lighthouseFlags, configPath, budgetPath) => { const chrome = await chromeLauncher.launch({ chromeFlags, }); const flags = { port: chrome.port, output: 'json', ...lighthouseFlags, }; let config; if (flags.extraHeaders) { let extraHeadersString = flags.extraHeaders; if (extraHeadersString.slice(0, 1) !== '{') { extraHeadersString = await readFile(extraHeadersString, 'UTF-8'); } flags.extraHeaders = JSON.parse(extraHeadersString); } if (configPath) { try { const configJson = await readFile(path.resolve(configPath), 'UTF-8'); config = JSON.parse(configJson); } catch (error) { throw new Error(error.message); } } if (budgetPath) { try { const budgetJson = await readFile(path.resolve(budgetPath), 'UTF-8'); config = createDefaultConfig(config); config.settings.budgets = JSON.parse(budgetJson); } catch (error) { throw new Error(error.message); } } else if (flags && flags.budget) { config = createDefaultConfig(config); const { budget } = flags; const budgetConfigs = getOwnProps(budget) .filter((key) => budget[key] && (key === 'counts' || key === 'sizes')) .reduce( (acc, key) => { acc[convertToResourceKey(key)] = convertToBudgetList(budget[key]); return acc; }, { resourceSizes: [], resourceCounts: [], }, ); config.settings.budgets = [budgetConfigs]; } const result = await lighthouse(url, flags, config); await chrome.kill(); if (!result || !result.lhr) { throw new Error('Something went wrong when running Lighthouse against the given url'); } if (result.lhr.runtimeError) { throw new Error(result.lhr.runtimeError.message); } if (result.lhr.runWarnings.length > 0) { for (const warningMessage of result.lhr.runWarnings) { console.warn(`\n${chalk.yellow('WARNING:')} ${warningMessage}`); } console.warn('\n'); } return result; }; const createHtmlReport = (results, flags) => { if (flags.report) { return ReportGenerator.generateReportHtml(results); } return null; }; const createJsonReport = (results, flags) => { if (flags.report && flags.jsonReport) { return ReportGenerator.generateReport(results, 'json'); } return null; }; const createCategoryReport = (results) => { const { categories } = results; return getOwnProps(categories).reduce((categoryReport, categoryName) => { const category = results.categories[categoryName]; categoryReport[category.id] = Math.round(category.score * 100); return categoryReport; }, {}); }; const createBudgetsReport = (results) => { const items = (results.audits && results.audits['performance-budget'] && results.audits['performance-budget'].details && results.audits['performance-budget'].details.items) || []; const timings = (results.audits && results.audits['timing-budget'] && results.audits['timing-budget'].details && results.audits['timing-budget'].details.items) || []; const report = items.reduce((acc, object) => { if (object.countOverBudget) { acc[object.resourceType + '-count'] = `${object.countOverBudget}`; } if (object.sizeOverBudget) { acc[object.resourceType + '-size'] = `${Math.round(object.sizeOverBudget / 1024, 0)}kb`; } return acc; }, {}); const timingReport = timings.reduce((acc, { overBudget, metric }) => { if (overBudget && typeof overBudget === 'object') { const { value } = overBudget; if (value && typeof value === 'number') { acc[metric] = value; } } if (overBudget && typeof overBudget === 'number') { acc[metric] = `${overBudget}ms`; } return acc; }, {}); return { ...report, ...timingReport }; }; async function writeReport(url, flags = {}, defaultChromeFlags = [], lighthouseFlags = {}) { const { chromeFlags, configPath, budgetPath, ...extraLHFlags } = lighthouseFlags; const customChromeFlags = chromeFlags ? chromeFlags.split(',') : []; const lighthouseResult = await launchChromeAndRunLighthouse( url, [...defaultChromeFlags, ...customChromeFlags], extraLHFlags, configPath, budgetPath, ); const htmlReport = createHtmlReport(lighthouseResult.lhr, flags); const jsonReport = createJsonReport(lighthouseResult.lhr, flags); const categoryReport = createCategoryReport(lighthouseResult.lhr); const budgetsReport = createBudgetsReport(lighthouseResult.lhr); return { categoryReport, budgetsReport, htmlReport, jsonReport }; } module.exports = writeReport; ================================================ FILE: lib/score-analyzer.js ================================================ /** * Copyright (c) 2018-2021 AndreaSonny (https://github.com/andreasonny83) * * This software is released under the MIT License. * https://opensource.org/licenses/MIT */ function analyzeScores(thresholds, categoryReport) { for (const category in categoryReport) { if (!Object.prototype.hasOwnProperty.call(thresholds, category)) { continue; } if (Number(categoryReport[category]) < Number(thresholds[category])) { return false; } } return true; } function analyzeTotalScore(threshold, categoryReport) { for (const category in categoryReport) { if (Number(categoryReport[category]) < Number(threshold)) { return false; } } return true; } function analyzeScore(categoryReport, thresholds) { if (!thresholds || thresholds.length === 0) { throw new Error('Invalid threshold score.'); } return typeof thresholds === 'object' ? analyzeScores(thresholds, categoryReport) : analyzeTotalScore(thresholds, categoryReport); } module.exports = analyzeScore; ================================================ FILE: package.json ================================================ { "name": "lighthouse-ci", "version": "1.13.1", "description": "CLI implementation for running Lighthouse with any CI tool", "scripts": { "test": "npm run format && xo && jest --detectOpenHandles", "xo": "xo", "test:watch": "jest --watchAll --detectOpenHandles", "format": "prettier --write \"**/*.{js,js}\"", "contributors:add": "all-contributors add", "contributors:generate": "all-contributors generate", "release": "np", "snyk-protect": "snyk protect", "prepare": "npm run snyk-protect" }, "type": "commonjs", "dependencies": { "chrome-launcher": "^0.14.0", "lighthouse": "^8.4.0", "meow": "^9.0.0", "mkdirp": "^1.0.4", "ora": "^5.4.0", "rimraf": "^3.0.2", "update-notifier": "^5.1.0" }, "devDependencies": { "@types/jest": "^26.0.24", "@types/ora": "^3.2.0", "all-contributors-cli": "^6.20.0", "chalk": "^4.1.1", "jest": "^27.0.6", "np": "^7.5.0", "prettier": "^2.3.2", "snyk": "^1.660.0", "xo": "~0.36.0" }, "keywords": [ "devtools", "lighthouse", "ci" ], "bin": { "lighthouse-ci": "bin/cli.js" }, "files": [ "lib", "bin", "README.md", "LICENSE" ], "engines": { "node": "^12.20.0 || ^14.13.1 || >=16.0.0" }, "xo": { "prettier": true, "envs": [ "node", "es6", "jest" ], "rules": { "max-params": [ "error", 5 ], "unicorn/no-reduce": 0 } }, "author": "Andrea Sonny ", "license": "MIT", "repository": { "type": "git", "url": "git+https://github.com/andreasonny83/lighthouse-ci.git" }, "bugs": { "url": "https://github.com/andreasonny83/lighthouse-ci.git/issues" }, "homepage": "https://github.com/andreasonny83/lighthouse-ci.git#readme", "snyk": true }