tests: check for console errors and warnings in pptr tests (#15516)

GoogleChrome · Jan 16, 2024 · 047974f · 047974f
1 parent 629f5e7
commit 047974f
Show file tree

Hide file tree

Showing 5 changed files with 101 additions and 23 deletions.
diff --git a/clients/test/extension/popup-test-pptr.js b/clients/test/extension/popup-test-pptr.js
@@ -33,7 +33,20 @@ describe('Lighthouse chrome popup', function() {
 
   let browser;
   let page;
-  const pageErrors = [];
+  let pageErrors = [];
+
+  async function claimErrors() {
+    const theErrors = pageErrors;
+    pageErrors = [];
+    return await Promise.all(theErrors);
+  }
+
+  async function ensureNoErrors() {
+    await page.bringToFront();
+    await page.evaluate(() => new Promise(window.requestAnimationFrame));
+    const errors = await claimErrors();
+    expect(errors).toHaveLength(0);
+  }
 
   before(async function() {
     // start puppeteer
@@ -43,8 +56,19 @@ describe('Lighthouse chrome popup', function() {
     });
 
     page = await browser.newPage();
-    page.on('pageerror', err => {
-      pageErrors.push(err);
+    page.on('pageerror', e => pageErrors.push(`${e.message} ${e.stack}`));
+    page.on('console', (e) => {
+      if (e.type() === 'error' || e.type() === 'warning') {
+        const describe = (jsHandle) => {
+          return jsHandle.executionContext().evaluate((obj) => {
+            return JSON.stringify(obj, null, 2);
+          }, jsHandle);
+        };
+        const promise = Promise.all(e.args().map(describe)).then(args => {
+          return `${e.text()} ${args.join(' ')} ${JSON.stringify(e.location(), null, 2)}`;
+        });
+        pageErrors.push(promise);
+      }
     });
     await page.evaluateOnNewDocument((mockStorage) => {
       Object.defineProperty(chrome, 'tabs', {
@@ -85,7 +109,7 @@ describe('Lighthouse chrome popup', function() {
   });
 
   it('should load without errors', async function() {
-    expect(pageErrors).toHaveLength(0);
+    await ensureNoErrors();
   });
 
   it('should generate the category checkboxes', async function() {

diff --git a/treemap/test/treemap-test-pptr.js b/treemap/test/treemap-test-pptr.js
@@ -55,16 +55,38 @@ describe('Lighthouse Treemap', () => {
       });
     }
     page = await browser.newPage();
-    page.on('pageerror', pageError => pageErrors.push(pageError));
+    page.on('pageerror', e => pageErrors.push(`${e.message} ${e.stack}`));
+    page.on('console', (e) => {
+      if (e.type() === 'error' || e.type() === 'warning') {
+        const describe = (jsHandle) => {
+          return jsHandle.executionContext().evaluate((obj) => {
+            return JSON.stringify(obj, null, 2);
+          }, jsHandle);
+        };
+        const promise = Promise.all(e.args().map(describe)).then(args => {
+          return `${e.text()} ${args.join(' ')} ${JSON.stringify(e.location(), null, 2)}`;
+        });
+        pageErrors.push(promise);
+      }
+    });
   });
 
+  async function claimErrors() {
+    const theErrors = pageErrors;
+    pageErrors = [];
+    return await Promise.all(theErrors);
+  }
+
+  async function ensureNoErrors() {
+    await page.bringToFront();
+    await page.evaluate(() => new Promise(window.requestAnimationFrame));
+    const errors = await claimErrors();
+    expect(errors).toHaveLength(0);
+  }
+
   afterEach(async () => {
+    await ensureNoErrors();
     await page.close();
-
-    // Fails if any unexpected errors ocurred.
-    // If a test expects an error, it will clear this array.
-    expect(pageErrors).toMatchObject([]);
-    pageErrors = [];
   });
 
   describe('Recieves options', () => {

diff --git a/viewer/app/src/psi-api.js b/viewer/app/src/psi-api.js
@@ -45,7 +45,11 @@ class PSIApi {
       apiUrl.searchParams.append('category', singleCategory);
     }
     apiUrl.searchParams.append('key', PSI_KEY);
-    return fetch(apiUrl.href).then(res => res.json());
+    return fetch(apiUrl.href, {
+      headers: {
+        referer: 'googlechrome.github.io',
+      },
+    }).then(res => res.json());
   }
 }
 

diff --git a/viewer/app/src/viewer-ui-features.js b/viewer/app/src/viewer-ui-features.js
@@ -46,6 +46,8 @@ export class ViewerUIFeatures extends ReportUIFeatures {
     }
 
     this._getI18nModule().then(i18nModule => {
+      if (!report.i18n?.icuMessagePaths) return;
+
       const locales = /** @type {LH.Locale[]} */ (i18nModule.format.getCanonicalLocales());
       this._swapLocales.enable(locales);
     }).catch(err => console.error(err));

diff --git a/viewer/test/viewer-test-pptr.js b/viewer/test/viewer-test-pptr.js
@@ -71,7 +71,25 @@ describe('Lighthouse Viewer', () => {
       executablePath: getChromePath(),
     });
     viewerPage = await browser.newPage();
-    viewerPage.on('pageerror', pageError => pageErrors.push(pageError));
+    viewerPage.on('pageerror', e => pageErrors.push(`${e.message} ${e.stack}`));
+    viewerPage.on('console', (e) => {
+      if (e.type() === 'error' || e.type() === 'warning') {
+        // TODO gotta upgrade our own stuff.
+        if (e.text().includes('Please adopt the new report API')) return;
+        // Rendering a report from localhost page will attempt to display unreachable resources.
+        if (e.location().url.includes('lighthouse-480x318.jpg')) return;
+
+        const describe = (jsHandle) => {
+          return jsHandle.executionContext().evaluate((obj) => {
+            return JSON.stringify(obj, null, 2);
+          }, jsHandle);
+        };
+        const promise = Promise.all(e.args().map(describe)).then(args => {
+          return `${e.text()} ${args.join(' ')} ${JSON.stringify(e.location(), null, 2)}`;
+        });
+        pageErrors.push(promise);
+      }
+    });
   });
 
   after(async function() {
@@ -81,16 +99,19 @@ describe('Lighthouse Viewer', () => {
     ]);
   });
 
-  beforeEach(async function() {
+  async function claimErrors() {
+    const theErrors = pageErrors;
     pageErrors = [];
-  });
+    return await Promise.all(theErrors);
+  }
 
   async function ensureNoErrors() {
     await viewerPage.bringToFront();
     await viewerPage.evaluate(() => new Promise(window.requestAnimationFrame));
-    const theErrors = pageErrors;
-    pageErrors = [];
-    expect(theErrors).toHaveLength(0);
+    const errors = await claimErrors();
+    if (errors.length) {
+      assert.fail('errors from page:\n\n' + errors.map(e => e.toString()).join('\n\n'));
+    }
   }
 
   afterEach(async function() {
@@ -262,12 +283,14 @@ describe('Lighthouse Viewer', () => {
 
       const savedPage = await browser.newPage();
       const savedPageErrors = [];
-      savedPage.on('pageerror', pageError => savedPageErrors.push(pageError));
+      savedPage.on('pageerror', e => savedPageErrors.push(e));
       const firstLogPromise =
         new Promise(resolve => savedPage.once('console', e => resolve(e.text())));
       await savedPage.goto(`file://${tmpDir}/${filename}`);
       expect(await firstLogPromise).toEqual('window.__LIGHTHOUSE_JSON__ JSHandle@object');
-      expect(savedPageErrors).toHaveLength(0);
+      if (savedPageErrors.length) {
+        assert.fail('errors from page:\n\n' + savedPageErrors.map(e => e.toString()).join('\n\n'));
+      }
     });
   });
 
@@ -282,6 +305,8 @@ describe('Lighthouse Viewer', () => {
       waitForAck,
       new Promise((resolve, reject) => setTimeout(reject, 5_000)),
     ]);
+    // Give async work some time to happen (ex: SwapLocaleFeature.enable).
+    await new Promise(resolve => setTimeout(resolve, 3_000));
     await ensureNoErrors();
 
     const content = await viewerPage.$eval('main', el => el.textContent);
@@ -466,10 +491,11 @@ describe('Lighthouse Viewer', () => {
       const errorMessage = await viewerPage.evaluate(errorEl => errorEl.textContent, errorEl);
       expect(errorMessage).toBe('badPsiResponse error');
 
-      // One error.
-      expect(pageErrors).toHaveLength(1);
-      expect(pageErrors[0].message).toContain('badPsiResponse error');
-      pageErrors = [];
+      // Expected errors.
+      const errors = await claimErrors();
+      expect(errors).toHaveLength(2);
+      expect(errors[0]).toContain('500 (Internal Server Error)');
+      expect(errors[1]).toContain('badPsiResponse error');
     });
   });
 });