Lighthouse fails to connect to Chrome via Node and CLI

[faruuko]

FAQ

• Yes, my issue is not about variability or throttling.
• Yes, my issue is not about a specific accessibility audit (file with axe-core instead).

URL

https://izifortune.github.io/lighthouse-custom-gatherer/

What happened?

I'm trying to run lighthouse via node. My aim is to create a simple API with one route which will be used in this manner - http://localhost:3000/lh-report?url=https://izifortune.github.io/lighthouse-custom-gatherer/

I've been on it for 24hrs and I've tried many solutions I found on github, stackoverflow and gitter. None of the solutions are working.

Here's my code

var express = require('express');
var lighthouse = require('lighthouse');
var chromeLauncher = require('chrome-launcher');
var app = express();

app.listen(3000, () => {
  console.log('Server running on port 3000');
});

const opts = {
  chromeFlags: ['--headless', '--no-sandbox', '--disable-storage-reset'],
  logLevel: 'verbose',
  output: 'json',
  onlyCategories: ['performance', 'accessibility', 'best-practices', 'seo'],
};

function launchChromeAndRunLightHouse(url, opts, config = null) {
  return chromeLauncher
    .launch({
      chromeFlags: opts.chromeFlags,
    })
    .then((chrome) => {
      opts.port = chrome.port;
      return lighthouse(url, opts, config).then((result) => {
        return chrome.kill().then(() => result);
      });
    });
}

app.get('/lh-report', async (req, res, next) => {
  const url = req.query.url;

  launchChromeAndRunLightHouse(url, opts)
    .then((results) =>
      res.json({
        performance: results.lhr.categories.performance.score * 100,
        accessibility: results.lhr.categories.accessibility.score * 100,
        performance: results.lhr.categories.performance.score * 100,
        seo: results.lhr.categories.seo.score * 100,
      })
    )
    .catch((e) => {
      res
        .status(500)
        .send({ message: 'An interanal server error occured', log: e });
    });
});

Please tell me if I'm doing anything wrong

What did you expect?

I expected to see the appropriate response which is the score for (performance, accessibility, best-practices, SEO)

What have you tried?

I have tried about 10 different solutions I found on github, stackoverflow and gitter. Including adding --headless and --no-sandbox flag for both Node and CLI.

How were you running Lighthouse?

CLI, node

Lighthouse Version

8.6.0

Chrome Version

Version 95.0.4638.69 (Official Build) (x86_64)

Node Version

v17.0.1

OS

macOS Monterey 12.0 Beta

Relevant log output

LH:status:verbose Create config +0ms
  LH:status:verbose Requiring gatherers +4ms
  LH:statusEnd:verbose Requiring gatherers +57ms
  LH:status:verbose Requiring audits +1ms
  LH:statusEnd:verbose Requiring audits +428ms
  LH:statusEnd:verbose Create config +84ms
  LH:status:verbose Runner setup +0ms
  LH:listen for event =>:verbose Page.frameNavigated  +1ms
  LH:listen for event =>:verbose Runtime.executionContextDestroyed  +0ms
  LH:listen for event =>:verbose Target.attachedToTarget  +0ms
  LH:listen for event =>:verbose Page.frameNavigated  +0ms
  LH:status Connecting to browser +1ms
  LH:CriConnection:warn Cannot create new tab; reusing open tab. +7ms
  LH:status Disconnecting from browser... +1ms
  LH:status Cleaning origin data +1ms
  LH:method => browser:verbose Storage.clearDataForOrigin {"origin":"https://izifortune.github.io","storageTypes":"appcache,file_systems,shader_cache,service_workers,cache_storage"} +0ms
  LH:CriConnection:error sendRawMessage() was called without an established connection. +0ms
  LH:statusEnd:verbose Cleaning origin data +0ms
  LH:GatherRunner disconnect:error sendRawMessage() was called without an established connection. +1ms
  LH:statusEnd:verbose Disconnecting from browser... +0ms
/Users/nerf/Desktop/Portfolio/light-house-api/node_modules/lighthouse/lighthouse-core/gather/driver.js:342
        const err = new LHError(
                    ^

LighthouseError [LHError]: PROTOCOL_TIMEOUT
    at Timeout._onTimeout (/Users/nerf/Desktop/Portfolio/light-house-api/node_modules/lighthouse/lighthouse-core/gather/driver.js:342:21)
    at listOnTimeout (node:internal/timers:557:17)
    at processTimers (node:internal/timers:500:7) {
  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'
}

[brendankenny]

Hi, sorry you were stuck on this for so long. This is due to a change in Node 17 where dns resolution (in this case of localhost) now defaults to IPv6. See the issues/PRs linked from #13258.

This is fixed by #13301 and the linked chrome-launcher pr, but hasn't had a release yet (should be next week). In the meantime, workarounds would be either temporarily downgrading to Node 16 or trying out the lighthouse@next nightly (with the usual caveats about using a nightly release).

[raphaellueckl]

In my case I had to the set a debug port for puppeteer and then route the lighthouse port to that same port.

// Puppeteer starting chromium
const option: LaunchOptions = {
        args: ['--remote-debugging-port=9222'] // <=====================
    };
const browser = await launch(option);

// Using lighthouse

  const options = {
    logLevel: "info",
    output: "html",
    onlyCategories: ["performance", "seo", "accessibility", "best-practices"],
    port: 9222, // <=====================
  };
  const lighthouseChecks = await lighthouse("http://localhost:3000/", options);