lighthouse 9.5.0-dev.20220416 → 9.5.0-dev.20220419

package/flow-report/src/summary/category.tsx

@@ -132,7 +132,7 @@ const SummaryTooltip: FunctionComponent<{
               {
                 !displayAsFraction && category.score !== null && <>
                   <span> · </span>
-                  <span>{i18n.formatNumber(category.score * 100)}</span>
+                  <span>{i18n.formatInteger(category.score * 100)}</span>
                 </>
               }
             </div>

package/lighthouse-cli/.eslintrc.cjs

@@ -3,12 +3,8 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 module.exports = {
-  env: {
-    browser: true,
-  },
   rules: {
     // TODO(esmodules): move to root eslint when all code is ESM
     // or when this is resolved: https://github.com/import-js/eslint-plugin-import/issues/2214
@@ -26,4 +22,7 @@ module.exports = {
     'import/group-exports': 2,
     'import/exports-last': 2,
   },
+  parserOptions: {
+    sourceType: 'module',
+  },
 };

package/lighthouse-cli/bin.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview The relationship between these CLI modules:

package/lighthouse-cli/cli-flags.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /* eslint-disable max-len */
 

package/lighthouse-cli/commands/commands.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 export {listAudits} from './list-audits.js';
 export {listTraceCategories} from './list-trace-categories.js';

package/lighthouse-cli/commands/list-audits.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import lighthouse from '../../lighthouse-core/index.js';
 

package/lighthouse-cli/commands/list-locales.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import locales from '../../shared/localization/locales.js';
 

package/lighthouse-cli/commands/list-trace-categories.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import lighthouse from '../../lighthouse-core/index.js';
 

package/lighthouse-cli/index.js

@@ -4,7 +4,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import {begin} from './bin.js';
 

package/lighthouse-cli/printer.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import fs from 'fs';
 

package/lighthouse-cli/run.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /* eslint-disable no-console */
 

package/lighthouse-cli/sentry-prompt.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import Configstore from 'configstore';
 import Confirm from 'enquirer';

package/lighthouse-cli/test/smokehouse/core-tests.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 import a11y from './test-definitions/a11y.js';
 import byteEfficiency from './test-definitions/byte-efficiency.js';

package/lighthouse-cli/test/smokehouse/frontends/back-compat-util.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * COMPAT: update from the old TestDefn format (array of `expectations` per

package/lighthouse-cli/test/smokehouse/frontends/lib.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview Smoke test runner.

package/lighthouse-cli/test/smokehouse/frontends/node.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview A smokehouse frontend for running within a node process.

package/lighthouse-cli/test/smokehouse/frontends/smokehouse-bin.js

@@ -4,7 +4,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview A smokehouse frontend for running from the command line. Parse

package/lighthouse-cli/test/smokehouse/lib/child-process-error.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * An extension of Error that includes any stdout or stderr from a child

package/lighthouse-cli/test/smokehouse/lib/concurrent-mapper.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * A class that maintains a concurrency pool to coordinate many jobs that should

package/lighthouse-cli/test/smokehouse/lib/local-console.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * A simple buffered log to use in place of `console`.

package/lighthouse-cli/test/smokehouse/lighthouse-runners/bundle.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview  A runner that launches Chrome and executes Lighthouse via a

package/lighthouse-cli/test/smokehouse/lighthouse-runners/cli.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview  A runner that executes Lighthouse via the Lighthouse CLI to

package/lighthouse-cli/test/smokehouse/lighthouse-runners/devtools.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview A runner that launches Chrome and executes Lighthouse via DevTools.

package/lighthouse-cli/test/smokehouse/report-assert.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview An assertion library for comparing smoke-test expectations

package/lighthouse-cli/test/smokehouse/smokehouse.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview An end-to-end test runner for Lighthouse. Takes a set of smoke

package/lighthouse-core/audits/byte-efficiency/legacy-javascript.js

@@ -30,7 +30,7 @@ const UIStrings = {
   // eslint-disable-next-line max-len
   // TODO: web.dev article. this codelab is good starting place: https://web.dev/codelab-serve-modern-code/
   /** Description of a Lighthouse audit that tells the user about old JavaScript that is no longer needed. This is displayed after a user expands the section to see more. No character length limits. 'Learn More' becomes link text to additional documentation. */
-  description: 'Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren\'t necessary for modern browsers. For your bundled JavaScript, adopt a modern script deployment strategy using module/nomodule feature detection to reduce the amount of code shipped to modern browsers, while retaining support for legacy browsers. [Learn More](https://philipwalton.com/articles/deploying-es2015-code-in-production-today/)',
+  description: 'Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren\'t necessary for modern browsers. For your bundled JavaScript, adopt a modern script deployment strategy using module/nomodule feature detection to reduce the amount of code shipped to modern browsers, while retaining support for legacy browsers. [Learn More](https://web.dev/publish-modern-javascript/)',
 };
 
 const str_ = i18n.createMessageInstanceIdFn(__filename, UIStrings);

package/lighthouse-core/fraggle-rock/gather/navigation-runner.js

@@ -5,6 +5,7 @@
  */
 'use strict';
 
+const puppeteer = require('puppeteer-core');
 const log = require('lighthouse-logger');
 const Driver = require('./driver.js');
 const Runner = require('../../runner.js');
@@ -43,6 +44,9 @@ const NetworkRecords = require('../../computed/network-records.js');
 
 /** @typedef {Omit<Parameters<typeof collectPhaseArtifacts>[0], 'phase'>} PhaseState */
 
+const DEFAULT_HOSTNAME = '127.0.0.1';
+const DEFAULT_PORT = 9222;
+
 /**
  * @param {{driver: Driver, config: LH.Config.FRConfig, options?: InternalOptions}} args
  * @return {Promise<{baseArtifacts: LH.FRBaseArtifacts}>}
@@ -299,11 +303,11 @@ async function _cleanup({requestedUrl, driver, config}) {
 
 /**
  * @param {LH.NavigationRequestor|undefined} requestor
- * @param {{page: LH.Puppeteer.Page, config?: LH.Config.Json, configContext?: LH.Config.FRContext}} options
+ * @param {{page?: LH.Puppeteer.Page, config?: LH.Config.Json, configContext?: LH.Config.FRContext}} options
  * @return {Promise<LH.Gatherer.FRGatherResult>}
  */
 async function navigationGather(requestor, options) {
-  const {page, configContext = {}} = options;
+  const {configContext = {}} = options;
   log.setLevel(configContext.logLevel || 'error');
 
   const {config} = initializeConfig(options.config, {...configContext, gatherMode: 'navigation'});
@@ -321,6 +325,16 @@ async function navigationGather(requestor, options) {
   const runnerOptions = {config, computedCache};
   const artifacts = await Runner.gather(
     async () => {
+      let {page} = options;
+
+      // For navigation mode, we shouldn't connect to a browser in audit mode,
+      // therefore we connect to the browser in the gatherFn callback.
+      if (!page) {
+        const {hostname = DEFAULT_HOSTNAME, port = DEFAULT_PORT} = configContext;
+        const browser = await puppeteer.connect({browserURL: `http://${hostname}:${port}`});
+        page = await browser.newPage();
+      }
+
       const driver = new Driver(page);
       const context = {
         driver,

package/lighthouse-core/gather/gatherers/full-page-screenshot.js

@@ -15,6 +15,7 @@ const {waitForNetworkIdle} = require('../driver/wait-for-condition.js');
 
 // JPEG quality setting
 // Exploration and examples of reports using different quality settings: https://docs.google.com/document/d/1ZSffucIca9XDW2eEwfoevrk-OTl7WQFeMf0CgeJAA8M/edit#
+// Note: this analysis was done for JPEG, but now we use WEBP.
 const FULL_PAGE_SCREENSHOT_QUALITY = 30;
 
 /**
@@ -118,10 +119,10 @@ class FullPageScreenshot extends FRGatherer {
     await context.driver.executionContext.evaluate(waitForDoubleRaf, {args: []});
 
     const result = await session.sendCommand('Page.captureScreenshot', {
-      format: 'jpeg',
+      format: 'webp',
       quality: FULL_PAGE_SCREENSHOT_QUALITY,
     });
-    const data = 'data:image/jpeg;base64,' + result.data;
+    const data = 'data:image/webp;base64,' + result.data;
 
     return {
       data,

package/lighthouse-core/index.js

@@ -5,7 +5,6 @@
  */
 'use strict';
 
-const puppeteer = require('puppeteer-core');
 const Runner = require('./runner.js');
 const log = require('lighthouse-logger');
 const ChromeProtocol = require('./gather/connections/cri.js');
@@ -15,9 +14,6 @@ const fraggleRock = require('./fraggle-rock/api.js');
 
 /** @typedef {import('./gather/connections/connection.js')} Connection */
 
-const DEFAULT_HOSTNAME = '127.0.0.1';
-const DEFAULT_PORT = 9222;
-
 /*
  * The relationship between these root modules:
  *
@@ -42,15 +38,12 @@ const DEFAULT_PORT = 9222;
  * @return {Promise<LH.RunnerResult|undefined>}
  */
 async function lighthouse(url, flags = {}, configJSON, page) {
-  if (!page) {
-    const {hostname = DEFAULT_HOSTNAME, port = DEFAULT_PORT} = flags;
-    const browser = await puppeteer.connect({browserURL: `http://${hostname}:${port}`});
-    page = await browser.newPage();
-  }
   const configContext = {
     configPath: flags.configPath,
     settingsOverrides: flags,
     logLevel: flags.logLevel,
+    hostname: flags.hostname,
+    port: flags.port,
   };
   return fraggleRock.navigation(url, {page, config: configJSON, configContext});
 }

package/lighthouse-core/lib/stack-packs.js

@@ -48,6 +48,10 @@ const stackPacksToInclude = [
     packId: 'next.js',
     requiredStacks: ['js:next'],
   },
+  {
+    packId: 'nuxt',
+    requiredStacks: ['js:nuxt'],
+  },
   {
     packId: 'angular',
     requiredStacks: ['js:@angular/core'],

package/lighthouse-core/scripts/manual-chrome-launcher.js

@@ -1,6 +1,5 @@
 #!/usr/bin/env node
 
-'use strict';
 
 /**
  * @fileoverview Script to launch a clean Chrome instance on-demand.

package/lighthouse-core/util-commonjs.js

@@ -1,6 +1,7 @@
 // @ts-nocheck
 // Auto-generated by lighthouse-core/scripts/copy-util-commonjs.sh
 // Temporary solution until all our code uses esmodules
+'use strict';
 /**
  * @license
  * Copyright 2017 The Lighthouse Authors. All Rights Reserved.
@@ -17,7 +18,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-'use strict';
 
 /** @template T @typedef {import('./i18n').I18n<T>} I18n */
 
@@ -433,10 +433,13 @@ class Util {
         break;
       case 'devtools': {
         const {cpuSlowdownMultiplier, requestLatencyMs} = throttling;
-        cpuThrottling = `${Util.i18n.formatNumber(cpuSlowdownMultiplier)}x slowdown (DevTools)`;
-        networkThrottling = `${Util.i18n.formatNumber(requestLatencyMs)}${NBSP}ms HTTP RTT, ` +
-          `${Util.i18n.formatNumber(throttling.downloadThroughputKbps)}${NBSP}Kbps down, ` +
-          `${Util.i18n.formatNumber(throttling.uploadThroughputKbps)}${NBSP}Kbps up (DevTools)`;
+        // TODO: better api in i18n formatter such that this isn't needed.
+        const cpuGranularity = Number.isInteger(cpuSlowdownMultiplier) ? 1 : 0.1;
+        // eslint-disable-next-line max-len
+        cpuThrottling = `${Util.i18n.formatNumber(cpuSlowdownMultiplier, cpuGranularity)}x slowdown (DevTools)`;
+        networkThrottling = `${Util.i18n.formatMilliseconds(requestLatencyMs, 1)} HTTP RTT, ` +
+          `${Util.i18n.formatKbps(throttling.downloadThroughputKbps)} down, ` +
+          `${Util.i18n.formatKbps(throttling.uploadThroughputKbps)} up (DevTools)`;
 
         const isSlow4G = () => {
           return requestLatencyMs === 150 * 3.75 &&
@@ -448,9 +451,12 @@ class Util {
       }
       case 'simulate': {
         const {cpuSlowdownMultiplier, rttMs, throughputKbps} = throttling;
-        cpuThrottling = `${Util.i18n.formatNumber(cpuSlowdownMultiplier)}x slowdown (Simulated)`;
-        networkThrottling = `${Util.i18n.formatNumber(rttMs)}${NBSP}ms TCP RTT, ` +
-          `${Util.i18n.formatNumber(throughputKbps)}${NBSP}Kbps throughput (Simulated)`;
+        // TODO: better api in i18n formatter such that this isn't needed.
+        const cpuGranularity = Number.isInteger(cpuSlowdownMultiplier) ? 1 : 0.1;
+        // eslint-disable-next-line max-len
+        cpuThrottling = `${Util.i18n.formatNumber(cpuSlowdownMultiplier, cpuGranularity)}x slowdown (Simulated)`;
+        networkThrottling = `${Util.i18n.formatMilliseconds(rttMs)} TCP RTT, ` +
+          `${Util.i18n.formatKbps(throughputKbps)} throughput (Simulated)`;
 
         const isSlow4G = () => {
           return rttMs === 150 && throughputKbps === 1.6 * 1024;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lighthouse",
-  "version": "9.5.0-dev.20220416",
+  "version": "9.5.0-dev.20220419",
   "description": "Automated auditing, performance metrics, and best practices for the web.",
   "main": "./lighthouse-core/index.js",
   "bin": {
@@ -193,7 +193,7 @@
     "jpeg-js": "^0.4.3",
     "js-library-detector": "^6.4.0",
     "lighthouse-logger": "^1.3.0",
-    "lighthouse-stack-packs": "^1.7.0",
+    "lighthouse-stack-packs": "^1.8.1",
     "lodash": "^4.17.21",
     "lookup-closest-locale": "6.2.0",
     "metaviewport-parser": "0.2.0",
@@ -204,7 +204,7 @@
     "robots-parser": "^3.0.0",
     "semver": "^5.3.0",
     "speedline-core": "^1.4.3",
-    "third-party-web": "^0.15.0",
+    "third-party-web": "^0.17.1",
     "ws": "^7.0.0",
     "yargs": "^17.3.1",
     "yargs-parser": "^21.0.0"

package/report/.eslintrc.cjs

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * eslint does not support ESM rc files, so this must be a .cjs file.
@@ -32,4 +31,7 @@ module.exports = {
     'import/group-exports': 2,
     'import/exports-last': 2,
   },
+  parserOptions: {
+    sourceType: 'module',
+  },
 };

package/report/assets/styles.css

@@ -1745,15 +1745,18 @@ details[open] .lh-clump-toggletext--hide { display: block;}
 
 /* Element screenshot */
 .lh-element-screenshot {
-  position: relative;
-  overflow: hidden;
   float: left;
   margin-right: 20px;
 }
 .lh-element-screenshot__content {
   overflow: hidden;
+  min-width: 110px;
+  display: flex;
+  justify-content: center;
+  background-color: var(--report-background-color);
 }
 .lh-element-screenshot__image {
+  position: relative;
   /* Set by ElementScreenshotRenderer.installFullPageScreenshotCssVariable */
   background-image: var(--element-screenshot-url);
   outline: 2px solid #777;

package/report/assets/templates.html

@@ -893,16 +893,17 @@ limitations under the License.
 <template id="elementScreenshot">
   <div class="lh-element-screenshot">
     <div class="lh-element-screenshot__content">
-      <div class="lh-element-screenshot__mask">
-        <svg height="0" width="0">
-          <defs>
-            <clipPath clipPathUnits="objectBoundingBox"></clipPath>
-            <!-- clipPath filled by ElementScreenshotRenderer.renderClipPath -->
-          </defs>
-        </svg>
+      <div class="lh-element-screenshot__image">
+        <div class="lh-element-screenshot__mask">
+          <svg height="0" width="0">
+            <defs>
+              <clipPath clipPathUnits="objectBoundingBox"></clipPath>
+              <!-- clipPath filled by ElementScreenshotRenderer.renderClipPath -->
+            </defs>
+          </svg>
+        </div>
+        <div class="lh-element-screenshot__element-marker"></div>
       </div>
-      <div class="lh-element-screenshot__image"></div>
-      <div class="lh-element-screenshot__element-marker"></div>
     </div>
   </div>
 </template>

package/report/clients/bundle.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 // This file is used to generate a bundle that can be imported
 // into an esmodules codebase to render the lighthouse report.

package/report/clients/standalone.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 /**
  * @fileoverview The entry point for rendering the Lighthouse report for the HTML

package/report/renderer/api.js

@@ -3,7 +3,6 @@
  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
-'use strict';
 
 
 import {DOM} from '../renderer/dom.js';

package/report/renderer/category-renderer.js

@@ -14,7 +14,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-'use strict';
 
 /** @typedef {import('./dom.js').DOM} DOM */
 /** @typedef {import('./report-renderer.js').ReportRenderer} ReportRenderer */