Giter Site home page Giter Site logo

harlan-zw / unlighthouse Goto Github PK

View Code? Open in Web Editor NEW
3.6K 19.0 99.0 22.45 MB

Scan your entire site with Google Lighthouse in 2 minutes (on average). Open source, fully configurable with minimal setup.

Home Page: https://unlighthouse.dev

License: MIT License

JavaScript 86.75% TypeScript 9.03% Vue 4.12% HTML 0.10%
google-lighthouse puppeteer site-audit

unlighthouse's Introduction

unlighthouse - Scan your entire website with Google Lighthouse.

NPM version NPM Downloads Docs & Demos
GitHub stars

Unlighthouse scans your entire site using Google Lighthouse,
with a modern UI, minimal config and smart sampling.

View Demo


Status: v0.11 Released πŸŽ‰
Made possible by my Sponsor Program πŸ’–
Follow me @harlan_zw 🐦 β€’ Join Discord for help

Quick Setup

Run the following command:

npx unlighthouse --site <your-site>
# or PNPM
pnpm dlx unlighthouse --site <your-site>

Requirements: Node >= 18.x.

Getting Started

Install instructions for all integrations can be found on the docs site.

Need a hand? Join the Discord for one-on-one help.

gitignore

Unlighthouse will save your reports in outputDir, it's recommended you .gitignore these files.

.unlighthouse

Debugging

If you run into any issues with Unlighthouse, the first step should be to re-run the scan with debugging enabled.

# NPM
npx unlighthouse --site unlighthouse.dev --debug
# or PNPM
pnpm dlx unlighthouse --site unlighthouse.dev  --debug

Docs

Integration instructions, Guides, API and config spec can be found on docs site.

Sponsors

License

MIT License Β© 2022 Harlan Wilton

unlighthouse's People

Contributors

barbapapazes avatar brahms116 avatar brianteeman avatar finnpaes avatar harlan-zw avatar kiansa avatar lutejka avatar marcelxpfeifer avatar mastoj avatar mountainash avatar nick-blueskylabs avatar nielspilgaard avatar pedddro avatar rohrerf avatar tuminzee avatar zzeepo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

unlighthouse's Issues

Gitlab CI run fails with possible missing flag

Describe the bug

I am running unlighthouse on Gitlab CI and I am running into the following issue:

$ unlighthouse-ci --site mysite.org --build-static
[success] [unlighthouse] Successfully connected to `mysite.org`, status code: `200`.
[warn] [unlighthouse] Warn: No CI budget has been set. Consider setting a budget with the config (`ci.budget`) or --budget <number>.
[info] [unlighthouse] Discovered 32 routes from sitemap.xml.
/usr/local/lib/node_modules/@unlighthouse/cli/node_modules/puppeteer-cluster/dist/Cluster.js:146
                throw new Error(`Unable to launch browser for worker, error message: ${err.message}`);
                      ^
Error: Unable to launch browser for worker, error message: Failed to launch the browser process!
[0324/151509.041470:ERROR:zygote_host_impl_linux.cc(100)] Running as root without --no-sandbox is not supported. See https://crbug.com/638180.
TROUBLESHOOTING: https://pptr.dev/troubleshooting
    at Cluster.<anonymous> (/usr/local/lib/node_modules/@unlighthouse/cli/node_modules/puppeteer-cluster/dist/Cluster.js:146:23)
    at Generator.throw (<anonymous>)
    at rejected (/usr/local/lib/node_modules/@unlighthouse/cli/node_modules/puppeteer-cluster/dist/Cluster.js:6:65)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

I am using a custom image based on the node image, which uses Debian. The image is produced using the following file:

ARG NODE_IMAGE_TAG=$NODE_IMAGE_TAG

FROM node:$NODE_IMAGE_TAG

# Install pnpm
RUN npm install -g pnpm

RUN apt-get update && apt-get install -y \
    fonts-liberation \
    libasound2 \
    libatk-bridge2.0-0 \
    libatk1.0-0 \
    libatspi2.0-0 \
    libcups2 \
    libdbus-1-3 \
    libdrm2 \
    libgbm1 \
    libgtk-3-0 \
#    libgtk-4-1 \
    libnspr4 \
    libnss3 \
    libwayland-client0 \
    libxcomposite1 \
    libxdamage1 \
    libxfixes3 \
    libxkbcommon0 \
    libxrandr2 \
    xdg-utils \
    libu2f-udev \
    libvulkan1 \
    wget

# Install chrome
RUN wget -q https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
RUN apt-get install ./google-chrome-stable_current_amd64.deb

# Install unlighthouse
RUN npm install -g  @unlighthouse/cli puppeteer

From what I understand, the puppeteer browser launcher may need additional flags:

puppetter.launch({args: ['--no-sandbox', '--disable-setuid-sandbox']})

I believe this may be solved by adding a flag (--no-sandbox) to the unlighthouse CLI, so as to choose when to run it this way

Reproduction

No response

System / Nuxt Info

- Operating System: `Darwin`
- Node Version:     `v16.13.2`
- Nuxt Version:     `3.3.1`
- Nitro Version:    `2.3.2`
- Package Manager:  `[email protected]`
- Builder:          `vite`
- User Config:      `experimental`, `runtimeConfig`, `hooks`, `build`, `modules`, `tailwindcss`, `vite`, `sitemap`, `image`
- Runtime Modules:  `@vueuse/[email protected]`, `@pinia/[email protected]`, `@nuxtjs/[email protected]`, `@funken-studio/[email protected]`, `@nuxtjs/[email protected]`, `@nuxt/[email protected]`
- Build Modules:    `-`

Request: Server Options customization

I'm running Unlighthouse via Docker with Chromium, using a reverse proxy to access it. I can do this and access it fine on a subdirectory with the routerPrefix option, but it looks for the API at http://localhost:5678 still.

It'd be great if we could customize things like that - I'm not currently able to use it in Docker because of this.

even if the url is already open, running unlighthouse again will open a new tab in the browser.

