From a06a8b2439481de543d9cfc7168164cad37cb3e9 Mon Sep 17 00:00:00 2001
From: Adam Raine <ad.st.raine@gmail.com>
Date: Wed, 6 Jul 2022 12:31:43 -0700
Subject: [PATCH 1/5] docs: update puppeteer auth example for 10.0

---
 docs/recipes/auth/README.md                   | 20 +++------
 docs/recipes/auth/example-lh-auth.js          | 43 ++++++++-----------
 docs/recipes/auth/package.json                |  1 +
 docs/recipes/auth/server/server.js            | 24 ++++++-----
 .../integration-test/example-lh-auth.test.js  | 20 ++++-----
 docs/recipes/integration-test/package.json    |  1 +
 6 files changed, 50 insertions(+), 59 deletions(-)

diff --git a/docs/recipes/auth/README.md b/docs/recipes/auth/README.md
index 0183b758221b..8702827afefe 100644
--- a/docs/recipes/auth/README.md
+++ b/docs/recipes/auth/README.md
@@ -42,21 +42,18 @@ Puppeteer - a browser automation tool - can be used to programatically setup a s
 1. Fill and submit the login form.
 1. Run Lighthouse using the same browser.
 
-First, launch Chrome:
+First, launch Chrome and create a new page:
 ```js
-// This port will be used by Lighthouse later. The specific port is arbitrary.
-const PORT = 8041;
 const browser = await puppeteer.launch({
-  args: [`--remote-debugging-port=${PORT}`],
   // Optional, if you want to see the tests in action.
   headless: false,
   slowMo: 50,
 });
+const page = await browser.newPage();
 ```
 
 Navigate to the login form:
 ```js
-const page = await browser.newPage();
 await page.goto('http://localhost:10632');
 ```
 
