loading...

Fail a PR based on any audit score with v1.1.0 of Web Performance Audits with Lighthouse Github Action

justinribeiro profile image Justin Ribeiro Originally published at justinribeiro.com on ・3 min read

While the budget.json support in my Web Performance Audits with Lighthouse Github Action was a good start point for many folks already using budgets, there was just something missing from it. How can I check and fail a pull request based on a specific audit or an overall category score?

I thought about this for some time and weighted the options. I could make Github Action input variables that allow setting, but that seemed rather convoluted and restrictive. I could come up with my own specific JSON file, but that too seemed ill conceived. What I settled on was the old adage dance with the one that brought; why not use the data model for Lighthouse?

With that, v1.1.0 introduces a new input, lighthouseScoringBudget that takes a file I call scores.js.

scores.js is based on the Lighthouse JSON output data model and maps one-to-one with the existing keys and definitions within lighthouse. This allows an easy to use, vastly configurable file to test any audit score or raw numeric value that you find important.

module.exports = { audits: { 'service-worker': { score: 1, }, 'first-contentful-paint': { score: 1, numericValue: 100, }, 'first-meaningful-paint': { score: 1, numericValue: 100, }, }, categories: { performance: { score: 0.95, }, accessibility: { score: 0.95, }, },};

No having to wait for me to add special parameters and easily comparable to the standard out from a JSON run of lighthouse:

$ lighthouse --output json --output-path=./sample.json --chrome-flags="--headless" https://YOUR\_URL\_HERE.com

Just pop open that JSON file, determine what audits or categories are important to you, and start failing those pull requests at will.g sb




scores.js in action as a PR comment

In the current iteration of this feature, we can test for either one or two specific keys:

  1. score: decimal ranging from 0 to 1. If you wanted to verify that your performance is above 95, you’d enter 0.95 like above.
  2. numericValue: decimal starting at zero. Commonly holds the value out of the trace in milliseconds, good for testing if you want those raw performance numbers.

That’s all for now; stay tuned for more features. As always, PRs and issues are welcome. Now go trace a site and let’s make the web fast!

Discussion

pic
Editor guide