Hi, I want to use unlighthouse in my project's CI stage, and when I run it locally with cli, I find that every time I execute npx unlighthouse it will open a new page in the browser, even though it was already opened with url http://localhost:5678/.

Maybe we can reuse the tab if the url is opened in browser(just activated it), similar to what happens in react-scripts?

If this is appropriate, it might be possible to reuse the code from react-dev-utils directly. Instead of directly using open

I'm also happy to create a pr :)

CSV and excel reporters for CI

Clear and concise description of the problem

I would like to use the results of the the Lighthouse scan in CI to automatically comment on PRs with the scores. The static HTML is great, but just having the main scores as output of the CLI program will be awesome.

This action has some examples - https://github.com/foo-software/lighthouse-check-action

Suggested solution

I would imagine a flag --output-scores that saves a scores.json file. For the actual implementation, I am not sure how to achieve it.

Alternative

No response

Additional context

No response

Add routerPrefix to cli config

Clear and concise description of the problem

As a developer, I want to be able to set routerPrefix in the CLI so that I can set the routerPrefix to include a CI variable at build time.

Suggested solution

Add routerPrefix as a CLI option and and apply it in whichever order we currently use for properties that have CLI and Config properties.

Alternative

No response

Additional context

No response

Nuxt Fatal Error - Context is not available

Describe the bug

Error on yarn dev:

FATAL Context is not available

at use (node_modules/unctx/dist/index.mjs:12:15)
at setup (node_modules/@unlighthouse/nuxt/dist/module.mjs:18:26)
at ModuleContainer.normalizedModule (node_modules/@nuxt/kit/dist/index.mjs:630:29)
at async ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:239:20)
at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:51:7)
at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:478:5)

Reproduction

No response

System Info

@nuxt/cli v2.15.8.

package.json devDependencies: "@unlighthouse/nuxt": "^0.4.2",

nuxt.config.js: 

buildModules: [
    '@unlighthouse/nuxt',
  ],

Used Package Manager

yarn

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Add an inline audit mode for integrations

Clear and concise description of the problem

Currently a disconnect between running a scan with an integration, finding where the issue is, fixing it and re-running the scan

Suggested solution

Add a client to the integration which shows you exactly what on the page has an issue

Alternative

No response

Additional context

No response

Validations

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'minimist'

Hello!

I'm getting this error when running npx unlighthouse --site https://www.example.com

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'minimist' imported from /Users/home/.npm/_npx/944abecbf21dfffb/node_modules/@unlighthouse/core/dist/process/lighthouse.mjs
  at new NodeError (node:internal/errors:371:5)
  at packageResolve (node:internal/modules/esm/resolve:884:9)
  at moduleResolve (node:internal/modules/esm/resolve:929:18)
  at defaultResolve (node:internal/modules/esm/resolve:1044:11)
  at ESMLoader.resolve (node:internal/modules/esm/loader:422:30)
  at ESMLoader.getModuleJob (node:internal/modules/esm/loader:222:40)
  at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:40)
  at link (node:internal/modules/esm/module_job:75:36) {
  code: 'ERR_MODULE_NOT_FOUND'
  }
  at makeError (/Users/home/.npm/_npx/944abecbf21dfffb/node_modules/execa/lib/error.js:59:11)
  at handlePromise (/Users/home/.npm/_npx/944abecbf21dfffb/node_modules/execa/index.js:119:26)
  at processTicksAndRejections (node:internal/process/task_queues:96:5)
  at async runLighthouseTask (/Users/home/.npm/_npx/944abecbf21dfffb/node_modules/@unlighthouse/core/dist/index.mjs:4858:19)

βœ” Unlighthouse has finished scanning https://www.example.com/: 1 routes in 4s.    

Looking at the deps here seems to be an undeclared dependency.

Make runs comparable

Clear and concise description of the problem

I would love to make runs more easily comparable.

Main use case: My website is built with Nuxt 2, and I want to test Astro and Nuxt 3. As my website isn't that complex and I would like to learn more about Astro, I would completely rewrite the two cases. To than based on the results of the unlighthouse reports, take a better decision on which one to use for production.

Other use case: Testing different hosting providers to make them easily comparable.


I'm aware that Lighthouse score don't tell the whole story, but I think for such simple use cases they can be a big help

Suggested solution

As the reports are already persisted in /.unlighthouse, I would suggest three modes for the Ui, based on the existing data. Implementing a switch which allows you to change the current mode.

  • Mode 1 - default: You can switch from the default mode (current implementation), where you see one report at a time. You can select which report seeing with a little dropdown menu.
  • Mode 2 - time-series: Scores of each metric are displayed in a graph to see how it evolves over time.
  • Mode 3 - compare: A split mode where you can open two different reports to compare them side by side.

Optional: The CI tool could also include a cronjob that runs on a user-defined schedule to create the reports. The user could then define a threshold for each metric to send a message to Slack / Discord / ... when it doesn't meet the requirements.

Alternative

No response

Additional context

PS: I haven't done something in this area, but I would love to implement something like this.

Validations

Make Report Deployment Easier

Clear and concise description of the problem

Hey harlan quick Q, is it possible to export a static version of the results to share with someone else? I have it running on my desktop but would be great to be able to share with someone.

Suggested solution

One-click solution to upload to cloud providers?

Alternative

No response

Additional context

No response

Validations

Replace puppeteer-cluster with our own solution

puppeteer-cluster is quite outdated and doesn't have the best API. It limits the ability to cancel pre-running scans and extract useful worker stats, but it is fairly stable.

Ideally would remove it and replace our own rolled version

Report Filtering Support

Clear and concise description of the problem

Hey, does anyone know if it's possible to filter the results based on certain criteria. For example, I'm trying to identify pages which contain console errors. Thanks in advance!

Suggested solution

Possibly an insights tab?

Alternative

No response

Additional context

No response

Validations

Option to exclude some url or maybe using regex in --urls option

Details

It would be useful to have an option to exclude specific URLs or to use regular expressions to filter which URLs are processed.
This can be inconvenient in cases where certain pages should be skipped.

