Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Integrate Lighthouse testing #33

Closed
vincerubinetti opened this issue Oct 15, 2024 · 1 comment · Fixed by #40
Closed

Integrate Lighthouse testing #33

vincerubinetti opened this issue Oct 15, 2024 · 1 comment · Fixed by #40
Assignees
Labels
frontend Frontend-related

Comments

@vincerubinetti
Copy link
Collaborator

vincerubinetti commented Oct 15, 2024

See this related issue about color contrast which is the motivation behind this issue:
#22

As a habit, I periodically check webapps I develop with Chrome Devtool's built-in Lighthouse checks. However, I've never tried running Lighthouse in an automatic fashion, and exhaustively for every page. I'd like to at least try it in this app.

Here is the package we'd most likely use:
https://www.npmjs.com/package/playwright-lighthouse

Some notes/guidelines:

  • Rename accessibility.spec.ts to axe.spec.ts
  • Create a new lighthouse.spec.ts next to it
  • Export paths from the axe test, and re-use it for the lighthouse test
  • Choose some sensible thresholds for the lighthouse tests (90 for accessibility, 80 for performance, etc).
  • Configure Lighthouse to use the "experimental APCA" option, assuming that option exists in the package as it does in Chrome Devtools: Screenshot 2024-10-15 at 12 52 39 PM
  • Reconfigure Playwright to run a production build of the web app instead of a development build, because things in the dev build like HMR penalize Lighthouse scores like performance.

Note that this would not be a replacement for the Axe Core testing that is already in place:
GoogleChrome/lighthouse#15215
If I had to only pick one, Axe Core is much more useful.

@kemsguy7
Copy link
Contributor

@vincerubinetti @jananiravi do you mind assigning this to me?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
frontend Frontend-related
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants