Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/gsoft-inc/azure-pipelines-lighthouse
Embed Google Lighthouse HTML reports into Azure Pipelines
https://github.com/gsoft-inc/azure-pipelines-lighthouse
azure-devops azure-devops-extension azure-pipelines lighthouse
Last synced: 3 months ago
JSON representation
Embed Google Lighthouse HTML reports into Azure Pipelines
- Host: GitHub
- URL: https://github.com/gsoft-inc/azure-pipelines-lighthouse
- Owner: gsoft-inc
- License: apache-2.0
- Created: 2018-11-08T18:30:19.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2024-10-27T02:34:43.000Z (4 months ago)
- Last Synced: 2024-10-27T17:04:30.845Z (3 months ago)
- Topics: azure-devops, azure-devops-extension, azure-pipelines, lighthouse
- Language: TypeScript
- Homepage: https://marketplace.visualstudio.com/items?itemName=GSoft.lighthouse-vsts
- Size: 741 KB
- Stars: 37
- Watchers: 7
- Forks: 6
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
README
# Lighthouse for Azure Pipelines
This is an [Azure DevOps extension](https://marketplace.visualstudio.com/items?itemName=GSoft.lighthouse-vsts) that allows you to **enhance your Azure Pipelines with a Lighthouse tab**.
The Lighthouse tab embed one or many HTML reports generated by [Google Lighthouse](https://developers.google.com/web/tools/lighthouse/).The task only requires a target URL to execute Lighthouse against.
If the [Lighthouse NPM package](https://www.npmjs.com/package/lighthouse) is already installed locally or globally on the agent, then the task will use it.
Otherwise, it will install the latest version in a temporary folder.![Lighthouse HTML report embed in a tab](https://raw.githubusercontent.com/gsoft-inc/azure-pipelines-lighthouse/main/docs/lh-result.png)
You can also specify **audit score assertions** that can make the pipeline fail based on the audit scores.
For example, the Google Lighthouse audit `is-on-https` produces a boolean score that will be equal to `1` if the site uses HTTPS.
This is an example of a score assertion for this audit:```
is-on-https = 1
```Which means that you expect the audit `is-on-https` to have a score equal to `1`.
**Any audit score generated by Lighthouse is between 0 and 1**. You can also use the `>` (greater than) and the `<` (lower than) operator to evaluate decimal audit scores.
Audit score assertions must be written on separate lines.![Lighthouse task](https://raw.githubusercontent.com/gsoft-inc/azure-pipelines-lighthouse/main/docs/lh-task.png)
## Installation
Lighthouse for Azure Pipelines can be installed from the [Visual Studio Marketplace](https://marketplace.visualstudio.com/items?itemName=GSoft.lighthouse-vsts).
## Lighthouse audits that can be used in assertions
The following audits are available for assertions in **Lighthouse 10.1.0**.
They may change with new versions.
Execute `lighthouse --list-all-audits` to discover the available audits for your desired Lighthouse version.| Audit | Type | Description |
|------------------------------|---------|------------------------------------------------------------------------------------------------------------------------------------|
| is-on-https | binary | Uses HTTPS |
| service-worker | binary | Does not register a service worker that controls page and `start_url` |
| viewport | binary | Has a `` tag with `width` or `initial-scale` |
| first-contentful-paint | numeric | First Contentful Paint |
| largest-contentful-paint | numeric | Largest Contentful Paint |
| first-meaningful-paint | numeric | First Meaningful Paint |
| speed-index | numeric | Speed Index |
| total-blocking-time | numeric | Total Blocking Time |
| max-potential-fid | numeric | Max Potential First Input Delay |
| cumulative-layout-shift | numeric | Cumulative Layout Shift |
| errors-in-console | binary | No browser errors logged to the console |
| server-response-time | binary | Initial server response time was short |
| interactive | numeric | Time to Interactive |
| redirects | numeric | Avoid multiple page redirects |
| installable-manifest | binary | Web app manifest or service worker do not meet the installability requirements |
| splash-screen | binary | Is not configured for a custom splash screen |
| themed-omnibox | binary | Does not set a theme color for the address bar. |
| maskable-icon | binary | Manifest doesn't have a maskable icon |
| content-width | binary | Content is sized correctly for the viewport |
| image-aspect-ratio | binary | Displays images with correct aspect ratio |
| image-size-responsive | binary | Serves images with appropriate resolution |
| deprecations | binary | Avoids deprecated APIs |
| mainthread-work-breakdown | numeric | Minimizes main-thread work |
| bootup-time | numeric | JavaScript execution time |
| uses-rel-preconnect | numeric | Preconnect to required origins |
| font-display | binary | All text remains visible during webfont loads |
| third-party-summary | binary | Minimize third-party usage |
| no-unload-listeners | binary | Avoids `unload` event listeners |
| unsized-images | binary | Image elements have explicit `width` and `height` |
| valid-source-maps | binary | Page has valid source maps |
| aria-allowed-attr | binary | `[aria-*]` attributes match their roles |
| aria-hidden-body | binary | `[aria-hidden="true"]` is not present on the document `` |
| aria-hidden-focus | binary | `[aria-hidden="true"]` elements contain focusable descendents |
| aria-valid-attr-value | binary | `[aria-*]` attributes have valid values |
| aria-valid-attr | binary | `[aria-*]` attributes are valid and not misspelled |
| button-name | binary | Buttons have an accessible name |
| color-contrast | binary | Background and foreground colors have a sufficient contrast ratio |
| document-title | binary | Document has a `` element |
| duplicate-id-active | binary | `[id]` attributes on active, focusable elements are unique |
| duplicate-id-aria | binary | ARIA IDs are unique |
| heading-order | binary | Heading elements appear in a sequentially-descending order |
| html-has-lang | binary | `` element has a `[lang]` attribute |
| html-lang-valid | binary | `` element has a valid value for its `[lang]` attribute |
| image-alt | binary | Image elements have `[alt]` attributes |
| link-name | binary | Links have a discernible name |
| list | binary | Lists contain only `
| listitem | binary | List items (`<li>`) are contained within `<ul>`, `<ol>` or `<menu>` parent elements |
| meta-viewport | binary | `[user-scalable="no"]` is not used in the `<meta name="viewport">` element and the `[maximum-scale]` attribute is not less than 5. |
| uses-long-cache-ttl | numeric | Uses efficient cache policy on static assets |
| total-byte-weight | numeric | Avoids enormous network payloads |
| offscreen-images | numeric | Defer offscreen images |
| render-blocking-resources | numeric | Eliminate render-blocking resources |
| unminified-css | numeric | Minify CSS |
| unminified-javascript | numeric | Minify JavaScript |
| unused-css-rules | numeric | Reduce unused CSS |
| unused-javascript | numeric | Reduce unused JavaScript |
| modern-image-formats | numeric | Serve images in next-gen formats |
| uses-optimized-images | numeric | Efficiently encode images |
| uses-text-compression | numeric | Enable text compression |
| uses-responsive-images | numeric | Properly size images |
| efficient-animated-content | numeric | Use video formats for animated content |
| duplicated-javascript | numeric | Remove duplicate modules in JavaScript bundles |
| legacy-javascript | numeric | Avoid serving legacy JavaScript to modern browsers |
| doctype | binary | Page has the HTML doctype |
| charset | binary | Properly defines charset |
| dom-size | numeric | Avoids an excessive DOM size |
| geolocation-on-start | binary | Avoids requesting the geolocation permission on page load |
| inspector-issues | binary | No issues in the `Issues` panel in Chrome Devtools |
| no-document-write | binary | Avoids `document.write()` |
| notification-on-start | binary | Avoids requesting the notification permission on page load |
| paste-preventing-inputs | binary | Allows users to paste into input fields |
| uses-http2 | numeric | Use HTTP/2 |
| uses-passive-event-listeners | binary | Uses passive listeners to improve scrolling performance |
| meta-description | binary | Document has a meta description |
| http-status-code | binary | Page has successful HTTP status code |
| font-size | binary | Document uses legible font sizes |
| link-text | binary | Links have descriptive text |
| crawlable-anchors | binary | Links are crawlable |
| is-crawlable | binary | Page isn’t blocked from indexing |
| robots-txt | binary | robots.txt is valid |
| tap-targets | binary | Tap targets are sized appropriately |
| hreflang | binary | Document has a valid `hreflang` |
| plugins | binary | Document avoids plugins |
| canonical | binary | Document has a valid `rel=canonical` |
| bf-cache | binary | Page prevented back/forward cache restoration |
## Build and release process
There are GitHub actions that take care of testing, packaging and publishing the extension.
## License
Copyright © 2023, Groupe GSoft Inc. This code is licensed under the Apache License, Version 2.0. You may obtain a copy of this license at https://github.com/gsoft-inc/azure-pipelines-lighthouse/blob/main/LICENSE.