One possible solution would be to add a new command-line option, such as --exclude-urls, which would accept a comma-separated list of URLs to exclude.
Alternatively, a regular expression could be used to match and exclude URLs based on a pattern.

Authentication

Hi there,

Just trying Unlighthouse for the first time. It succeeded in crawling our authentication page, but the rest of the app requires to be logged in. What would be the best solution to do that?

For our E2E tests with Cypress, we have two possibilities:

  • actually fill and submit the auth form
  • call the login API to generate a token

The JWT is stored in localStorage.

Couldn't find any Puppeteer config to do this: https://pptr.dev/#?product=Puppeteer&version=v13.0.1&show=api-puppeteerconnectoptions

I was thinking of something like Lighthouse User Flows where we can actually control Puppeteer behavior: https://web.dev/lighthouse-user-flows/

Thanks!

Operation not permitted (copyfile) inside of a docker container

Describe the bug

The error

I am trying to get unlighthouse up and running in a docker container (base image -> ghcr.io/puppeteer/puppeteer:latest).

When using the @unlighthouse/cli package and passing the --build-static flag in this container I get the following error:

β„Ή Generating static client.                                                                                                                                             unlighthouse 20:47:32
node:internal/process/promises:279
            triggerUncaughtException(err, true /* fromPromise */);
            ^

[Error: EPERM: operation not permitted, copyfile '/usr/local/lib/node_modules/@unlighthouse/cli/node_modules/@unlighthouse/client/dist/index.html' -> '/app/.unlighthouse/index.html'] {
  errno: -1,
  code: 'EPERM',
  syscall: 'copyfile',
  path: '/usr/local/lib/node_modules/@unlighthouse/cli/node_modules/@unlighthouse/client/dist/index.html',
  dest: '/app/.unlighthouse/index.html'
}

My dockerfile / Reproduction (just run this docker image)

https://pastebin.com/xnJmKY1B

The nodejs version of the puppeteer base image is 16.

What I tried

First I thought this is just a simple file permissions problem but I tried to change the permissions of the src folder and of the destination folder with no success.

As you can see in the dockerfile I also tried to change ownership again both of the src and dest folders (recursive) - no effect on the error message.

Possible Solutions?

  • Maybe someone can help me out with a working dockerfile with the flag --build-static passed (really needed :/)
  • a different docker base image which works
  • someone encountered the same or a similar error inside of a docker container
  • I am not working that often with the filesystem inside of a NodeJS program so maybe this is just a common issue with node?! -> maybe add a check for the permissions of the src and dest folders?

Anyhow thanks for the help :D

Reproduction

No response

System Info

System:
    OS: macOS 13.0
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 27.75 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 8.5.0 - /usr/local/bin/npm
  Browsers:
    Brave Browser: 106.1.44.112
    Chrome: 107.0.5304.110
    Firefox: 107.0
    Firefox Developer Edition: 108.0
    Safari: 16.1

Used Package Manager

npm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Running CI on Github stalls out

Describe the bug

I'm following the CI + Github Actions example: https://unlighthouse.dev/integrations/ci.html#github-actions-netlify-example

Here's my yml:


on: [pull_request]

jobs:
  demo:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
        with:
          fetch-depth: 0
      - name: Setup Node
        uses: actions/setup-node@v1
        with:
          node-version: 14
      - name: Install Dependencies
        run: npm add @unlighthouse/cli puppeteer

      - name: Unlighthouse assertions and client
        run: npx unlighthouse-ci --urls [redacted] --debug --build-static
      - name: Configure AWS credentials
        uses: aws-actions/configure-aws-credentials@v1
        with:
          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
          aws-region: us-west-2
      - name: Deploy
        run: aws s3 sync [redacted] [redacted]

The github run stalls out and never completes yet shows no errors:

[info] [unlighthouse] 1 manual URLs have been provided for scanning. Disabling sitemap and crawler.
[debug] [unlighthouse] Route has been queued. Path: `/` Name: _index.
[debug] [unlighthouse] HTML extract of `[redacted`](redacted) took `145`ms
[debug] [unlighthouse] Page has an alternative lang, ignoring `/`: [redacted]
[debug] [unlighthouse] Ignoring route `/`.
//never progresses past this step

Reproduction

Set up GH Actions demo, run on PR

System Info

github actions

Used Package Manager

npm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Login information

Details

Is there a way to pass login information or an existing cookie to analyze pages hidden behind a auth layer

UI Wizard for Scan Options

Clear and concise description of the problem

If the page build is small, then these properties should be set as the value given by the doc. But all these properties also happen to have the same defaults? So kinda confused (since lighthouse is configured to work with large sites by default)

Suggested solution

Add a UI which helps users decide on the best settings to run the scan with

Alternative

No response

Additional context

No response

Validations

Discord link broken

Describe the bug

When opening https://unlighthouse.dev/chat, you can see
image

Details of error

Error - Cannot find package 'ufo' imported from /var/task/server.mjs

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'ufo' imported from /var/task/server.mjs
at new NodeError (node:internal/errors:387:5)
at packageResolve (node:internal/modules/esm/resolve:852:9)
at moduleResolve (node:internal/modules/esm/resolve:901:20)
at defaultResolve (node:internal/modules/esm/resolve:1115:11)
at nextResolve (node:internal/modules/esm/loader:163:28)
at ESMLoader.resolve (node:internal/modules/esm/loader:841:30)
at ESMLoader.getModuleJob (node:internal/modules/esm/loader:424:18)
at ModuleWrap. (node:internal/modules/esm/module_job:76:40)
at link (node:internal/modules/esm/module_job:75:36)

Netlify internal ID: 01H00JQNBM5GYKJP4616TQ26GF

Reproduction

No response

System / Nuxt Info

No response

Gitpod Integration

Clear and concise description of the problem

The only issue is that while Gitpod does the proper port forwarding for localhost address to get to the Unlighthouse portal up and running...the actual scanning of the pages via websockets on the portal itself seems to fail because it is trying to access "localhost" addresses (so clearly at that stage Gitpod port forwarding is not happening / see screenshot at end of this email).

