lighthouse 9.5.0-dev.20230111 → 9.5.0-dev.20230113

package/core/legacy/config/config.js

@@ -79,7 +79,7 @@ function assertValidPasses(passes, audits) {
       const gatherer = gathererDefn.instance;
       foundGatherers.add(gatherer.name);
       const isGatherRequiredByAudits = requestedGatherers.has(gatherer.name);
-      if (!isGatherRequiredByAudits) {
+      if (!isGatherRequiredByAudits && gatherer.name !== 'FullPageScreenshot') {
         const msg = `${gatherer.name} gatherer requested, however no audit requires it.`;
         log.warn('config', msg);
       }
@@ -135,17 +135,17 @@ class LegacyResolvedConfig {
   /**
    * Resolves the provided config (inherits from extended config, if set), resolves
    * all referenced modules, and validates.
-   * @param {LH.Config.Json=} configJSON If not provided, uses the default config.
+   * @param {LH.Config=} config If not provided, uses the default config.
    * @param {LH.Flags=} flags
    * @return {Promise<LegacyResolvedConfig>}
    */
-  static async fromJson(configJSON, flags) {
+  static async fromJson(config, flags) {
     const status = {msg: 'Create config', id: 'lh:init:config'};
     log.time(status, 'verbose');
     let configPath = flags?.configPath;
 
-    if (!configJSON) {
-      configJSON = legacyDefaultConfig;
+    if (!config) {
+      config = legacyDefaultConfig;
       configPath = path.resolve(getModuleDirectory(import.meta), defaultConfigPath);
     }
 
@@ -154,33 +154,33 @@ class LegacyResolvedConfig {
     }
 
     // We don't want to mutate the original config object
-    configJSON = deepCloneConfigJson(configJSON);
+    config = deepCloneConfigJson(config);
 
     // Extend the default config if specified
-    if (configJSON.extends) {
-      if (configJSON.extends !== 'lighthouse:default') {
+    if (config.extends) {
+      if (config.extends !== 'lighthouse:default') {
         throw new Error('`lighthouse:default` is the only valid extension method.');
       }
-      configJSON = LegacyResolvedConfig.extendConfigJSON(
-        deepCloneConfigJson(legacyDefaultConfig), configJSON);
+      config = LegacyResolvedConfig.extendConfigJSON(
+        deepCloneConfigJson(legacyDefaultConfig), config);
     }
 
     // The directory of the config path, if one was provided.
     const configDir = configPath ? path.dirname(configPath) : undefined;
 
     // Validate and merge in plugins (if any).
-    configJSON = await mergePlugins(configJSON, configDir, flags);
+    config = await mergePlugins(config, configDir, flags);
 
-    const settings = resolveSettings(configJSON.settings || {}, flags);
+    const settings = resolveSettings(config.settings || {}, flags);
 
     // Augment passes with necessary defaults and require gatherers.
-    const passesWithDefaults = LegacyResolvedConfig.augmentPassesWithDefaults(configJSON.passes);
+    const passesWithDefaults = LegacyResolvedConfig.augmentPassesWithDefaults(config.passes);
     LegacyResolvedConfig.adjustDefaultPassForThrottling(settings, passesWithDefaults);
     const passes = await LegacyResolvedConfig.requireGatherers(passesWithDefaults, configDir);
 
-    const audits = await LegacyResolvedConfig.requireAudits(configJSON.audits, configDir);
+    const audits = await LegacyResolvedConfig.requireAudits(config.audits, configDir);
 
-    const resolvedConfig = new LegacyResolvedConfig(configJSON, {settings, passes, audits});
+    const resolvedConfig = new LegacyResolvedConfig(config, {settings, passes, audits});
     log.timeEnd(status);
     return resolvedConfig;
   }
@@ -188,10 +188,10 @@ class LegacyResolvedConfig {
   /**
    * @deprecated `Config.fromJson` should be used instead.
    * @constructor
-   * @param {LH.Config.Json} configJSON
+   * @param {LH.Config} config
    * @param {{settings: LH.Config.Settings, passes: ?LH.Config.Pass[], audits: ?LH.Config.AuditDefn[]}} opts
    */
-  constructor(configJSON, opts) {
+  constructor(config, opts) {
     /** @type {LH.Config.Settings} */
     this.settings = opts.settings;
     /** @type {?Array<LH.Config.Pass>} */
@@ -199,9 +199,9 @@ class LegacyResolvedConfig {
     /** @type {?Array<LH.Config.AuditDefn>} */
     this.audits = opts.audits;
     /** @type {?Record<string, LH.Config.Category>} */
-    this.categories = configJSON.categories || null;
+    this.categories = config.categories || null;
     /** @type {?Record<string, LH.Config.Group>} */
-    this.groups = configJSON.groups || null;
+    this.groups = config.groups || null;
 
     LegacyResolvedConfig.filterConfigIfNeeded(this);
 
@@ -245,9 +245,9 @@ class LegacyResolvedConfig {
   }
 
   /**
-   * @param {LH.Config.Json} baseJSON The JSON of the configuration to extend
-   * @param {LH.Config.Json} extendJSON The JSON of the extensions
-   * @return {LH.Config.Json}
+   * @param {LH.Config} baseJSON The JSON of the configuration to extend
+   * @param {LH.Config} extendJSON The JSON of the extensions
+   * @return {LH.Config}
    */
   static extendConfigJSON(baseJSON, extendJSON) {
     if (extendJSON.passes && baseJSON.passes) {
@@ -270,7 +270,7 @@ class LegacyResolvedConfig {
   }
 
   /**
-   * @param {LH.Config.Json['passes']} passes
+   * @param {LH.Config['passes']} passes
    * @return {?Array<Required<LH.Config.PassJson>>}
    */
   static augmentPassesWithDefaults(passes) {
@@ -313,7 +313,8 @@ class LegacyResolvedConfig {
    */
   static filterConfigIfNeeded(config) {
     const settings = config.settings;
-    if (!settings.onlyCategories && !settings.onlyAudits && !settings.skipAudits) {
+    // eslint-disable-next-line max-len
+    if (!settings.onlyCategories && !settings.onlyAudits && !settings.skipAudits && !settings.disableFullPageScreenshot) {
       return;
     }
 
@@ -328,6 +329,11 @@ class LegacyResolvedConfig {
     // 3. Resolve which gatherers will need to run
     const requestedGathererIds = LegacyResolvedConfig.getGatherersRequestedByAudits(audits);
 
+    // Always include FullPageScreenshot, unless explictly told not to.
+    if (!settings.disableFullPageScreenshot) {
+      requestedGathererIds.add('FullPageScreenshot');
+    }
+
     // 4. Filter to only the neccessary passes
     const passes =
       LegacyResolvedConfig.generatePassesNeededByGatherers(config.passes, requestedGathererIds);
@@ -413,14 +419,6 @@ class LegacyResolvedConfig {
       }
     });
 
-    // The `full-page-screenshot` audit belongs to no category, but we still want to include
-    // it (unless explictly excluded) because there are audits in every category that can use it.
-    const explicitlyExcludesFullPageScreenshot =
-      settings.skipAudits && settings.skipAudits.includes('full-page-screenshot');
-    if (!explicitlyExcludesFullPageScreenshot && (settings.onlyCategories || settings.skipAudits)) {
-      includedAudits.add('full-page-screenshot');
-    }
-
     return {categories, requestedAuditNames: includedAudits};
   }
 
@@ -488,7 +486,7 @@ class LegacyResolvedConfig {
    * Take an array of audits and audit paths and require any paths (possibly
    * relative to the optional `configDir`) using `resolveModulePath`,
    * leaving only an array of AuditDefns.
-   * @param {LH.Config.Json['audits']} audits
+   * @param {LH.Config['audits']} audits
    * @param {string=} configDir
    * @return {Promise<LegacyResolvedConfig['audits']>}
    */

package/core/legacy/config/legacy-default-config.js

@@ -10,7 +10,7 @@
 
 import defaultConfig from '../../config/default-config.js';
 
-/** @type {LH.Config.Json} */
+/** @type {LH.Config} */
 const legacyDefaultConfig = JSON.parse(JSON.stringify(defaultConfig));
 if (!legacyDefaultConfig.categories) {
   throw new Error('Default config should always have categories');

package/core/legacy/gather/driver.js

@@ -405,23 +405,6 @@ class Driver {
     return fetchResponseBodyFromCache(this.defaultSession, requestId, timeout);
   }
 
-  /**
-   * @param {{x: number, y: number}} position
-   * @return {Promise<void>}
-   */
-  scrollTo(position) {
-    const scrollExpression = `window.scrollTo(${position.x}, ${position.y})`;
-    return this.executionContext.evaluateAsync(scrollExpression, {useIsolation: true});
-  }
-
-  /**
-   * @return {Promise<{x: number, y: number}>}
-   */
-  getScrollPosition() {
-    return this.executionContext.evaluateAsync(`({x: window.scrollX, y: window.scrollY})`,
-      {useIsolation: true});
-  }
-
   /**
    * @param {{additionalTraceCategories?: string|null}=} settings
    * @return {Promise<void>}

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

@@ -313,17 +313,12 @@ class GatherRunner {
    * @return {Promise<void>}
    */
   static async afterPass(passContext, loadData, gathererResults) {
-    const driver = passContext.driver;
     const config = passContext.passConfig;
     const gatherers = config.gatherers;
 
     const apStatus = {msg: `Running afterPass methods`, id: `lh:gather:afterPass`};
     log.time(apStatus, 'verbose');
 
-    // Some gatherers scroll the page which can cause unexpected results for other gatherers.
-    // We reset the scroll position in between each gatherer.
-    const scrollPosition = await driver.getScrollPosition();
-
     for (const gathererDefn of gatherers) {
       const gatherer = gathererDefn.instance;
       const status = {
@@ -339,7 +334,6 @@ class GatherRunner {
       gathererResult.push(artifactPromise);
       gathererResults[gatherer.name] = gathererResult;
       await artifactPromise.catch(() => {});
-      await driver.scrollTo(scrollPosition);
       log.timeEnd(status);
     }
     log.timeEnd(apStatus);

package/core/runner.js

@@ -110,6 +110,8 @@ class Runner {
         categories,
         categoryGroups: resolvedConfig.groups || undefined,
         stackPacks: stackPacks.getStackPacks(artifacts.Stacks),
+        fullPageScreenshot: resolvedConfig.settings.disableFullPageScreenshot ?
+          undefined : artifacts.FullPageScreenshot,
         timing: this._getTiming(artifacts),
         i18n: {
           rendererFormattedStrings: format.getRendererFormattedStrings(settings.locale),

package/core/user-flow.js

@@ -308,7 +308,7 @@ function getFlowName(name, gatherSteps) {
 
 /**
  * @param {Array<LH.UserFlow.GatherStep>} gatherSteps
- * @param {{name?: string, config?: LH.Config.Json, gatherStepRunnerOptions?: GatherStepRunnerOptions}} options
+ * @param {{name?: string, config?: LH.Config, gatherStepRunnerOptions?: GatherStepRunnerOptions}} options
  */
 async function auditGatherSteps(gatherSteps, options) {
   if (!gatherSteps.length) {
@@ -326,9 +326,9 @@ async function auditGatherSteps(gatherSteps, options) {
     // If the gather step is not active, we must recreate the runner options.
     if (!runnerOptions) {
       // Step specific configs take precedence over a config for the entire flow.
-      const configJson = options.config;
+      const config = options.config;
       const {gatherMode} = artifacts.GatherContext;
-      const {resolvedConfig} = await initializeConfig(gatherMode, configJson, flags);
+      const {resolvedConfig} = await initializeConfig(gatherMode, config, flags);
       runnerOptions = {
         resolvedConfig,
         computedCache: new Map(),

package/core/util.cjs

@@ -216,9 +216,39 @@ class Util {
       });
     }
 
+    // In 10.0, full-page-screenshot became a top-level property on the LHR.
+    if (clone.audits['full-page-screenshot']) {
+      const details = /** @type {LH.Result.FullPageScreenshot=} */ (
+        clone.audits['full-page-screenshot'].details);
+      if (details) {
+        clone.fullPageScreenshot = {
+          screenshot: details.screenshot,
+          nodes: details.nodes,
+        };
+      } else {
+        clone.fullPageScreenshot = null;
+      }
+      delete clone.audits['full-page-screenshot'];
+    }
+
     return clone;
   }
 
+  /**
+   * @param {LH.Result} lhr
+   * @return {LH.Result.FullPageScreenshot=}
+   */
+  static getFullPageScreenshot(lhr) {
+    if (lhr.fullPageScreenshot) {
+      return lhr.fullPageScreenshot;
+    }
+
+    // Prior to 10.0.
+    const details = /** @type {LH.Result.FullPageScreenshot=} */ (
+      lhr.audits['full-page-screenshot']?.details);
+    return details;
+  }
+
   /**
    * Used to determine if the "passed" for the purposes of showing up in the "failed" or "passed"
    * sections of the report.
@@ -516,14 +546,24 @@ class Util {
         summary = cpuThrottling = networkThrottling = Util.i18n.strings.runtimeUnknown;
     }
 
+    // devtools-entry.js always sets `screenEmulation.disabled` when using mobile emulation,
+    // because we handle the emulation outside of Lighthouse. Since the screen truly is emulated
+    // as a mobile device, ignore `.disabled` in devtools and just check the form factor
+    const isScreenEmulationDisabled = settings.channel === 'devtools' ?
+      false :
+      settings.screenEmulation.disabled;
+    const isScreenEmulationMobile = settings.channel === 'devtools' ?
+      settings.formFactor === 'mobile' :
+      settings.screenEmulation.mobile;
+
     let deviceEmulation = Util.i18n.strings.runtimeMobileEmulation;
-    if (settings.screenEmulation.disabled) {
+    if (isScreenEmulationDisabled) {
       deviceEmulation = Util.i18n.strings.runtimeNoEmulation;
-    } else if (!settings.screenEmulation.mobile) {
+    } else if (!isScreenEmulationMobile) {
       deviceEmulation = Util.i18n.strings.runtimeDesktopEmulation;
     }
 
-    const screenEmulation = settings.screenEmulation.disabled ?
+    const screenEmulation = isScreenEmulationDisabled ?
       undefined :
       // eslint-disable-next-line max-len
       `${settings.screenEmulation.width}x${settings.screenEmulation.height}, DPR ${settings.screenEmulation.deviceScaleFactor}`;

package/dist/report/bundle.esm.js

@@ -212,9 +212,39 @@ class Util {
       });
     }
 
+    // In 10.0, full-page-screenshot became a top-level property on the LHR.
+    if (clone.audits['full-page-screenshot']) {
+      const details = /** @type {LH.Result.FullPageScreenshot=} */ (
+        clone.audits['full-page-screenshot'].details);
+      if (details) {
+        clone.fullPageScreenshot = {
+          screenshot: details.screenshot,
+          nodes: details.nodes,
+        };
+      } else {
+        clone.fullPageScreenshot = null;
+      }
+      delete clone.audits['full-page-screenshot'];
+    }
+
     return clone;
   }
 
+  /**
+   * @param {LH.Result} lhr
+   * @return {LH.Result.FullPageScreenshot=}
+   */
+  static getFullPageScreenshot(lhr) {
+    if (lhr.fullPageScreenshot) {
+      return lhr.fullPageScreenshot;
+    }
+
+    // Prior to 10.0.
+    const details = /** @type {LH.Result.FullPageScreenshot=} */ (
+      lhr.audits['full-page-screenshot']?.details);
+    return details;
+  }
+
   /**
    * Used to determine if the "passed" for the purposes of showing up in the "failed" or "passed"
    * sections of the report.
@@ -512,14 +542,24 @@ class Util {
         summary = cpuThrottling = networkThrottling = Util.i18n.strings.runtimeUnknown;
     }
 
+    // devtools-entry.js always sets `screenEmulation.disabled` when using mobile emulation,
+    // because we handle the emulation outside of Lighthouse. Since the screen truly is emulated
+    // as a mobile device, ignore `.disabled` in devtools and just check the form factor
+    const isScreenEmulationDisabled = settings.channel === 'devtools' ?
+      false :
+      settings.screenEmulation.disabled;
+    const isScreenEmulationMobile = settings.channel === 'devtools' ?
+      settings.formFactor === 'mobile' :
+      settings.screenEmulation.mobile;
+
     let deviceEmulation = Util.i18n.strings.runtimeMobileEmulation;
-    if (settings.screenEmulation.disabled) {
+    if (isScreenEmulationDisabled) {
       deviceEmulation = Util.i18n.strings.runtimeNoEmulation;
-    } else if (!settings.screenEmulation.mobile) {
+    } else if (!isScreenEmulationMobile) {
       deviceEmulation = Util.i18n.strings.runtimeDesktopEmulation;
     }
 
-    const screenEmulation = settings.screenEmulation.disabled ?
+    const screenEmulation = isScreenEmulationDisabled ?
       undefined :
       // eslint-disable-next-line max-len
       `${settings.screenEmulation.width}x${settings.screenEmulation.height}, DPR ${settings.screenEmulation.deviceScaleFactor}`;
@@ -2626,7 +2666,7 @@ const CRCRenderer = CriticalRequestChainRenderer;
  */
 
 /**
- * @param {LH.Audit.Details.FullPageScreenshot['screenshot']} screenshot
+ * @param {LH.Result.FullPageScreenshot['screenshot']} screenshot
  * @param {LH.Audit.Details.Rect} rect
  * @return {boolean}
  */
@@ -2732,7 +2772,7 @@ class ElementScreenshotRenderer {
    * Allows for multiple Lighthouse reports to be rendered on the page, each with their
    * own full page screenshot.
    * @param {HTMLElement} el
-   * @param {LH.Audit.Details.FullPageScreenshot['screenshot']} screenshot
+   * @param {LH.Result.FullPageScreenshot['screenshot']} screenshot
    */
   static installFullPageScreenshot(el, screenshot) {
     el.style.setProperty('--element-screenshot-url', `url('${screenshot.data}')`);
@@ -2814,7 +2854,7 @@ class ElementScreenshotRenderer {
    * Used to render both the thumbnail preview in details tables and the full-page screenshot in the lightbox.
    * Returns null if element rect is outside screenshot bounds.
    * @param {DOM} dom
-   * @param {LH.Audit.Details.FullPageScreenshot['screenshot']} screenshot
+   * @param {LH.Result.FullPageScreenshot['screenshot']} screenshot
    * @param {Rect} elementRectSC Region of screenshot to highlight.
    * @param {Size} maxRenderSizeDC e.g. maxThumbnailSize or maxLightboxSize.
    * @return {Element|null}
@@ -2909,7 +2949,7 @@ const URL_PREFIXES = ['http://', 'https://', 'data:'];
 class DetailsRenderer {
   /**
    * @param {DOM} dom
-   * @param {{fullPageScreenshot?: LH.Audit.Details.FullPageScreenshot}} [options]
+   * @param {{fullPageScreenshot?: LH.Result.FullPageScreenshot}} [options]
    */
   constructor(dom, options = {}) {
     this._dom = dom;
@@ -2935,7 +2975,6 @@ class DetailsRenderer {
       // Internal-only details, not for rendering.
       case 'screenshot':
       case 'debugdata':
-      case 'full-page-screenshot':
       case 'treemap-data':
         return null;
 
@@ -4519,12 +4558,8 @@ class ReportRenderer {
     Util.i18n = i18n;
     Util.reportJson = report;
 
-    const fullPageScreenshot =
-      report.audits['full-page-screenshot']?.details &&
-      report.audits['full-page-screenshot'].details.type === 'full-page-screenshot' ?
-      report.audits['full-page-screenshot'].details : undefined;
     const detailsRenderer = new DetailsRenderer(this._dom, {
-      fullPageScreenshot,
+      fullPageScreenshot: report.fullPageScreenshot ?? undefined,
     });
 
     const categoryRenderer = new CategoryRenderer(this._dom, detailsRenderer);
@@ -4595,9 +4630,9 @@ class ReportRenderer {
     reportSection.append(this._renderReportFooter(report));
     reportContainer.append(headerContainer, reportSection);
 
-    if (fullPageScreenshot) {
+    if (report.fullPageScreenshot) {
       ElementScreenshotRenderer.installFullPageScreenshot(
-        this._dom.rootEl, fullPageScreenshot.screenshot);
+        this._dom.rootEl, report.fullPageScreenshot.screenshot);
     }
 
     return reportFragment;
@@ -5456,6 +5491,7 @@ class ReportUIFeatures {
    */
   initFeatures(lhr) {
     this.json = lhr;
+    this._fullPageScreenshot = Util.getFullPageScreenshot(lhr);
 
     if (this._topbar) {
       this._topbar.enable(lhr);
@@ -5695,18 +5731,13 @@ class ReportUIFeatures {
    * @param {Element} rootEl
    */
   _setupElementScreenshotOverlay(rootEl) {
-    const fullPageScreenshot =
-      this.json.audits['full-page-screenshot'] &&
-      this.json.audits['full-page-screenshot'].details &&
-      this.json.audits['full-page-screenshot'].details.type === 'full-page-screenshot' &&
-      this.json.audits['full-page-screenshot'].details;
-    if (!fullPageScreenshot) return;
+    if (!this._fullPageScreenshot) return;
 
     ElementScreenshotRenderer.installOverlayFeature({
       dom: this._dom,
       rootEl: rootEl,
       overlayContainerEl: rootEl,
-      fullPageScreenshot,
+      fullPageScreenshot: this._fullPageScreenshot,
     });
   }