Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/codechecks/lighthouse-keeper
Keep an eye on Google Lighthouse score changes directly on GitHub 💡👀
https://github.com/codechecks/lighthouse-keeper
accessibility codechecks google-lighthouse lighthouse performance score
Last synced: about 1 month ago
JSON representation
Keep an eye on Google Lighthouse score changes directly on GitHub 💡👀
- Host: GitHub
- URL: https://github.com/codechecks/lighthouse-keeper
- Owner: codechecks
- License: mit
- Created: 2019-08-11T17:56:24.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2021-11-28T07:16:31.000Z (about 3 years ago)
- Last Synced: 2024-10-13T08:40:52.387Z (2 months ago)
- Topics: accessibility, codechecks, google-lighthouse, lighthouse, performance, score
- Language: TypeScript
- Homepage: https://codechecks.io
- Size: 11.9 MB
- Stars: 87
- Watchers: 3
- Forks: 6
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
Lighthouse keeper
Keep an eye on Google Lighthouse score changes directly on GitHub 💡👀
Discover performance, accessability, SEO problems before they reach production
## Demo
[Example Pull Request](https://github.com/krzkaczor/lighthouse-keeper-example/pull/2)
## Features
👉 track changes in performance, accessibility etc. directly in GitHub PR interface
👉 get detailed list of new failed audits
👉 automatically fail PRs if score is too low
👉 works with many different [CI providers](https://github.com/codechecks/docs/blob/master/supported-ci.md)
## Install
```sh
npm install --save-dev @codechecks/lighthouse-keeper
```
## Usage
Lighthouse Keeper is built on [Codechecks](https://codechecks.io) — new open source code review
automation platform.
To use it, you need to install Codechecks GitHub App on a given repository and copy project secret
to your CI environment.
## Step by step guide
1. Install codechecks client and lighthouse-keeper:
```
npm install --save-dev @codechecks/client @codechecks/lighthouse-keeper
```
2. Create `codechecks.yml` file in a root of your project. It serves as a central configuration for
all different codechecks plugins.
```yml
checks:
- name: lighthouse-keeper
options:
buildPath: ./build
```
You might want to adjust the build path. To learn about all configuration options check out API
section of this document. We can dry run `lighthouse-keeper` locally. Just make sure that your build
exists and run `npx codechecks`.
Now we need to make sure that it runs on CI.
3. Visit [app.codechecks.io](https://app.codechecks.io).
4. Login with you github account and install Codechecks Github App on a desired repositories. Note:
We don't have access to your code.
5. Find your project on the list and copy secret.
6. Add new environment variable to your CI configuration `CC_SECRET= `.
7. Run `npx codechecks` as part of your CI pipeline after building the app.
8. That's it! 🔥Create your first PR and let codechecks record initial baseline. With Codechecks you
can track build size, visual regressions and much more! Check out other plugins at
[Awesome Codechecks](https://github.com/codechecks/awesome-codechecks)
## API
### lighthouseKeeper(options: Options): Promise\
#### options
```typescript
interface Options {
url?: string;
buildPath?: string;
minScores?: Dictionary;
}
```
##### url
optional `string`
Provide URL that lighthouse will be ran against. `url` OR `buildPath` MUST be
provided.
##### buildPath
optional `string`
Provide relative path to directory with build. It will be served using
`http-server` package and lighthouse will be ran against it. `url` OR `buildPath` MUST be provided.
##### minScore
optional `Dictionary of numbers`
Provide minimal scores for each metric. Possible keys are:
- performance
- accessibility
- best-practices
- seo
- pwa
## Contributing
All contributions are welcomed. Read more in [CONTRIBUTING.md](./CONTRIBUTING.md)
## Licence
MIT @ [codechecks.io](https://codechecks.io)
## Acknowledges
Thanks go to @andreasonny83 for his support and creating the
[lighthouse-ci](https://github.com/andreasonny83/lighthouse-ci)