lighthouse 8.0.0-dev.20210709 → 8.0.0

package/lighthouse-core/fraggle-rock/config/validation.js

@@ -6,8 +6,8 @@
 'use strict';
 
 /**
- * @param {LH.Config.GathererDefn | LH.Config.AnyFRGathererDefn} gathererDefn
- * @return {gathererDefn is LH.Config.AnyFRGathererDefn}
+ * @param {LH.Config.GathererDefn | LH.Config.FRGathererDefn} gathererDefn
+ * @return {gathererDefn is LH.Config.FRGathererDefn}
  */
 function isFRGathererDefn(gathererDefn) {
   return 'meta' in gathererDefn.instance;
@@ -17,8 +17,8 @@ function isFRGathererDefn(gathererDefn) {
  * Determines if the artifact dependency direction is valid. The dependency's minimum supported mode
  * must be less than or equal to the dependent's.
  *
- * @param {LH.Config.AnyFRGathererDefn} dependent The artifact that depends on the other.
- * @param {LH.Config.AnyFRGathererDefn} dependency The artifact that is being depended on by the other.
+ * @param {LH.Config.FRGathererDefn} dependent The artifact that depends on the other.
+ * @param {LH.Config.FRGathererDefn} dependency The artifact that is being depended on by the other.
  * @return {boolean}
  */
 function isValidArtifactDependency(dependent, dependency) {

package/lighthouse-core/fraggle-rock/gather/base-artifacts.js

@@ -5,12 +5,7 @@
  */
 'use strict';
 
-const log = require('lighthouse-logger');
-const isEqual = require('lodash.isequal');
-const {
-  getBenchmarkIndex,
-  getEnvironmentWarnings,
-} = require('../../gather/driver/environment.js');
+const {getBrowserVersion, getBenchmarkIndex} = require('../../gather/driver/environment.js');
 
 /**
  * @param {LH.Config.FRConfig} config
@@ -18,73 +13,43 @@ const {
  * @return {Promise<LH.BaseArtifacts>}
  */
 async function getBaseArtifacts(config, driver) {
+  const HostUserAgent = (await getBrowserVersion(driver.defaultSession)).userAgent;
+
+  // Whether Lighthouse was run on a mobile device (i.e. not on a desktop machine).
+  const HostFormFactor =
+    HostUserAgent.includes('Android') || HostUserAgent.includes('Mobile') ? 'mobile' : 'desktop';
+
   const BenchmarkIndex = await getBenchmarkIndex(driver.executionContext);
 
+  /** @type {Array<string | LH.IcuMessage>} */
+  const LighthouseRunWarnings = [];
+
+  // TODO(FR-COMPAT): support slow host CPU warning
+  // TODO(FR-COMPAT): support redirected URL warning
+
   return {
     // Meta artifacts.
     fetchTime: new Date().toJSON(),
     Timing: [],
-    LighthouseRunWarnings: [],
+    LighthouseRunWarnings,
     settings: config.settings,
     // Environment artifacts that can always be computed.
+    HostFormFactor,
+    HostUserAgent,
     BenchmarkIndex,
     // Contextual artifacts whose collection changes based on gather mode.
     URL: {requestedUrl: '', finalUrl: ''},
-    PageLoadError: null,
+    PageLoadError: null, // TODO(FR-COMPAT): support PageLoadError
     // Artifacts that have been replaced by regular gatherers in Fraggle Rock.
-    HostFormFactor: 'mobile',
-    HostUserAgent: '',
     Stacks: [],
     NetworkUserAgent: '',
-    WebAppManifest: null,
-    InstallabilityErrors: {errors: []},
+    WebAppManifest: null, // replaced by standard gatherer
+    InstallabilityErrors: {errors: []}, // replaced by standard gatherer
     traces: {},
     devtoolsLogs: {},
   };
 }
 
-/**
- * Deduplicates identical warnings.
- * @param {Array<string | LH.IcuMessage>} warnings
- * @return {Array<string | LH.IcuMessage>}
- */
-function deduplicateWarnings(warnings) {
-  /** @type {Array<string | LH.IcuMessage>} */
-  const unique = [];
-
-  for (const warning of warnings) {
-    if (unique.some(existing => isEqual(warning, existing))) continue;
-    unique.push(warning);
-  }
-
-  return unique;
-}
-
-/**
- * @param {LH.FRBaseArtifacts} baseArtifacts
- * @param {Partial<LH.Artifacts>} gathererArtifacts
- * @return {LH.Artifacts}
- */
-function finalizeArtifacts(baseArtifacts, gathererArtifacts) {
-  const warnings = baseArtifacts.LighthouseRunWarnings
-    .concat(gathererArtifacts.LighthouseRunWarnings || [])
-    .concat(getEnvironmentWarnings({settings: baseArtifacts.settings, baseArtifacts}));
-
-  // Cast to remove the partial from gathererArtifacts.
-  const artifacts = /** @type {LH.Artifacts} */ ({...baseArtifacts, ...gathererArtifacts});
-
-  // Set the post-run meta artifacts.
-  artifacts.Timing = log.getTimeEntries();
-  artifacts.LighthouseRunWarnings = deduplicateWarnings(warnings);
-
-  // Check that the runner remembered to mutate the special-case URL artifact.
-  if (!artifacts.URL.requestedUrl) throw new Error('Runner did not set requestedUrl');
-  if (!artifacts.URL.finalUrl) throw new Error('Runner did not set finalUrl');
-
-  return artifacts;
-}
-
 module.exports = {
   getBaseArtifacts,
-  finalizeArtifacts,
 };

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

@@ -19,7 +19,7 @@ const storage = require('../../gather/driver/storage.js');
 const emulation = require('../../lib/emulation.js');
 const {defaultNavigationConfig} = require('../../config/constants.js');
 const {initializeConfig} = require('../config/config.js');
-const {getBaseArtifacts, finalizeArtifacts} = require('./base-artifacts.js');
+const {getBaseArtifacts} = require('./base-artifacts.js');
 const i18n = require('../../lib/i18n/i18n.js');
 const LighthouseError = require('../../lib/lh-error.js');
 const {getPageLoadError} = require('../../lib/navigation-error.js');
@@ -126,7 +126,7 @@ async function _collectNetworkRecords(navigationContext, phaseState) {
  * @param {PhaseState} phaseState
  * @param {UnPromise<ReturnType<typeof _setupNavigation>>} setupResult
  * @param {UnPromise<ReturnType<typeof _navigate>>} navigateResult
- * @return {Promise<{finalUrl: string, artifacts: Partial<LH.GathererArtifacts>, warnings: Array<LH.IcuMessage>, pageLoadError: LH.LighthouseError | undefined}>}
+ * @return {Promise<{artifacts: Partial<LH.GathererArtifacts>, warnings: Array<LH.IcuMessage>, pageLoadError: LH.LighthouseError | undefined}>}
  */
 async function _computeNavigationResult(
   navigationContext,
@@ -150,17 +150,12 @@ async function _computeNavigationResult(
     const localizedMessage = i18n.getFormatted(pageLoadError.friendlyMessage, locale);
     log.error('NavigationRunner', localizedMessage, navigationContext.requestedUrl);
 
-    return {
-      finalUrl,
-      pageLoadError,
-      artifacts: {},
-      warnings: [...warnings, pageLoadError.friendlyMessage],
-    };
+    return {artifacts: {}, warnings: [...warnings, pageLoadError.friendlyMessage], pageLoadError};
   } else {
     await collectPhaseArtifacts({phase: 'getArtifact', ...phaseState});
 
     const artifacts = await awaitArtifacts(phaseState.artifactState);
-    return {finalUrl, artifacts, warnings, pageLoadError: undefined};
+    return {artifacts, warnings, pageLoadError: undefined};
   }
 }
 
@@ -199,8 +194,6 @@ async function _navigations({driver, config, requestedUrl, computedCache}) {
 
   /** @type {Partial<LH.FRArtifacts & LH.FRBaseArtifacts>} */
   const artifacts = {};
-  /** @type {Array<LH.IcuMessage>} */
-  const LighthouseRunWarnings = [];
 
   for (const navigation of config.navigations) {
     const navigationContext = {
@@ -212,20 +205,16 @@ async function _navigations({driver, config, requestedUrl, computedCache}) {
     };
 
     const navigationResult = await _navigation(navigationContext);
-    if (navigation.loadFailureMode === 'fatal') {
-      if (navigationResult.pageLoadError) {
-        artifacts.PageLoadError = navigationResult.pageLoadError;
-        break;
-      }
-
-      artifacts.URL = {requestedUrl, finalUrl: navigationResult.finalUrl};
+    if (navigationResult.pageLoadError && navigation.loadFailureMode === 'fatal') {
+      artifacts.PageLoadError = navigationResult.pageLoadError;
+      break;
     }
 
-    LighthouseRunWarnings.push(...navigationResult.warnings);
+    // TODO(FR-COMPAT): merge RunWarnings between navigations
     Object.assign(artifacts, navigationResult.artifacts);
   }
 
-  return {artifacts: {...artifacts, LighthouseRunWarnings}};
+  return {artifacts};
 }
 
 /**
@@ -254,7 +243,7 @@ async function navigation(options) {
       const {artifacts} = await _navigations({driver, config, requestedUrl, computedCache});
       await _cleanup({driver, config, requestedUrl});
 
-      return finalizeArtifacts(baseArtifacts, artifacts);
+      return /** @type {LH.Artifacts} */ ({...baseArtifacts, ...artifacts}); // Cast to drop Partial<>
     },
     {
       url: requestedUrl,

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

@@ -8,7 +8,7 @@
 /**
  * @typedef CollectPhaseArtifactOptions
  * @property {import('./driver.js')} driver
- * @property {Array<LH.Config.AnyArtifactDefn>} artifactDefinitions
+ * @property {Array<LH.Config.ArtifactDefn>} artifactDefinitions
  * @property {ArtifactState} artifactState
  * @property {LH.Gatherer.FRGatherPhase} phase
  * @property {LH.Gatherer.GatherMode} gatherMode
@@ -99,7 +99,7 @@ async function collectPhaseArtifacts(options) {
 }
 
 /**
- * @param {LH.Config.AnyArtifactDefn} artifact
+ * @param {LH.Config.ArtifactDefn} artifact
  * @param {Record<string, LH.Gatherer.PhaseResult>} artifactsById
  * @return {Promise<Dependencies>}
  */

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

@@ -13,7 +13,7 @@ const {
   awaitArtifacts,
 } = require('./runner-helpers.js');
 const {initializeConfig} = require('../config/config.js');
-const {getBaseArtifacts, finalizeArtifacts} = require('./base-artifacts.js');
+const {getBaseArtifacts} = require('./base-artifacts.js');
 
 /** @param {{page: import('puppeteer').Page, config?: LH.Config.Json}} options */
 async function snapshot(options) {
@@ -44,7 +44,7 @@ async function snapshot(options) {
       });
 
       const artifacts = await awaitArtifacts(artifactState);
-      return finalizeArtifacts(baseArtifacts, artifacts);
+      return /** @type {LH.Artifacts} */ ({...baseArtifacts, ...artifacts}); // Cast to drop Partial<>
     },
     {
       url,

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

@@ -13,7 +13,7 @@ const {
   awaitArtifacts,
 } = require('./runner-helpers.js');
 const {initializeConfig} = require('../config/config.js');
-const {getBaseArtifacts, finalizeArtifacts} = require('./base-artifacts.js');
+const {getBaseArtifacts} = require('./base-artifacts.js');
 
 /**
  * @param {{page: import('puppeteer').Page, config?: LH.Config.Json}} options
@@ -56,7 +56,7 @@ async function startTimespan(options) {
           await collectPhaseArtifacts({phase: 'getArtifact', ...phaseOptions});
 
           const artifacts = await awaitArtifacts(artifactState);
-          return finalizeArtifacts(baseArtifacts, artifacts);
+          return /** @type {LH.Artifacts} */ ({...baseArtifacts, ...artifacts}); // Cast to drop Partial<>
         },
         {
           url: finalUrl,

package/lighthouse-core/gather/driver/prepare.js

@@ -127,9 +127,6 @@ async function prepareNetworkForNavigation(session, settings, navigation) {
  * @param {LH.Config.Settings} settings
  */
 async function prepareTargetForNavigationMode(driver, settings) {
-  // Enable network domain here so future calls to `emulate()` don't clear cache (#12631)
-  await driver.defaultSession.sendCommand('Network.enable');
-
   // Emulate our target device screen and user agent.
   await emulation.emulate(driver.defaultSession, settings);
 

package/lighthouse-core/gather/fetcher.js

@@ -146,6 +146,7 @@ class Fetcher {
    * @return {Promise<{stream: LH.Crdp.IO.StreamHandle|null, status: number|null}>}
    */
   async _loadNetworkResource(url) {
+    await this.session.sendCommand('Network.enable');
     const frameTreeResponse = await this.session.sendCommand('Page.getFrameTree');
     const networkResponse = await this.session.sendCommand('Network.loadNetworkResource', {
       frameId: frameTreeResponse.frameTree.frame.id,
@@ -155,6 +156,7 @@ class Fetcher {
         includeCredentials: true,
       },
     });
+    await this.session.sendCommand('Network.disable');
 
     return {
       stream: networkResponse.resource.success ? (networkResponse.resource.stream || null) : null,

package/lighthouse-core/gather/gather-runner.js

@@ -20,7 +20,6 @@ const WebAppManifest = require('./gatherers/web-app-manifest.js');
 const InstallabilityErrors = require('./gatherers/installability-errors.js');
 const NetworkUserAgent = require('./gatherers/network-user-agent.js');
 const Stacks = require('./gatherers/stacks.js');
-const {finalizeArtifacts} = require('../fraggle-rock/gather/base-artifacts.js');
 
 /** @typedef {import('../gather/driver.js')} Driver */
 /** @typedef {import('../lib/arbitrary-equality-map.js')} ArbitraryEqualityMap */
@@ -447,6 +446,18 @@ class GatherRunner {
     log.timeEnd(status);
   }
 
+  /**
+   * Finalize baseArtifacts after gathering is fully complete.
+   * @param {LH.BaseArtifacts} baseArtifacts
+   */
+  static finalizeBaseArtifacts(baseArtifacts) {
+    // Take only unique LighthouseRunWarnings.
+    baseArtifacts.LighthouseRunWarnings = Array.from(new Set(baseArtifacts.LighthouseRunWarnings));
+
+    // Take the timing entries we've gathered so far.
+    baseArtifacts.Timing = log.getTimeEntries();
+  }
+
   /**
    * @param {Array<LH.Config.Pass>} passConfigs
    * @param {{driver: Driver, requestedUrl: string, settings: LH.Config.Settings, computedCache: Map<string, ArbitraryEqualityMap>}} options
@@ -504,7 +515,8 @@ class GatherRunner {
       }
 
       await GatherRunner.disposeDriver(driver, options);
-      return finalizeArtifacts(baseArtifacts, artifacts);
+      GatherRunner.finalizeBaseArtifacts(baseArtifacts);
+      return /** @type {LH.Artifacts} */ ({...baseArtifacts, ...artifacts}); // Cast to drop Partial<>.
     } catch (err) {
       // Clean up on error. Don't await so that the root error, not a disposal error, is shown.
       GatherRunner.disposeDriver(driver, options);

package/lighthouse-core/gather/gatherers/image-elements.js

@@ -12,8 +12,9 @@
 const log = require('lighthouse-logger');
 const FRGatherer = require('../../fraggle-rock/gather/base-gatherer.js');
 const pageFunctions = require('../../lib/page-functions.js');
-const URL = require('../../lib/url-shim.js');
+const DevtoolsLog = require('./devtools-log.js');
 const FontSize = require('./seo/font-size.js');
+const NetworkRecords = require('../../computed/network-records.js');
 
 /* global window, getElementsInDocument, Image, getNodeDetails, ShadowRoot */
 
@@ -190,7 +191,7 @@ function findSizeDeclaration(rule, property) {
  *
  * @param {Array<LH.Crdp.CSS.RuleMatch>|undefined} matchedCSSRules
  * @param {string} property
- * @return {string | undefined}
+ * @returns {string | undefined}
  */
 function findMostSpecificCSSRule(matchedCSSRules, property) {
   /** @param {LH.Crdp.CSS.CSSStyle} declaration */
@@ -204,7 +205,7 @@ function findMostSpecificCSSRule(matchedCSSRules, property) {
 /**
  * @param {LH.Crdp.CSS.GetMatchedStylesForNodeResponse} matched CSS rules}
  * @param {string} property
- * @return {string | null}
+ * @returns {string | null}
  */
 function getEffectiveSizingRule({attributesStyle, inlineStyle, matchedCSSRules}, property) {
   // CSS sizing can't be inherited.
@@ -223,21 +224,11 @@ function getEffectiveSizingRule({attributesStyle, inlineStyle, matchedCSSRules},
   return null;
 }
 
-/**
- * @param {LH.Artifacts.ImageElement} element
- * @return {number}
- */
-function getPixelArea(element) {
-  if (element.naturalDimensions) {
-    return element.naturalDimensions.height * element.naturalDimensions.width;
-  }
-  return element.displayedHeight * element.displayedWidth;
-}
-
 class ImageElements extends FRGatherer {
-  /** @type {LH.Gatherer.GathererMeta} */
+  /** @type {LH.Gatherer.GathererMeta<'DevtoolsLog'>} */
   meta = {
-    supportedModes: ['snapshot', 'timespan', 'navigation'],
+    supportedModes: ['navigation'],
+    dependencies: {DevtoolsLog: DevtoolsLog.symbol},
   };
 
   constructor() {
@@ -298,19 +289,40 @@ class ImageElements extends FRGatherer {
     }
   }
 
+  /**
+   * @param {LH.Artifacts.NetworkRequest[]} networkRecords
+   */
+  indexNetworkRecords(networkRecords) {
+    return networkRecords.reduce((map, record) => {
+      // An image response in newer formats is sometimes incorrectly marked as "application/octet-stream",
+      // so respect the extension too.
+      const isImage = /^image/.test(record.mimeType) || /\.(avif|webp)$/i.test(record.url);
+      // The network record is only valid for size information if it finished with a successful status
+      // code that indicates a complete image response.
+      if (isImage && record.finished && record.statusCode === 200) {
+        map[record.url] = record;
+      }
+
+      return map;
+    }, /** @type {Record<string, LH.Artifacts.NetworkRequest>} */ ({}));
+  }
+
   /**
    *
    * @param {LH.Gatherer.FRTransitionalDriver} driver
    * @param {LH.Artifacts.ImageElement[]} elements
+   * @param {Record<string, LH.Artifacts.NetworkRequest>} indexedNetworkRecords
    */
-  async collectExtraDetails(driver, elements) {
+  async collectExtraDetails(driver, elements, indexedNetworkRecords) {
     // Don't do more than 5s of this expensive devtools protocol work. See #11289
     let reachedGatheringBudget = false;
     setTimeout(_ => (reachedGatheringBudget = true), 5000);
     let skippedCount = 0;
 
     for (const element of elements) {
-      element.mimeType = URL.guessMimeType(element.src);
+      // Pull some of our information directly off the network record.
+      const networkRecord = indexedNetworkRecords[element.src];
+      element.mimeType = networkRecord && networkRecord.mimeType;
 
       if (reachedGatheringBudget) {
         skippedCount++;
@@ -323,7 +335,8 @@ class ImageElements extends FRGatherer {
       }
       // Images within `picture` behave strangely and natural size information isn't accurate,
       // CSS images have no natural size information at all. Try to get the actual size if we can.
-      if (element.isPicture || element.isCss || element.srcset) {
+      // Additional fetch is expensive; don't bother if we don't have a networkRecord for the image.
+      if ((element.isPicture || element.isCss || element.srcset) && networkRecord) {
         await this.fetchElementWithSizeInformation(driver, element);
       }
     }
@@ -335,11 +348,13 @@ class ImageElements extends FRGatherer {
 
   /**
    * @param {LH.Gatherer.FRTransitionalContext} context
+   * @param {LH.Artifacts.NetworkRequest[]} networkRecords
    * @return {Promise<LH.Artifacts['ImageElements']>}
    */
-  async getArtifact(context) {
+  async _getArtifact(context, networkRecords) {
     const session = context.driver.defaultSession;
     const executionContext = context.driver.executionContext;
+    const indexedNetworkRecords = this.indexNetworkRecords(networkRecords);
 
     const elements = await executionContext.evaluate(collectImageElementInfo, {
       args: [],
@@ -360,11 +375,14 @@ class ImageElements extends FRGatherer {
       session.sendCommand('DOM.getDocument', {depth: -1, pierce: true}),
     ]);
 
-    // Spend our extra details budget on highest impact images.
-    // Our best approximation of impact without network records is to use pixel area.
-    elements.sort((a, b) => getPixelArea(b) - getPixelArea(a));
+    // Sort (in-place) as largest images descending.
+    elements.sort((a, b) => {
+      const aRecord = indexedNetworkRecords[a.src] || {};
+      const bRecord = indexedNetworkRecords[b.src] || {};
+      return bRecord.resourceSize - aRecord.resourceSize;
+    });
 
-    await this.collectExtraDetails(context.driver, elements);
+    await this.collectExtraDetails(context.driver, elements, indexedNetworkRecords);
 
     await Promise.all([
       session.sendCommand('DOM.disable'),
@@ -373,6 +391,25 @@ class ImageElements extends FRGatherer {
 
     return elements;
   }
+
+  /**
+   * @param {LH.Gatherer.FRTransitionalContext<'DevtoolsLog'>} context
+   * @return {Promise<LH.Artifacts['ImageElements']>}
+   */
+  async getArtifact(context) {
+    const devtoolsLog = context.dependencies.DevtoolsLog;
+    const networkRecords = await NetworkRecords.request(devtoolsLog, context);
+    return this._getArtifact(context, networkRecords);
+  }
+
+  /**
+   * @param {LH.Gatherer.PassContext} passContext
+   * @param {LH.Gatherer.LoadData} loadData
+   * @return {Promise<LH.Artifacts['ImageElements']>}
+   */
+  async afterPass(passContext, loadData) {
+    return this._getArtifact({...passContext, dependencies: {}}, loadData.networkRecords);
+  }
 }
 
 module.exports = ImageElements;

package/lighthouse-core/gather/gatherers/inspector-issues.js

@@ -112,7 +112,7 @@ class InspectorIssues extends FRGatherer {
 
   /**
    * @param {LH.Gatherer.FRTransitionalContext<'DevtoolsLog'>} context
-   * @return {Promise<LH.Artifacts['InspectorIssues']>}
+   * @returns {Promise<LH.Artifacts['InspectorIssues']>}
    */
   async getArtifact(context) {
     const devtoolsLog = context.dependencies.DevtoolsLog;
@@ -123,7 +123,7 @@ class InspectorIssues extends FRGatherer {
   /**
    * @param {LH.Gatherer.PassContext} passContext
    * @param {LH.Gatherer.LoadData} loadData
-   * @return {Promise<LH.Artifacts['InspectorIssues']>}
+   * @returns {Promise<LH.Artifacts['InspectorIssues']>}
    */
   async afterPass(passContext, loadData) {
     await this.stopInstrumentation({...passContext, dependencies: {}});

package/lighthouse-core/gather/gatherers/script-elements.js

@@ -5,14 +5,10 @@
  */
 'use strict';
 
-const FRGatherer = require('../../fraggle-rock/gather/base-gatherer.js');
-const NetworkRecords = require('../../computed/network-records.js');
+const Gatherer = require('./gatherer.js');
 const NetworkAnalyzer = require('../../lib/dependency-graph/simulator/network-analyzer.js');
 const NetworkRequest = require('../../lib/network-request.js');
 const pageFunctions = require('../../lib/page-functions.js');
-const {fetchResponseBodyFromCache} = require('../driver/network.js');
-const DevtoolsLog = require('./devtools-log.js');
-const HostFormFactor = require('./host-form-factor.js');
 
 /* global getNodeDetails */
 
@@ -66,25 +62,17 @@ async function runInSeriesOrParallel(values, promiseMapper, runInSeries) {
 /**
  * @fileoverview Gets JavaScript file contents.
  */
-class ScriptElements extends FRGatherer {
-  /** @type {LH.Gatherer.GathererMeta<'DevtoolsLog'|'HostFormFactor'>} */
-  meta = {
-    supportedModes: ['timespan', 'navigation'],
-    dependencies: {DevtoolsLog: DevtoolsLog.symbol, HostFormFactor: HostFormFactor.symbol},
-  }
-
+class ScriptElements extends Gatherer {
   /**
-   * @param {LH.Gatherer.FRTransitionalContext} context
-   * @param {LH.Artifacts.NetworkRequest[]} networkRecords
-   * @param {LH.Artifacts['HostFormFactor']} formFactor
+   * @param {LH.Gatherer.PassContext} passContext
+   * @param {LH.Gatherer.LoadData} loadData
    * @return {Promise<LH.Artifacts['ScriptElements']>}
    */
-  async _getArtifact(context, networkRecords, formFactor) {
-    const session = context.driver.defaultSession;
-    const executionContext = context.driver.executionContext;
-    const mainResource = NetworkAnalyzer.findOptionalMainDocument(networkRecords, context.url);
+  async afterPass(passContext, loadData) {
+    const driver = passContext.driver;
+    const mainResource = NetworkAnalyzer.findMainDocument(loadData.networkRecords, passContext.url);
 
-    const scripts = await executionContext.evaluate(collectAllScriptElements, {
+    const scripts = await driver.executionContext.evaluate(collectAllScriptElements, {
       args: [],
       useIsolation: true,
       deps: [
@@ -94,10 +82,10 @@ class ScriptElements extends FRGatherer {
     });
 
     for (const script of scripts) {
-      if (mainResource && script.content) script.requestId = mainResource.requestId;
+      if (script.content) script.requestId = mainResource.requestId;
     }
 
-    const scriptRecords = networkRecords
+    const scriptRecords = loadData.networkRecords
       // Ignore records from OOPIFs
       .filter(record => !record.sessionId)
       // Only get the content of script requests
@@ -107,9 +95,8 @@ class ScriptElements extends FRGatherer {
     // record at a time.
     const scriptRecordContents = await runInSeriesOrParallel(
       scriptRecords,
-      record => fetchResponseBodyFromCache(session, record.requestId).catch(() => ''),
-      formFactor === 'mobile' /* runInSeries */
-    );
+      record => driver.getRequestContent(record.requestId).catch(() => ''),
+      passContext.baseArtifacts.HostFormFactor === 'mobile' /* runInSeries*/ );
 
     for (let i = 0; i < scriptRecords.length; i++) {
       const record = scriptRecords[i];
@@ -136,26 +123,6 @@ class ScriptElements extends FRGatherer {
     }
     return scripts;
   }
-
-  /**
-   * @param {LH.Gatherer.FRTransitionalContext<'DevtoolsLog'|'HostFormFactor'>} context
-   */
-  async getArtifact(context) {
-    const devtoolsLog = context.dependencies.DevtoolsLog;
-    const formFactor = context.dependencies.HostFormFactor;
-    const networkRecords = await NetworkRecords.request(devtoolsLog, context);
-    return this._getArtifact(context, networkRecords, formFactor);
-  }
-
-  /**
-   * @param {LH.Gatherer.PassContext} passContext
-   * @param {LH.Gatherer.LoadData} loadData
-   */
-  async afterPass(passContext, loadData) {
-    const networkRecords = loadData.networkRecords;
-    const formFactor = passContext.baseArtifacts.HostFormFactor;
-    return this._getArtifact({...passContext, dependencies: {}}, networkRecords, formFactor);
-  }
 }
 
 module.exports = ScriptElements;

package/lighthouse-core/gather/gatherers/seo/font-size.js

@@ -68,7 +68,7 @@ function computeSelectorSpecificity(selector) {
  *
  * @param {Array<LH.Crdp.CSS.RuleMatch>} matchedCSSRules
  * @param {function(LH.Crdp.CSS.CSSStyle):boolean|string|undefined} isDeclarationOfInterest
- * @return {NodeFontData['cssRule']|undefined}
+ * @returns {NodeFontData['cssRule']|undefined}
  */
 function findMostSpecificMatchedCSSRule(matchedCSSRules = [], isDeclarationOfInterest) {
   let maxSpecificity = -Infinity;
@@ -105,7 +105,7 @@ function findMostSpecificMatchedCSSRule(matchedCSSRules = [], isDeclarationOfInt
  * Finds the most specific directly matched CSS font-size rule from the list.
  *
  * @param {Array<LH.Crdp.CSS.InheritedStyleEntry>} [inheritedEntries]
- * @return {NodeFontData['cssRule']|undefined}
+ * @returns {NodeFontData['cssRule']|undefined}
  */
 function findInheritedCSSRule(inheritedEntries = []) {
   // The inherited array contains the array of matched rules for all parents in ascending tree order.
@@ -126,7 +126,7 @@ function findInheritedCSSRule(inheritedEntries = []) {
  *
  * @see https://cs.chromium.org/chromium/src/third_party/blink/renderer/devtools/front_end/sdk/CSSMatchedStyles.js?q=CSSMatchedStyles+f:devtools+-f:out&sq=package:chromium&dr=C&l=59-134
  * @param {LH.Crdp.CSS.GetMatchedStylesForNodeResponse} matched CSS rules
- * @return {NodeFontData['cssRule']|undefined}
+ * @returns {NodeFontData['cssRule']|undefined}
  */
 function getEffectiveFontRule({attributesStyle, inlineStyle, matchedCSSRules, inherited}) {
   // Inline styles have highest priority
@@ -148,7 +148,7 @@ function getEffectiveFontRule({attributesStyle, inlineStyle, matchedCSSRules, in
 
 /**
  * @param {string} text
- * @return {number}
+ * @returns {number}
  */
 function getTextLength(text) {
   // Array.from to count symbols not unicode code points. See: #6973
@@ -158,7 +158,7 @@ function getTextLength(text) {
 /**
  * @param {LH.Gatherer.FRProtocolSession} session
  * @param {number} nodeId text node
- * @return {Promise<NodeFontData['cssRule']|undefined>}
+ * @returns {Promise<NodeFontData['cssRule']|undefined>}
  */
 async function fetchSourceRule(session, nodeId) {
   const matchedRules = await session.sendCommand('CSS.getMatchedStylesForNode', {