Puppeteer auth script not working

Describe the bug

I have a puppeteer script that logs in to my site, so I can run lighthouse against authenticated pages.

When I run this in headed mode, I see Chrome login as expected.

However, when I check the test output, all the screenshots clearly show the login page, so it’s as if lighthouse has ignored the puppeteer script entirely.

To Reproduce Steps to reproduce the behavior:

const puppeteer = require("puppeteer");

const user = process.env.USER;
const password = process.env.PASSWORD;
const siteOrigin = process.env.SITE_ORIGIN;

module.exports = async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto(`${siteOrigin}/sign_in`);

  await page.type("input#user_email", user);
  await page.type("input#user_password", password);
  await page.click('input[type="submit"]');

  await page.waitForNavigation();
  await page.close();
};

module.exports = {
  ci: {
    collect: {
      settings: {
        disableStorageReset: true,
      },
      upload: {
        target: "temporary-public-storage",
      },
      isSinglePageApplication: true,
      puppeteerScript: "./src/event.js",
      url: [
        "https://mywebsite.com/account",
      ],
    },
  },
};

Expected behavior I would expect the lighthouse test to test against the logged in page.

Environment (please complete the following information):

• OS: Mac OS
• Browser Chrome
• Version 88.0.4324.96

Additional context It’s worth mentioning I’ve tried this with and without the page.close() step.

[patrickhulce]

Please see the example in the documentation. You need to use the browser argument that is passed to your script. Launching your own browser means it will be using its own profile so all storage is not kept when Lighthouse runs in the browser that was passed to you.

Did you already address this? This was the headline of my comment and the reason the script you provided will never work. The storage reset comment was just an extra aside.

[citypaul]

So for the benefit of anyone else who stumbles upon this, here’s the finished code that does now work:

const user = process.env.USER;
const password = process.env.PASSWORD;
const siteOrigin = process.env.SITE_ORIGIN;

module.exports = async (browser) => {
  const page = await browser.newPage();
  await page.goto(`${siteOrigin}/sign_in`);

  await page.type("input#user_email", user);
  await page.type("input#user_password", password);
  await page.click('input[type="submit"]');

  await page.waitForNavigation();
  await page.close();
};

As you can see, I just needed to use the provided browser instance, just as @patrickhulce suggested.

Thanks! 🎉