@@ -89,18 +86,13 @@ await Promise.all([
 
 At this point, the session that Puppeteer is managing is now logged in.
 
-Close the page used to log in:
-```js
-await page.close();
-// The page has been closed, but the browser still has the relevant session.
-```
-
-Now run Lighthouse, using the same port as before:
+Now run Lighthouse, using the same page as before:
 ```js
 // The local server is running on port 10632.
 const url = 'http://localhost:10632/dashboard';
-// Direct Lighthouse to use the same port.
-const result = await lighthouse(url, {port: PORT, disableStorageReset: true});
+// Direct Lighthouse to use the same page.
+  // Disable storage reset so login session is preserved.
+const result = await lighthouse(url, {disableStorageReset: true}, undefined, page);
 const lhr = result.lhr;
 
 // Direct Puppeteer to close the browser - we're done with it.
diff --git a/docs/recipes/auth/example-lh-auth.js b/docs/recipes/auth/example-lh-auth.js
index 7f892b70fde6..4f8f757c3b04 100644
--- a/docs/recipes/auth/example-lh-auth.js
+++ b/docs/recipes/auth/example-lh-auth.js
@@ -10,18 +10,14 @@
  * See docs/recipes/auth/README.md for more.
  */
 
-const puppeteer = require('puppeteer');
-const lighthouse = require('lighthouse');
-
-// This port will be used by Lighthouse later. The specific port is arbitrary.
-const PORT = 8041;
+import puppeteer from 'puppeteer';
+import lighthouse from 'lighthouse';
 
 /**
- * @param {import('puppeteer').Browser} browser
+ * @param {puppeteer.Page} page
  * @param {string} origin
  */
-async function login(browser, origin) {
-  const page = await browser.newPage();
+async function login(page, origin) {
   await page.goto(origin);
   await page.waitForSelector('input[type="email"]', {visible: true});
 
@@ -34,36 +30,35 @@ async function login(browser, origin) {
     page.$eval('.login-form', form => form.submit()),
     page.waitForNavigation(),
   ]);
-
-  await page.close();
 }
 
 /**
- * @param {puppeteer.Browser} browser
+ * @param {puppeteer.page} page
  * @param {string} origin
  */
-async function logout(browser, origin) {
-  const page = await browser.newPage();
+async function logout(page, origin) {
   await page.goto(`${origin}/logout`);
-  await page.close();
 }
 
 async function main() {
   // Direct Puppeteer to open Chrome with a specific debugging port.
   const browser = await puppeteer.launch({
-    args: [`--remote-debugging-port=${PORT}`],
     // Optional, if you want to see the tests in action.
     headless: false,
     slowMo: 50,
   });
+  const page = await browser.newPage();
 
   // Setup the browser session to be logged into our site.
-  await login(browser, 'http://localhost:10632');
+  await login(page, 'http://localhost:10632');
 
   // The local server is running on port 10632.
   const url = 'http://localhost:10632/dashboard';
-  // Direct Lighthouse to use the same port.
-  const result = await lighthouse(url, {port: PORT, disableStorageReset: true});
+
+  // Direct Lighthouse to use the same Puppeteer page.
+  // Disable storage reset so login session is preserved.
+  const result = await lighthouse(url, {disableStorageReset: true}, undefined, page);
+
   // Direct Puppeteer to close the browser as we're done with it.
   await browser.close();
 
@@ -71,11 +66,9 @@ async function main() {
   console.log(JSON.stringify(result.lhr, null, 2));
 }
 
-if (require.main === module) {
-  main();
-} else {
-  module.exports = {
-    login,
-    logout,
-  };
+// Run the Lighthouse example if this module is the entrypoint.
+if (import.meta.url === `file://${process.argv[1]}`) {
+  await main();
 }
+
+export {login, logout};
diff --git a/docs/recipes/auth/package.json b/docs/recipes/auth/package.json
index 74fd7c3cf90e..d371fe138a61 100644
--- a/docs/recipes/auth/package.json
+++ b/docs/recipes/auth/package.json
@@ -1,4 +1,5 @@
 {
+  "type": "module",
   "private": true,
   "scripts": {
     "start": "node server/server.js"
diff --git a/docs/recipes/auth/server/server.js b/docs/recipes/auth/server/server.js
index 77553b47f81c..a41a8a5651f3 100644
--- a/docs/recipes/auth/server/server.js
+++ b/docs/recipes/auth/server/server.js
@@ -10,13 +10,15 @@
  * page. See docs/recipes/auth/README.md for more.
  */
 
-const createError = require('http-errors');
-const express = require('express');
-const morgan = require('morgan');
-const session = require('express-session');
-const http = require('http');
-const path = require('path');
-const PUBLIC_DIR = path.join(__dirname, 'public');
+import createError from 'http-errors';
+import express from 'express';
+import morgan from 'morgan';
+import session from 'express-session';
+import http from 'http';
+import path from 'path';
+import {getModuleDirectory} from '../../../../esm-utils.mjs';
+
+const PUBLIC_DIR = path.join(getModuleDirectory(import.meta), 'public');
 
 const app = express();
 
@@ -78,8 +80,10 @@ app.use(function(err, req, res, next) {
 });
 
 const server = http.createServer(app);
-if (require.main === module) {
+
+// Start the server if this module is the entrypoint.
+if (import.meta.url === `file://${process.argv[1]}`) {
   server.listen(10632);
-} else {
-  module.exports = server;
 }
+
+export default server;
diff --git a/docs/recipes/integration-test/example-lh-auth.test.js b/docs/recipes/integration-test/example-lh-auth.test.js
index 029ba62607cd..d58a94ff6621 100644
--- a/docs/recipes/integration-test/example-lh-auth.test.js
+++ b/docs/recipes/integration-test/example-lh-auth.test.js
@@ -13,11 +13,11 @@
 
 /** @typedef {import('lighthouse/types/lhr')} LH */
 
-const puppeteer = require('puppeteer');
-const lighthouse = require('lighthouse');
-const {expect} = require('expect');
-const server = require('../auth/server/server.js');
-const {login, logout} = require('../auth/example-lh-auth.js');
+import puppeteer from 'puppeteer';
+import lighthouse from 'lighthouse';
+import expect from 'expect';
+import server from '../auth/server/server.js';
+import {login, logout} from '../auth/example-lh-auth.js';
 
 const CHROME_DEBUG_PORT = 8042;
 const SERVER_PORT = 10632;
@@ -96,8 +96,8 @@ describe('my site', () => {
   });
 
   afterEach(async () => {
+    await logout(page, ORIGIN);
     await page.close();
-    await logout(browser, ORIGIN);
   });
 
   describe('/ logged out', () => {
@@ -118,14 +118,14 @@ describe('my site', () => {
 
   describe('/ logged in', () => {
     it('lighthouse', async () => {
-      await login(browser, ORIGIN);
+      await login(page, ORIGIN);
       await page.goto(ORIGIN);
       const lhr = await runLighthouse(page.url());
       expect(lhr).toHaveLighthouseScoreGreaterThanOrEqual('seo', 0.9);
     });
 
     it('login form should not exist', async () => {
-      await login(browser, ORIGIN);
+      await login(page, ORIGIN);
       await page.goto(ORIGIN);
       const emailInput = await page.$('input[type="email"]');
       const passwordInput = await page.$('input[type="password"]');
@@ -143,14 +143,14 @@ describe('my site', () => {
 
   describe('/dashboard logged in', () => {
     it('lighthouse', async () => {
-      await login(browser, ORIGIN);
+      await login(page, ORIGIN);
       await page.goto(`${ORIGIN}/dashboard`);
       const lhr = await runLighthouse(page.url());
       expect(lhr).toHaveLighthouseScoreGreaterThanOrEqual('seo', 0.9);
     });
 
     it('has secrets', async () => {
-      await login(browser, ORIGIN);
+      await login(page, ORIGIN);
       await page.goto(`${ORIGIN}/dashboard`);
       expect(await page.content()).toContain('secrets');
     });
diff --git a/docs/recipes/integration-test/package.json b/docs/recipes/integration-test/package.json
index 2fe386a94acf..4c083e025d3b 100644
--- a/docs/recipes/integration-test/package.json
+++ b/docs/recipes/integration-test/package.json
@@ -1,4 +1,5 @@
 {
+  "type": "module",
   "private": true,
   "scripts": {
     "test": "mocha --timeout 30000 example-lh-auth.test.js"

From e2c32f126be0fafb1589808313967c010287f672 Mon Sep 17 00:00:00 2001
From: Adam Raine <ad.st.raine@gmail.com>
Date: Wed, 6 Jul 2022 12:33:34 -0700
Subject: [PATCH 2/5] ope

---
 docs/recipes/auth/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/recipes/auth/README.md b/docs/recipes/auth/README.md
index 8702827afefe..d3b62cb88f67 100644
--- a/docs/recipes/auth/README.md
+++ b/docs/recipes/auth/README.md
@@ -91,7 +91,7 @@ Now run Lighthouse, using the same page as before:
 // The local server is running on port 10632.
 const url = 'http://localhost:10632/dashboard';
 // Direct Lighthouse to use the same page.
-  // Disable storage reset so login session is preserved.
+// Disable storage reset so login session is preserved.
 const result = await lighthouse(url, {disableStorageReset: true}, undefined, page);
 const lhr = result.lhr;
 

From 68aef68f2019f8528d2d5a7e63e25ff3a3991e73 Mon Sep 17 00:00:00 2001
From: Adam Raine <ad.st.raine@gmail.com>
Date: Wed, 6 Jul 2022 12:34:14 -0700
Subject: [PATCH 3/5] ope

---
 docs/recipes/auth/example-lh-auth.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/recipes/auth/example-lh-auth.js b/docs/recipes/auth/example-lh-auth.js
index 4f8f757c3b04..9dd7da9ad4ca 100644
--- a/docs/recipes/auth/example-lh-auth.js
+++ b/docs/recipes/auth/example-lh-auth.js
@@ -33,7 +33,7 @@ async function login(page, origin) {
 }
 
 /**
- * @param {puppeteer.page} page
+ * @param {puppeteer.Page} page
  * @param {string} origin
  */
 async function logout(page, origin) {

From 71b313ddc2c9402756a373448f9ec60679a8e0b9 Mon Sep 17 00:00:00 2001
From: Adam Raine <ad.st.raine@gmail.com>
Date: Wed, 13 Jul 2022 10:11:24 -0700
Subject: [PATCH 4/5] typo

---
 docs/recipes/auth/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/recipes/auth/README.md b/docs/recipes/auth/README.md
index d3b62cb88f67..e2951ab2c84d 100644
--- a/docs/recipes/auth/README.md
+++ b/docs/recipes/auth/README.md
@@ -35,7 +35,7 @@ What does this do?  Read on....
 
 ## Process
 
-Puppeteer - a browser automation tool - can be used to programatically setup a session.
+Puppeteer - a browser automation tool - can be used to programmatically setup a session.
 
 1. Launch a new browser.
 1. Navigate to the login page.

From 2e4a0ea639fa6fb95bccbc7ab1a7e70089c281bb Mon Sep 17 00:00:00 2001
From: Adam Raine <ad.st.raine@gmail.com>
Date: Fri, 15 Jul 2022 14:34:02 -0700
Subject: [PATCH 5/5] ok

---
 docs/recipes/auth/package.json             | 1 -
 docs/recipes/auth/server/server.js         | 1 +
 docs/recipes/integration-test/package.json | 1 -
 3 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/docs/recipes/auth/package.json b/docs/recipes/auth/package.json
index aa132a598e3f..f06949f688f0 100644
--- a/docs/recipes/auth/package.json
+++ b/docs/recipes/auth/package.json
@@ -1,5 +1,4 @@
 {
-  "type": "module",
   "private": true,
   "type": "module",
   "scripts": {
diff --git a/docs/recipes/auth/server/server.js b/docs/recipes/auth/server/server.js
index 6fd25b03d82b..9d7cd516f3c9 100644
--- a/docs/recipes/auth/server/server.js
+++ b/docs/recipes/auth/server/server.js
@@ -11,6 +11,7 @@
  */
 
 import createError from 'http-errors';
+
 import express from 'express';
 import morgan from 'morgan';
 import session from 'express-session';
diff --git a/docs/recipes/integration-test/package.json b/docs/recipes/integration-test/package.json
index c11188c642d8..e91cef0837bc 100644
--- a/docs/recipes/integration-test/package.json
+++ b/docs/recipes/integration-test/package.json
@@ -1,5 +1,4 @@
 {
-  "type": "module",
   "private": true,
   "type": "module",
   "scripts": {