Suggested solution

Fix localhost binding

Alternative

No response

Additional context

No response

Validations

7 high severity vulnerabilities

Describe the bug

i installed the package but is showing me vulnerabilities on the package.

image

Reproduction

No response

System / Nuxt Info

- Operating System: Windows_NT
- Node Version:     v18.16.0
- Nuxt Version:     3.4.1
- Nitro Version:    2.3.3
- Package Manager:  [email protected]
- Builder:          vite
- User Config:      app, css, modules, security, extends, pinia, imports, build, unlighthouse, runtimeConfig, nitro, ssr, experimental
- Runtime Modules:  @pinia/[email protected], @unocss/[email protected], [email protected], @pinia-plugin-persistedstate/[email protected], @nathanchase/[email protected], [email protected], @unlighthouse/[email protected], [email protected]
- Build Modules:    -

Accessibility repport only

Describe the bug

Hi, I think I found a bug.

It seems like the screenshot.jpeg isn't generated when In only run accessibility.
I will be testing some more, but it will take some time.
PS: The full-screeenshot.jpeg is generated.

Reproduction

No response

System Info

This is my config:

export default {
  site: 'konkurransetilsynet.no',
  scanner: {
    // exclude specific routes
    exclude:['/fusjoner/*','/decisions/*'],
    // run lighthouse for each URL 3 times
    dynamicSampling: false,
    // use desktop to scan
    device: 'desktop',
    // enable the throttling mode 4g
    throttle: false,
    //Ignorer language
    ignoreI18nPages: false,
    //Set a limit on max routes to scan. Can be set to 1 on a intial scan
    maxRoutes: false
  },
  lighthouseOptions: {
    //More categories: ['performance', 'best-practices', 'accessibility', 'seo', 'pwa']
    onlyCategories: ['accessibility'],
  },
  debug: false,
}

Used Package Manager

npm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

What license is this under

Details

Google Lighthouse is under a Apache-2.0 license so would likely make sense that this is what the unlighthouse also follows. That said, I didn't see anything about that in the GitHub Repo or https://unlighthouse.dev about what license it was released under.

It should be listed in the LICENSE.txt but also the README.md should have a section pointing to it.

LHCI Server Usage

Clear and concise description of the problem

https://github.com/GoogleChrome/lighthouse-ci/blob/main/docs/server.md

The LHCI server saves historical Lighthouse data, displays trends in a dashboard, and offers an in-depth build comparison UI to uncover differences between builds.

Should be able to use unlighthouse reports with it easily

Suggested solution

to investigate

Alternative

No response

Additional context

No response

Validations

Weird error when launching unlighthouse from vscode terminal

Describe the bug

I have a weird issue. When i try to launch any of the unlighthouse command on vscode I get this error.

puppeteer-cluster/dist/Cluster.js:146
                throw new Error(`Unable to launch browser for worker, error message: ${err.message}`);
Error: Unable to launch browser for worker, error message: Failed to launch the browser process!

When i try running it on my native terminal i do not have any of those errors

Reproduction

No response

System / Nuxt Info

------------------------------
- Operating System: Linux
- Node Version:     v16.17.0
- Nuxt Version:     3.4.2
- Nitro Version:    2.3.3
- Package Manager:  [email protected]
- Builder:          vite
- User Config:      -
- Runtime Modules:  -
- Build Modules:    -
------------------------------

A way to export report

Clear and concise description of the problem

It should be possible to share results amongst a team, report generation does take some time to generate especially for websites with a large number routes.

Suggested solution

There should be a way to export the result in a json format and pass it to the CLI to create the UI, this will save considerable amount of time for teams. I haven't seen the implementation of Unlighthouse yet, will soon check it. out and try to propose a solution in this thread.

Alternative

No response

Additional context

No response

[FEAT] Add custom tab to nuxt/devtools

Clear and concise description of the problem

When installed there is no tab yet for checking your lighthouse scores within nuxt/devtools

Suggested solution

Add this to the module for nuxt

nuxt.hook('devtools:customTabs', (tabs) => {
  tabs.push({
    // unique identifier
    name: 'my-module',
    // title to display in the tab
    title: 'My Module',
    // any icon from Iconify, or a URL to an image
    icon: 'carbon:apps',
    // iframe view
    view: {
      type: 'iframe',
      src: '/url-to-your-module-view',
    },
  })
})

Alternative

No response

Additional context

No response

Validations

Unlighthouse stuck at "Waiting for routes..." screen

Describe the bug

unlighthouse dashboard does not load any data, and no error message at all is ever displayed, when using on a Linux distribution with Chromium installed. The default browser on this machine is Firefox.

The problem happens regardless of the website scanned.

unlighthouse-puppeteer behaves exactly the same way.

How to reproduce

  1. Run unlighthouse as instructed in the documentation:
npx unlighthouse --site https://my-website.com
  1. Confirm the npx prompt to install required package.

Observed result

  • In the command line, messages confirm the successful connection to the website with status 200, the eventual detection of a sitemap, and number of routes initially discovered.
  • In the command line, a deprecation warning is displayed:
  Puppeteer old Headless deprecation warning:
    In the near feature `headless: true` will default to the new Headless mode
    for Chrome instead of the old Headless implementation. For more
    information, please see https://developer.chrome.com/articles/new-headless/.
    Consider opting in early by passing `headless: "new"` to `puppeteer.launch()`
    If you encounter any bugs, please report them to https://github.com/puppeteer/puppeteer/issues/new/choose.
  • A tab open in the default web browser and loads unlighthouse dashboard
  • The dashboard stays empty with Waiting for routes... spinner displayed. Worker progress value remains at 0%, even minutes after the launch.

Expected result

  • In the command line, messages confirm the successful connection to the website with status 200, the eventual detection of a sitemap, and number of routes initially discovered.
  • A tab open in the default web browser and loads unlighthouse dashboard
  • The dashboard content gets populated progressively as the crawling progresses.

