Create output report (html and json) doesn't work

[armancodv]

What does not work?
When you run cy.lighthouse() everything works but no HTML or JSON report generates.
But as soon as I add config config: { output: 'html' } (as third arguments or in cypress config)
The test fails and throws:

CypressError: `cy.task('lighthouse')` failed with the following error:
> No browser artifacts are either provided or requested.
    at <unknown> (http://localhost:8080/__cypress/runner/cypress_runner.js:150983:78)
From previous event:
    at Context.task (http://localhost:8080/__cypress/runner/cypress_runner.js:150968:15)
    at wrapped (http://localhost:8080/__cypress/runner/cypress_runner.js:160602:43)
From Your Spec Code:
    at Context.eval (webpack://upp/../../node_modules/@cypress-audit/lighthouse/src/command-handler.js:46:0)

Hints:

• I tested in browser and headless
• I even tested in the current example of this library (cra-authenticated) and the result was the same
• I did everything as explained in https://mfrachet.github.io/cypress-audit/guides/lighthouse/reports.html#accessing-the-raw-reports

How to reproduce?

1. open cra-authenticated example of this repository
2. cypress.config.js -> update on('task')

      on("task", {
        lighthouse: lighthouse((lighthouseReport) => {
          console.log("---- Writing lighthouse report to disk ----");

          writeFile("lighthouse.html", lighthouseReport.report, (error) => {
            error ? console.log(error) : console.log("Report created successfully");
          });
        }),
        pa11y: pa11y(console.log.bind(console)),
      });

3. cypress.config.js -> add config to lighthouse object

    config: {
      output: 'html'
    }

OR
home.cy.js -> update cy.lighthouse

cy.lighthouse({
      performance: 50,
      accessibility: 90,
      "best-practices": 50,
      seo: 50,
      pwa: 50,
    }, {}, {output: 'html'});

4. run e2e:audit:headless or e2e:audit
5. It fails with the following error

CypressError: `cy.task('lighthouse')` failed with the following error:
> No browser artifacts are either provided or requested.

Environment:

• OS: Mac OS M2
• Chrome version: 113.0.5672.126
• Cypress version: 12.12.0 and 10.3.0

[hernikplays]

I had this same problem, I had

 config: {
  output: 'html'
}

in my cypress.config.js and when I changed config key to options, it started to work.

options: {
   output: 'html'
}

[asmahler]

I'm also having this same issue as well. I tried even passing the args for lighthouse for the output and no luck.

[armancodv]

RESOLVED

This PR, #221 , has made updates to the documentation for report generation. To implement the changes, please use the code snippet provided below:

const thresholds = {
  /* ... */
};

const lighthouseOptions = {
  /* ... your lighthouse options */
};

const lighthouseConfig = {
  settings: { output: "html" },
  extends: "lighthouse:default",
  /* ... Alternatively, you could set your own lighthouse config */
};

cy.lighthouse(thresholds, lighthouseOptions, lighthouseConfig);

Link to updated Doc: https://github.com/mfrachet/cypress-audit/blob/master/packages/documentation/docs/guides/lighthouse/reports.md

I suggest updating this page as well: https://mfrachet.github.io/cypress-audit/guides/lighthouse/reports.html#generating-html-reports

PS: I can confirm @hernikplays 's solution also works.

[mark0203]

If I would only check the issues section sooner. Just wasted a couple of days trying to figure out what I'm doing wrong.
This fixed it for me

const lighthouseConfig = {
settings: { output: "html" },
extends: "lighthouse:default",

I also like to add that I also had to replace (error : any) with (error) in fs.writeFile("lighthouse.html", lighthouseReport.report, (error) => {