Lighthouse: Using lighthouse in combination with travis

Created on 5 Apr 2018  路  3Comments  路  Source: GoogleChrome/lighthouse

Hello,

How should I check whether the lighthouse score is 100 in travis?

My current travis config:

dist: trusty
language: node_js
node_js:
- "stable"
before_script:
- npm install
before_deploy:
- npm run build
deploy:
  provider: surge
  project: ./dist/
  domain: https://kentico-cloud-sample-pwa-app.surge.sh 
  skip_cleanup: true
  on:
    all_branches: true
    condition: $TRAVIS_BRANCH =~ ^master|v3-angular$
after_deploy:
  - npm run lighthouse

My package.json scripts:

...
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build --prod",
        "lint": "ng lint",
        "e2e": "ng e2e",
        "generate-models": "cd src/app/models && kc-generate --ts --projectId 66ab95de-6599-0018-f141-3c9dc08fe797 --definitions",
        "deploy-surge": "npm run build && surge ./dist https://kentico-cloud-sample-pwa-app.surge.sh",
        "lighthouse": "lighthouse --chrome-flags=\"--headless\" --quiet --output json https://kentico-cloud-sample-pwa-app.surge.sh"
    },
...

I am using surge for deployment (credentials are set in environment variable correcty).

I don't know, how to configure script lighthouse to fail if PWA score is less the 100.

question

Most helpful comment

Hi @Simply007,

If the lighthouse command above runs successfully it will output a JSON result. You then want to look for an item in reportCategories with id "pwa". The score property on that object will be the PWA category score.

I'd suggest outputting the lighthouse results (e.g. to stdout, which I believe your command currently does) and check it out in the Travis log (or locally if you can run there) so you can see everything there that could be of use.

You might also want to check out the pwmetricts project, if you'd rather automate this rather than interrogate the JSON manually. It has an "expectations" file that you can provide to do things like fail if a score falls below a certain threshold.

All 3 comments

Hi @Simply007,

If the lighthouse command above runs successfully it will output a JSON result. You then want to look for an item in reportCategories with id "pwa". The score property on that object will be the PWA category score.

I'd suggest outputting the lighthouse results (e.g. to stdout, which I believe your command currently does) and check it out in the Travis log (or locally if you can run there) so you can see everything there that could be of use.

You might also want to check out the pwmetricts project, if you'd rather automate this rather than interrogate the JSON manually. It has an "expectations" file that you can provide to do things like fail if a score falls below a certain threshold.

Hey @brendankenny,

thanks for the response. I will try pwametrics and i will leave the info about the results here.

Just FYI:
I have used lighthouse programmatically and set up the travis to call npm script that is calling javascript script that check the PWA score and return 0 if it is 100 and 1 for lower score - that causes travis build fail.

One commit better than 1000 words:
https://github.com/Kentico/cloud-sample-pwa-app/commit/7ee4043045d985f691fc9a09dc18ee2143036c78

Was this page helpful?
0 / 5 - 0 ratings