Lighthouse: Is there a way to generate html report using lighthouse programmatically.

[abhagupta]

Sorry if I missed this anywhere but I am trying to find how to generate the html using lighthouse using the example given in docs. https://github.com/GoogleChrome/lighthouse/blob/HEAD/docs/readme.md#using-programmatically

I could generate the html by calling lighthouse-cli directly but could not do it using above script. My opts are:

const opts = {
  chromeFlags: ['--show-paint-rects'],
  output: 'html',
  'output-path': './lighthouse-results.html',
  'save-assets': true
};

[patrickhulce]

Several of those flags are CLI only. You'd need to manually build the report similar to https://github.com/GoogleChrome/lighthouse/blob/58ed2868215f61f1cdd8adcb44b316f2c656c30d/docs/hacking-tips.md#iterating-on-the-v2-report

In 3.x, output is returned to you in a new .report property, but saving the assets is still up to you. You can give 3.x a spin by npm install lighthouse@next

[paulirish]

yup. the new .report property in LH 3.

[jbustamovej]

I did it like this:
```
const lighthouse = require('lighthouse');
const ReportGenerator = require('lighthouse/lighthouse-core/report/report-generator');

const report = await lighthouse(page.url(), { port: port }, config).then(results => {
return results;
});
const html = ReportGenerator.generateReport(report.lhr, 'html')
````

MIght be worth it to update the docs for this.

[patrickhulce]

@jbustamovej the docs should be updated to say the below, is there somewhere else you found still telling you to use ReportGenerator?

function launchChromeAndRunLighthouse(url, opts, config = null) {
  return chromeLauncher.launch({chromeFlags: opts.chromeFlags}).then(chrome => {
    opts.port = chrome.port;
    return lighthouse(url, opts, config).then(results => {
      // use results.lhr for the JS-consumeable output
      // https://github.com/GoogleChrome/lighthouse/blob/master/typings/lhr.d.ts
      // use results.report for the HTML/JSON/CSV output as a string
      // use results.artifacts for the trace/screenshots/other specific case you need (rarer)
      return chrome.kill().then(() => results.lhr)
    });
  });
}

[taytus]

@patrickhulce I'm getting a 404 https://github.com/GoogleChrome/lighthouse/blob/master/typings/lhr.d.ts

[patrickhulce]

@taytus they moved, see https://github.com/GoogleChrome/lighthouse/blob/520177b74202ac2ac5ca7e2f6daa2a7cc6bd5612/types/lhr.d.ts

[taytus]

@patrickhulce thank you for that!

I'm still confused and I did it work in a hacky way. All I want is to save the HTML reports in a specific location. This is my solution but I would love feedback if there is a better way to do this.

Thank you!!

```javascript
const fs = require('fs');
const lighthouse = require('lighthouse');
const chromeLauncher = require('chrome-launcher');
const log = require('lighthouse-logger');

(async () => {
  log.setLevel('info');
  const chrome = await chromeLauncher.launch({chromeFlags: ['--headless']});
  const options = {output: 'html', onlyCategories: ['performance'], port: chrome.port};
  const runnerResult = await lighthouse('https://example.com', options);

  // `.report` is the HTML report as a string
  const reportHtml = runnerResult.report;
  fs.writeFileSync('lhreport.html', reportHtml);

  // `.lhr` is the Lighthouse Result as a JS object
  console.log('Report is done for', runnerResult.lhr.finalUrl);
  console.log('Performance score was', runnerResult.lhr.categories.performance.score * 100);

  await chrome.kill();
})();

[dthisner]

@taytus Yours works perfectly fine for me. I am generating multiple reports, now I need to figure out how I can add a link to them all to link to each other :)

[idanen]

@patrickhulce The docs says that results.report has HTML as a string, and it doesn't.

The ReportGenerator on the other hand, works great and generate the same report as other Lighthouse tools.

Is it safe to use it? Are you planning to deprecate it or something?

[patrickhulce]

@idanen results.report has the HTML as a string in the array when the output array includes html.

Is it safe to use it? Are you planning to deprecate it or something?

No, generally speaking it is not safe to use. ReportGenerator is not part of our public API and could be moved/changed on any minor/patch version bump. .report has been around since v3 and is expressly intended for this use case.

[idanen]

Thanks for the response @patrickhulce.

Is the output array supported when using in Node?

[patrickhulce]

@idanen yes.

[LearningAbhi]

@taytus Sir is there anyway to run this for multiple urls. I am trying to call this function in a loop and passing the array of url. It seems to lunch the lighthouse but my problem is its only storing result for one url. Could u please help me out ?
for(var i=0;i {
launchChromeAndRunLighthouse(arr[i], opts).then(results => {
//some work
}

[paulirish]

@LearningAbhi for multiple URLs you might want to consider https://github.com/samdutton/multihouse or https://www.npmjs.com/package/lighthouse-batch

[LearningAbhi]

@paulirish thanks for your quick response. Sorry I missed your ping as I was out of town.
I know about lighthouse-batch , but its run through cli . I want programmatically.
I am trying to build an app which will accept a har file and run the lighthouse for each and every URL present in that har file.
I am able to run lighthouse programmatically for single url, but for multiple url I am getting unhandledpromise error.
Any comments on this ?