Reproduction

c.f. bug description

System / Nuxt Info

System:
    OS: Linux 4.19 BunsenLabs GNU/Linux 10.5 (Lithium)
    CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
    Memory: 9.83 GB / 15.35 GB
    Container: Yes
    Shell: 5.0.3 - /bin/bash
  Binaries:
    Node: 16.19.1 - ~/.nvm/versions/node/v16.19.1/bin/node
    npm: 8.19.3 - ~/.nvm/versions/node/v16.19.1/bin/npm
  Browsers:
    Chromium: 90.0.4430.212
    Firefox: 112.0.2

LCP - Missing from audit of page report

Describe the bug

Hi,

i just started using the
@unlighthouse/core
module to extract core-web-vitals for several domains.

And i am not able to extract the metric
largest-contentful-paint

I tried it with the demo page
https://inspect.unlighthouse.dev/

and with the cli tool on my domain both with the same result.
Using page insights for one page returns the standard lighthouse report including the
lcp value.

Reproduction

Use demopage

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (8) x64 Intel(R) Core(TM) i7-1065G7 CPU @ 1.30GHz
    Memory: 14.58 GB / 31.59 GB
  Binaries:
    Node: 16.13.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.15 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.14.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (105.0.1343.33)
    Internet Explorer: 11.0.19041.1566

Used Package Manager

yarn

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Feature request: add option to make unlighthouse-cli build-static assets have a relative path and use <base> tag

Currently, all assets start with a slash

<script type="module" crossorigin src="/assets/index.43945a3b.js"></script>
<link rel="modulepreload" href="/assets/vendor.58481f6a.js">
<link rel="stylesheet" href="/assets/index.5c5a87cc.css">

If one wants to host the content of the output folder in a subfolder that is not possible.
I've found the routerPrefix option, but that won't suffice.

[Website] Header Transparency Issue Impeding Readability During Scrolling

πŸ› Issue

Header transparency makes it difficult to read when scrolling.

πŸ—Ί Scenario

  1. User opens the website.
  2. User scrolls down the page.

πŸ‘Ž Actual result

The header of the website remains transparent while scrolling, which makes it difficult to read the content underneath.

πŸ‘ Expected result

The header should be opaque (non-transparent) when scrolling, ensuring that the content is easily readable.

Reproduction

No response

System / Nuxt Info

No response

Allow to specify multiple sitemaps (and/or retrieve them from `robots.txt`)

Clear and concise description of the problem

Big websites might have more than one sitemap.

There is a limit both for the size and for the number of URLs a sitemap.xml can have (source). And some sitemap generator or plugin can impose an even stricter limit. For example, Yoast SEO for Wordpress sets this limit to 1000 URLs.

Also, a website could host its sitemap in a non-default location, using a name different from the standard sitemap.xml.
I encountered this issue when testing a website that didn't have a sitemap.xml in the root. I checked the robots.txt and saw that the website had sitemaps in the following locations:

  • /media/sitemap_product.xml
  • /media/sitemap_category.xml
  • /media/sitemap_additional_link.xml
  • /media/sitemap_other.xml
  • /media/sitemap_cms.xml

Suggested solution

It would be nice to be able to specify an array of sitemaps. Or maybe fetch the robots.txt and look for all sitemaps declared there. I'm not sure if at the moment sitemap.xml is hardcoded.

Alternative

No response

Additional context

Since there was no sitemap.xml in the website I was testing, I let unlighthouse run in crawler mode for a few minutes, but it didn't work at all.

I tried to run unlighthouse with --debug to see if there were any errors, but I saw none in the terminal.

ERR_INVALID_ARG_TYPE error while trying single run

OS: Windows 10
node js: v16.13.2

I'm getting the following error when trying pnpm dlx unlighthouse --site https://unlighthouse.dev/guide/

