[WRFL-2471] puppeteer upgrade

package.json

@@ -30,7 +30,7 @@
     "express": "^4.17.1",
     "html-minifier": "^4.0.0",
     "lighthouse": "^9.6.3",
-    "puppeteer": "^18.0.0"
+    "puppeteer": "^24.8.2"
   },
   "engines": {
     "node": ">=18.14.0"

src/e2e/fail-threshold-onpostbuild.test.js

@@ -34,6 +34,8 @@ describe('lighthousePlugin with failed threshold run (onPostBuild)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on example/',
       'Serving and scanning site from directory example',
@@ -43,6 +45,8 @@ describe('lighthousePlugin with failed threshold run (onPostBuild)', () => {
       '- Best Practices: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
 
     await lighthousePlugin({

src/e2e/fail-threshold-onsuccess.test.js

@@ -34,6 +34,8 @@ describe('lighthousePlugin with failed threshold run (onSuccess)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on /',
       'Lighthouse scores for /',
@@ -42,6 +44,8 @@ describe('lighthousePlugin with failed threshold run (onSuccess)', () => {
       '- Best Practices: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
 
     await lighthousePlugin().onSuccess({ utils: mockUtils });

src/e2e/fixture/utils.js

@@ -6,6 +6,10 @@ const mockUtils = {
   status: {
     show: jest.fn(),
   },
+  cache: {
+    save: jest.fn(),
+    restore: jest.fn(),
+  },
 };
 
 export default mockUtils;

src/e2e/mocks/puppeteer.js

@@ -2,9 +2,9 @@ const puppeteer = () =>
   jest.unstable_mockModule('puppeteer', () => {
     return {
       default: {
-        createBrowserFetcher: () => ({
-          localRevisions: () => Promise.resolve(['123']),
-          revisionInfo: () => Promise.resolve({ executablePath: 'path' }),
+        launch: () => ({
+          process: () => ({ spawnfile: 'path' }),
+          close: () => Promise.resolve(),
         }),
       },
     };

src/e2e/not-found-onpostbuild.test.js

@@ -25,11 +25,15 @@ describe('lighthousePlugin with single not-found run (onPostBuild)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on example/this-page-does-not-exist',
       'Serving and scanning site from directory example',
       'ERRORED_DOCUMENT_REQUEST',
       'Lighthouse was unable to reliably load the page you requested. Make sure you are testing the correct URL and that the server is properly responding to all requests. (Status code: 404)',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
 
     await lighthousePlugin({

src/e2e/not-found-onsuccess.test.js

@@ -25,10 +25,14 @@ describe('lighthousePlugin with single not-found run (onSuccess)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on /this-page-does-not-exist',
       'ERRORED_DOCUMENT_REQUEST',
       'Lighthouse was unable to reliably load the page you requested. Make sure you are testing the correct URL and that the server is properly responding to all requests. (Status code: 404)',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
 
     await lighthousePlugin().onSuccess({ utils: mockUtils });

src/e2e/settings-locale.test.js

@@ -35,6 +35,8 @@ describe('lighthousePlugin with custom locale', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on / using the “es” locale',
       'Lighthouse scores for /',
@@ -43,6 +45,8 @@ describe('lighthousePlugin with custom locale', () => {
       '- Prácticas recomendadas: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
 
     await lighthousePlugin().onSuccess({ utils: mockUtils });

src/e2e/settings-preset.test.js

@@ -29,6 +29,8 @@ describe('lighthousePlugin with custom device preset', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on / using the “desktop” preset',
       'Lighthouse scores for /',
@@ -37,6 +39,8 @@ describe('lighthousePlugin with custom device preset', () => {
       '- Best Practices: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
     await lighthousePlugin().onSuccess({ utils: mockUtils });
     expect(formatMockLog(console.log.mock.calls)).toEqual(logs);

src/e2e/success-onpostbuild.test.js

@@ -24,6 +24,9 @@ describe('lighthousePlugin with single report per run (onPostBuild)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
+
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on example/',
       'Serving and scanning site from directory example',
@@ -33,6 +36,8 @@ describe('lighthousePlugin with single report per run (onPostBuild)', () => {
       '- Best Practices: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
     await lighthousePlugin({
       fail_deploy_on_score_thresholds: 'true',

src/e2e/success-onsuccess.test.js

@@ -24,6 +24,8 @@ describe('lighthousePlugin with single report per run (onSuccess)', () => {
 
   it('should output expected log content', async () => {
     const logs = [
+      'Restoring Lighthouse cache...',
+      'Lighthouse cache restored',
       'Generating Lighthouse report. This may take a minute…',
       'Running Lighthouse on /',
       'Lighthouse scores for /',
@@ -32,6 +34,8 @@ describe('lighthousePlugin with single report per run (onSuccess)', () => {
       '- Best Practices: 100',
       '- SEO: 91',
       '- PWA: 30',
+      'Persisting Lighthouse cache...',
+      'Lighthouse cache persisted',
     ];
     await lighthousePlugin().onSuccess({ utils: mockUtils });
     expect(formatMockLog(console.log.mock.calls)).toEqual(logs);

src/index.js

@@ -1,10 +1,28 @@
+import { join } from 'path';
+import { homedir } from 'os';
+
 import * as dotenv from 'dotenv';
 
 import runEvent from './lib/run-event/index.js';
 import getUtils from './lib/get-utils/index.js';
 
 dotenv.config();
 
+const puppeteerCacheDir = join(homedir(), '.cache', 'puppeteer');
+
+const restorePuppeteerCache = async ({ utils } = {}) => {
+  console.log('Restoring Lighthouse cache...');
+  // Puppeteer relies on a global cache since v19.x, which otherwise would not be persisted in Netlify builds
+  await utils?.cache.restore(puppeteerCacheDir);
+  console.log('Lighthouse cache restored');
+};
+
+const persistPuppeteerCache = async ({ utils } = {}) => {
+  console.log('Persisting Lighthouse cache...');
+  await utils?.cache.save(puppeteerCacheDir);
+  console.log('Lighthouse cache persisted');
+};
+
 export default function lighthousePlugin(inputs) {
   // Run onSuccess by default, unless inputs specify we should fail_deploy_on_score_thresholds
   const defaultEvent =
@@ -15,6 +33,7 @@ export default function lighthousePlugin(inputs) {
   if (defaultEvent === 'onSuccess') {
     return {
       onSuccess: async ({ constants, utils, inputs } = {}) => {
+        await restorePuppeteerCache({ utils });
         // Mock the required `utils` functions if running locally
         const { failPlugin, show } = getUtils({ utils });
 
@@ -25,11 +44,13 @@ export default function lighthousePlugin(inputs) {
           onComplete: show,
           onFail: failPlugin,
         });
+        await persistPuppeteerCache({ utils });
       },
     };
   } else {
     return {
       onPostBuild: async ({ constants, utils, inputs } = {}) => {
+        await restorePuppeteerCache({ utils });
         // Mock the required `utils` functions if running locally
         const { failBuild, show } = getUtils({ utils });
 
@@ -40,6 +61,7 @@ export default function lighthousePlugin(inputs) {
           onComplete: show,
           onFail: failBuild,
         });
+        await persistPuppeteerCache({ utils });
       },
     };
   }

src/index.test.js

@@ -1,8 +1,8 @@
 import lighthousePlugin from './index.js';
 
 describe('lighthousePlugin plugin events', () => {
-  describe('onPostBuild', () => {
-    it('should return only the expected event function', async () => {
+  describe('when fail_deploy_on_score_thresholds is true', () => {
+    it('should return onPostBuild events', async () => {
       const events = lighthousePlugin({
         fail_deploy_on_score_thresholds: 'true',
       });
@@ -12,8 +12,8 @@ describe('lighthousePlugin plugin events', () => {
     });
   });
 
-  describe('onSuccess', () => {
-    it('should return only the expected event function', async () => {
+  describe('default behavior', () => {
+    it('should return onSuccess event', async () => {
       const events = lighthousePlugin();
       expect(events).toEqual({
         onSuccess: expect.any(Function),

src/run-lighthouse.js

@@ -4,13 +4,13 @@ import log from 'lighthouse-logger';
 import chromeLauncher from 'chrome-launcher';
 
 export const getBrowserPath = async () => {
-  const browserFetcher = puppeteer.createBrowserFetcher();
-  const revisions = await browserFetcher.localRevisions();
-  if (revisions.length <= 0) {
-    throw new Error('Could not find local browser');
-  }
-  const info = await browserFetcher.revisionInfo(revisions[0]);
-  return info.executablePath;
+  const browser = await puppeteer.launch({
+    headless: 'new',
+    args: ['--no-sandbox', '--disable-gpu', '--disable-dev-shm-usage'],
+  });
+  const path = browser.process().spawnfile;
+  await browser.close();
+  return path;
 };
 
 export const runLighthouse = async (browserPath, url, settings) => {