√ Successfully connected to https://unlighthouse.dev/guide/, status code: 200.                                                                unlighthouse 15:51:16
node:internal/errors:464
    ErrorCaptureStackTrace(err);
    ^

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string or an instance of Buffer or URL. Received undefined
    at readFile (node:fs:393:10)
    at go$readFile (C:\Users\jo\AppData\Local\Temp\dlx-7572\5\node_modules\.pnpm\[email protected]\node_modules\graceful-fs\graceful-fs.js:118:14)
    at Object.readFile (C:\Users\jo\AppData\Local\Temp\dlx-7572\5\node_modules\.pnpm\[email protected]\node_modules\graceful-fs\graceful-fs.js:115:12)
    at C:\Users\jo\AppData\Local\Temp\dlx-7572\5\node_modules\.pnpm\[email protected]\node_modules\universalify\index.js:8:12
    at new Promise (<anonymous>)
    at Object.readFile (C:\Users\jo\AppData\Local\Temp\dlx-7572\5\node_modules\.pnpm\[email protected]\node_modules\universalify\index.js:7:14)
    at generateClient (file:///C:/Users/jo/AppData/Local/Temp/dlx-7572/5/node_modules/.pnpm/@[email protected]/node_modules/@unlighthouse/core/dist/index.mjs:906:26)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Object.ctx.setServerContext (file:///C:/Users/jo/AppData/Local/Temp/dlx-7572/5/node_modules/.pnpm/@[email protected]/node_modules/@unlighthouse/core/dist/index.mjs:1228:5)
    at async run (file:///C:/Users/jo/AppData/Local/Temp/dlx-7572/5/node_modules/.pnpm/@[email protected]/node_modules/@unlighthouse/cli/dist/cli.mjs:27:3) {
  code: 'ERR_INVALID_ARG_TYPE'
}
 ERROR  Command failed with exit code 1: C:\Users\jo\AppData\Local\Temp\dlx-7572\unlighthouse.CMD --site https://unlighthouse.dev/guide/

Git Commit CI Usage - Increment Runs with % changes

Clear and concise description of the problem

i think it would be great if documentation contain something that informs you about building static deploy on every integration segment. I do not think i have something valueable to write up on connecting nuxt build with unlighthouse coz those docs (https://unlighthouse.dev/integrations/ci.html) are everything I looked for, but it would be great if they were linked in nuxt > build segment with CI integration segment. Maybe something, like what you said to me, so "There is no nuxt build integration for now, just use CI integration which should look like this:"". Coz when someone try to integrate nuxt build with unlighthouse will be looking (as I was) in nuxt integration segment. This is just small tip for docs as a feedback. Everythinkg is working for us, your CI integration docs solves all the problems we just didn't search there before. Thxs for all Im sure that our company will be using this tool for a long time.

Similar to how lighthouse CI can be setup to run and show issues

Suggested solution

to investigate

Alternative

No response

Additional context

No response

Validations

Run cli command with `--samples 3` will trigger error

Describe the bug

After running a while, the cli response the following:

Error: Cannot create new tab, and no tabs already open.
at C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\connections\cri.js:45:35
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Driver.connect (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:119:5)
at async Function.run (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\gather-runner.js:484:7)
at async Function._gatherArtifactsFromBrowser (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:264:23)
at async Function.gather (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:170:21)
at async lighthouse (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\index.js:50:21)
at async file:///C:/Users/ant008/AppData/Local/npm-cache/_npx/9c5b11f5f0ea845b/node_modules/@unlighthouse/core/dist/process/lighthouse.mjs:16:26
Error: Cannot create new tab, and no tabs already open.
at C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\connections\cri.js:45:35
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Driver.connect (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:119:5)
at async Function.run (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\gather-runner.js:484:7)
at async Function._gatherArtifactsFromBrowser (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:264:23)
at async Function.gather (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:170:21)
at async lighthouse (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\index.js:50:21)
at async file:///C:/Users/ant008/AppData/Local/npm-cache/_npx/9c5b11f5f0ea845b/node_modules/@unlighthouse/core/dist/process/lighthouse.mjs:16:26
C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:348
asyncTimeout = setTimeout(reject, timeout, new LHError(LHError.errors.PROTOCOL_TIMEOUT, {
^

LighthouseError [LHError]: PROTOCOL_TIMEOUT
at C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:348:50
at new Promise ()
at Driver.sendCommandToSession (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:346:28)
at Driver.sendCommand (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:369:17)
at Object.clearDataForOrigin (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver\storage.js:58:19)
at Function.disposeDriver (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\gather-runner.js:179:39)
at Function.run (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\gather-runner.js:532:20)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Function._gatherArtifactsFromBrowser (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:264:23)
at async Function.gather (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:170:21) {
code: 'PROTOCOL_TIMEOUT',
friendlyMessage: {
i18nId: 'lighthouse-core/lib/lh-error.js | protocolTimeout',
values: {
errorCode: 'PROTOCOL_TIMEOUT',
protocolMethod: 'Storage.clearDataForOrigin'
},
formattedDefault: 'Waiting for DevTools protocol response has exceeded the allotted time. (Method: Storage.clearDataForOrigin)'
},
lhrRuntimeError: true,
protocolMethod: 'Storage.clearDataForOrigin'
}

Node.js v17.1.0

ERROR Failed to run lighthouse for route Command failed with exit code 1: node C:/Users/ant008/AppData/Local/npm-cache/_npx/9c5b11f5f0ea845b/node_modules/@unlighthouse/core/dist/process/lighthouse.mjs --cache=true --routeReport={"route":{"url":"https://next.syopex.com/brand/skll"},"artifactPath":"D:\\Frontend\\unlighthouse\\.unlighthouse\\next.syopex.com\\e6ae\\reports\\brand\\skll"} --lighthouseOptions={"onlyCategories":["performance","accessibility","best-practices","seo"],"throttlingMethod":"provided","throttling":{"rttMs":0,"throughputKbps":0,"cpuSlowdownMultiplier":1,"requestLatencyMs":0,"downloadThroughputKbps":0,"uploadThroughputKbps":0},"formFactor":"mobile","screenEmulation":{"mobile":true,"width":360,"height":640,"deviceScaleFactor":2}} --port=54889
Error: Cannot create new tab, and no tabs already open.
at C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\connections\cri.js:45:35
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Driver.connect (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:119:5)
at async Function.run (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\gather-runner.js:484:7)
at async Function._gatherArtifactsFromBrowser (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:264:23)
at async Function.gather (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\runner.js:170:21)
at async lighthouse (C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\index.js:50:21)
at async file:///C:/Users/ant008/AppData/Local/npm-cache/_npx/9c5b11f5f0ea845b/node_modules/@unlighthouse/core/dist/process/lighthouse.mjs:16:26
C:\Users\ant008\AppData\Local\npm-cache_npx\9c5b11f5f0ea845b\node_modules\lighthouse\lighthouse-core\gather\driver.js:348
asyncTimeout = setTimeout(reject, timeout, new LHError(LHError.errors.PROTOCOL_TIMEOUT, {

Reproduction

npx unlighthouse-puppeteer --site next.syopex.com --samples 3 OR npx unlighthouse --site next.syopex.com --samples 3

System / Nuxt Info

System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
    Memory: 7.24 GB / 15.92 GB
  Binaries:
    Node: 17.1.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (113.0.1774.35)
    Internet Explorer: 11.0.19041.1566

Adding unlighthouse causes latest Nuxt RC-11 to crash

Describe the bug

Adding unlighthouse to the latest version of the Nuxt3 Release candidate caused Nuxt to crash with the following error. I followed the instructions here

Cannot start nuxt:  Context is not available                                                                                                                                                                                                                                                

  at use (/D:/Development/Code/PokiApp/node_modules/unctx/dist/index.mjs:12:15)
  at setup (/D:/Development/Code/PokiApp/node_modules/@unlighthouse/nuxt/dist/module.mjs:18:26)
  at Object.normalizedModule (/D:/Development/Code/PokiApp/node_modules/@unlighthouse/nuxt/node_modules/@nuxt/kit/dist/index.mjs:630:29)
  at async installModule (/D:/Development/Code/PokiApp/node_modules/@nuxt/kit/dist/index.mjs:456:3)
  at async initNuxt (/D:/Development/Code/PokiApp/node_modules/nuxt/dist/index.mjs:1606:7)
  at async load (/D:/Development/Code/PokiApp/node_modules/nuxi/dist/chunks/dev.mjs:6778:9)
  at async Object.invoke (/D:/Development/Code/PokiApp/node_modules/nuxi/dist/chunks/dev.mjs:6828:5)
  at async _main (/D:/Development/Code/PokiApp/node_modules/nuxi/dist/cli.mjs:50:20)

Reproduction

No response

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (16) x64 AMD Ryzen 7 2700X Eight-Core Processor
    Memory: 10.31 GB / 15.95 GB
  Binaries:
    Node: 16.17.1 - C:\Program Files\nodejs\node.EXE
    npm: 8.15.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (105.0.1343.53)
    Internet Explorer: 11.0.22000.120

Used Package Manager

npm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Unclear certificate error

OS: Windows 10
node js: 16.14.0

When using the following command,
unlighthouse --site https://www.apetito.de
unlighthouse returns with a fatal certificate error.

image

Chrome accepts the included SSL certificate.

[Nuxt 3 Integration] Adding Unlighthouse to a Nuxt 3 project causes it to crash

Installing Unlighthouse following the instructions causes the Nuxt server to crash. It is probably caused by a dependency issue, installing unlighthouse adds the std-env@^2.3.0 package required by @nuxt/cli@^2.15.8 and @nuxt/[email protected] which can't be installed on a Nuxt 3 project (Nuxt 3 uses std-env@^3.x.x). I can't provide a reproduction on codesandbox or stackblitz because the CHROME_PATH variable can't be set.

The error:
[worker reload] [worker init] Named export 'isWindows' not found. The requested module 'file:///home/user/Documents/folder/project-dir/node_modules/std-env/index.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'file:///home/user/Documents/folder/project-dir/node_modules/std-env/index.js';
const { provider, isWindows } = pkg;

import { provider, isWindows } from 'node_modules/std-env/index.js';
^^^^^^^^^
SyntaxError: Named export 'isWindows' not found. The requested module 'node_modules/std-env/index.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'node_modules/std-env/index.js';
const { provider, isWindows } = pkg;

at ModuleJob._instantiate (node:internal/modules/esm/module_job:127:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:193:5)
at async Promise.all (index 0)
at async ESMLoader.import (node:internal/modules/esm/loader:337:24)
at async loadESM (node:internal/process/esm_loader:88:5)
at async handleMainPromise (node:internal/modules/run_main:61:12)

CLI '--urls' option not parsed correctly

Greetings!

Congratulations on the public early access release. I have been playing around with it a bit and looks very promising!

In the documentation it is indicated that a --urls option can be passed with a comma-seperated list argument.
When executing following command unlighthouse --site www.example.com --urls '/page-one,/page-two,/page-three' an error will be thrown:

(node:31885) UnhandledPromiseRejectionWarning: TypeError: options.urls.split is not a function
    at pickOptions (file:///.../@unlighthouse/cli/dist/chunks/createCli.mjs:82:32)
    at run (file:///.../@unlighthouse/cli/dist/cli.mjs:18:8)
    at file:///.../@unlighthouse/cli/dist/cli.mjs:38:1
    at ModuleJob.run (internal/modules/esm/module_job.js:183:25)
    at async Loader.import (internal/modules/esm/loader.js:178:24)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:31885) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:31885) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

It seems that currently the options.urls is a boolean, causing the code to throw the error. The issue is likely caused by the missing argument declaration in the cac option for the --urls. As of right now it doesn't include an angled (or square) brackets to indicate an argument.

Thanks!

ECONNREFUSED

Describe the bug

I tried running this on my website https://eggtrainer.com, but I received this error.

Error: Unable to launch browser for worker, error message: connect ECONNREFUSED 127.0.0.1:51667
    at Cluster.<anonymous> (/home/kruse/.npm/_npx/944abecbf21dfffb/node_modules/puppeteer-cluster/dist/Cluster.js:146:23)
    at Generator.throw (<anonymous>)
    at rejected (/home/kruse/.npm/_npx/944abecbf21dfffb/node_modules/puppeteer-cluster/dist/Cluster.js:6:65)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

Node.js v18.15.0

My website does require authentication, but IDK if that is what caused this. Thanks in advance.

Reproduction

No response

System / Nuxt Info

System:
    OS: Linux 5.15 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish)
    CPU: (12) x64 Intel(R) Core(TM) i5-10500H CPU @ 2.50GHz
    Memory: 2.47 GB / 3.72 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node
    npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm
  Browsers:
    Chrome: 112.0.5615.49

Improve Tab UI / DX

Clear and concise description of the problem

There is confusion for users that the tabs can be clicked currently

Suggested solution

Make it more obvious somehow

Alternative

No response

Additional context

No response

Validations

`cdn-cgi` being checked

Describe the bug

When running unlighthouse on a website that uses Cloudflare, the cdn-cgi/l/email-protection page will be checked which might not be intended.

Reproduction

Run unlighthouse on a website with an email and Cloudflare

System / Nuxt Info

No response

Why performance reported data is way to far from the reality?

Hello Harlan and the community unlighthouse !

I tested unlighthouse but it returned me performance score completly different from the Google Lighthouse and the chrome dev tool.

From 92/100 (unlighthouse) to 21/100 (Google Lighthouse)

See the result below :
image

I tested for many pages, in Guest mode, the result still the same.
image

I tested for this website : https://monsieurcocorico.com/
see the Google Lighthouse report

Is the problem is that unlighthouse download the page to make tests faster?
This website have many plugins, I wanted to test the slowlyness of it.

Thank you for this amazing tool and I hope it can works for performance score.
Emilien

Cannot find module puppeteer

Hi @harlan-zw πŸ‘‹

As you can see in the image unlighthouse never picks puppeteer, even though it is installed globally. I'm using nvm and the path would be /Users/tragio/.nvm/versions/node/v14.19.1/lib/node_modules/ and not file:///Users/tragio, file:///Users/tragio/node_modules as stated in the error message πŸ€” I wonder if the error is related to that.

CleanShot 2022-04-21 at 09 14 49

Thank you for your amazing work πŸ™

ERR_MODULE_NOT_FOUND @unlighthouse/client

Describe the bug

I am getting the following error when trying to run unlighthouse with yarn.

file:///home/flortsch/Projekte/bytegrasp/website/.yarn/cache/mlly-npm-0.4.3-bf0f735108-d9d50babe7.zip/node_modules/mlly/dist/index.mjs:4699
  return pcall$1(resolvePathSync$1, id, opts);
         ^

Error: Error: Cannot find module @unlighthouse/client imported from file:///home/flortsch/Projekte/bytegrasp/website/.yarn/__virtual__/@unlighthouse-core-virtual-0e58d5d01f/0/cache/@unlighthouse-core-npm-0.3.29-68f89b983a-18c2ef2835.zip/node_modules/@unlighthouse/core/dist/index.mjs
    at resolvePath$1 (file:///home/flortsch/Projekte/bytegrasp/website/.yarn/cache/mlly-npm-0.4.3-bf0f735108-d9d50babe7.zip/node_modules/mlly/dist/index.mjs:4699:10)
    at ctx.setServerContext (file:///home/flortsch/Projekte/bytegrasp/website/.yarn/__virtual__/@unlighthouse-core-virtual-0e58d5d01f/0/cache/@unlighthouse-core-npm-0.3.29-68f89b983a-18c2ef2835.zip/node_modules/@unlighthouse/core/dist/index.mjs:5732:33)
    at run (file:///home/flortsch/Projekte/bytegrasp/website/.yarn/cache/@unlighthouse-cli-npm-0.3.29-c6be2d1d24-26f2fe047e.zip/node_modules/@unlighthouse/cli/dist/cli.mjs:27:22)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  code: 'ERR_MODULE_NOT_FOUND'
}

Node.js v18.7.0

I installed unlighthouse as dev dependency in our project. Also manually installing the module @unlighthouse/client that seems to be missing as dev dependency did not help. Any ideas? Could it be related to yarn pnp?

UPDATE: It indeed looks like it's related to yarn. Running unlighthouse in my project with npx works.

Reproduction

yarn unlighthouse --site http://localhost:1234

System Info

System:
    OS: Linux 5.18 Arch Linux
    CPU: (16) x64 AMD Ryzen 7 PRO 4750U with Radeon Graphics
    Memory: 22.75 GB / 30.59 GB
    Container: Yes
    Shell: 5.9 - /usr/bin/zsh
  Binaries:
    Node: 18.7.0 - /usr/bin/node
    Yarn: 3.2.2 - /usr/bin/yarn
    npm: 8.17.0 - /usr/bin/npm
  Browsers:
    Chromium: 104.0.5112.79
    Firefox: 103.0.2

Used Package Manager

yarn

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Error on launch with Sentry module

Hi 😊
I tried to install the module in question, but at the launch of the yarn dev command, the port :3000 breaks making conflict with the Sentry module.
I don’t understand if it is a problem of this module or Sentry, disabling one or the other works, but together it keeps giving error of Sentry undefined

Axios bump to 1.2.1 Throws an error : "FATAL Request to site https://example.com threw an unhandled exception. Please check the URL is valid. unexpected end of file" on some sites

Describe the bug

The latest 0.4.4 release throw an error on some valid sites (not all).

β€Ί Testing Site https://www.example.com/ is valid.                                                                                    unlighthouse 15:36:01

  at Function.AxiosError.from (node_modules/unlighthouse/node_modules/axios/lib/core/AxiosError.js:89:14)
  at BrotliDecompress.handleStreamError (node_modules/unlighthouse/node_modules/axios/lib/adapters/http.js:489:29)
  at BrotliDecompress.emit (events.js:412:35)
  at emitErrorNT (internal/streams/destroy.js:106:8)
  at emitErrorCloseNT (internal/streams/destroy.js:74:3)
  at processTicksAndRejections (internal/process/task_queues.js:82:21)

 FATAL  Request to site https://www.example.com/ threw an unhandled exception. Please check the URL is valid. unexpected end of file

This is related to bumping the axios dependency for the core "axios": "^1.1.3", which defaults to the latest v1.2.1. The error has also been documented here axios/axios#5346.

Adding encoding headers to the function as suggested inaxios/axios#5346 (comment) fixes this. I think also downgrading to axios 1.1.3 as suggested on the thread would fix it.

async function fetchUrlRaw(url) {
  try {
    const response = await axios.get(url, {
      headers: { "Accept-Encoding": "gzip,deflate,compress" },
      httpsAgent: new https.Agent({
        rejectUnauthorized: false
      })
    });
    const redirected = response.request.res.responseUrl && response.request.res.responseUrl !== url;
    const redirectUrl = response.request.res.responseUrl;
    if (response.status < 200 || response.status >= 300 && !redirected) {
      return {
        valid: false,
        redirected,
        response,
        redirectUrl
      };
    }
    return {
      valid: true,
      redirected,
      response,
      redirectUrl
    };
  } catch (e) {
    return {
      error: e,
      valid: false
    };
  }
}

Version 0.4.2 and below are working fine.

Reproduction

No response

System Info

System:
  OS: macOS 12.2.1
  CPU: (10) x64 Apple M1 Pro
  Memory: 230.56 MB / 32.00 GB
  Shell: 5.8 - /bin/zsh
Binaries:
  Node: 14.17.6 - ~/.asdf/installs/nodejs/14.17.6/bin/node
  npm: 6.14.15 - ~/.asdf/plugins/nodejs/shims/npm
Browsers:
  Chrome: 108.0.5359.124
  Safari: 15.3

Used Package Manager

npm

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.