lighthouse 9.5.0-dev.20230206 → 9.5.0-dev.20230208

package/core/audits/audit.d.ts

@@ -1,3 +1,11 @@
+export type TableOptions = {
+    wastedMs?: number | undefined;
+    wastedBytes?: number | undefined;
+};
+export type OpportunityOptions = {
+    overallSavingsMs: number;
+    overallSavingsBytes?: number | undefined;
+};
 export class Audit {
     /**
      * @return {string}
@@ -55,10 +63,10 @@ export class Audit {
     /**
      * @param {LH.Audit.Details.Table['headings']} headings
      * @param {LH.Audit.Details.Table['items']} results
-     * @param {LH.Audit.Details.Table['summary']=} summary
+     * @param {TableOptions=} options
      * @return {LH.Audit.Details.Table}
      */
-    static makeTableDetails(headings: LH.Audit.Details.Table['headings'], results: LH.Audit.Details.Table['items'], summary?: LH.Audit.Details.Table['summary'] | undefined): LH.Audit.Details.Table;
+    static makeTableDetails(headings: LH.Audit.Details.Table['headings'], results: LH.Audit.Details.Table['items'], options?: TableOptions | undefined): LH.Audit.Details.Table;
     /**
      * @param {LH.Audit.Details.List['items']} items
      * @return {LH.Audit.Details.List}
@@ -95,11 +103,10 @@ export class Audit {
     /**
      * @param {LH.Audit.Details.Opportunity['headings']} headings
      * @param {LH.Audit.Details.Opportunity['items']} items
-     * @param {number} overallSavingsMs
-     * @param {number=} overallSavingsBytes
+     * @param {OpportunityOptions} options
      * @return {LH.Audit.Details.Opportunity}
      */
-    static makeOpportunityDetails(headings: LH.Audit.Details.Opportunity['headings'], items: LH.Audit.Details.Opportunity['items'], overallSavingsMs: number, overallSavingsBytes?: number | undefined): LH.Audit.Details.Opportunity;
+    static makeOpportunityDetails(headings: LH.Audit.Details.Opportunity['headings'], items: LH.Audit.Details.Opportunity['items'], options: OpportunityOptions): LH.Audit.Details.Opportunity;
     /**
      * @param {LH.Artifacts.NodeDetails} node
      * @return {LH.Audit.Details.NodeValue}

package/core/audits/audit.js

@@ -11,6 +11,18 @@ import {Util} from '../../shared/util.js';
 
 const DEFAULT_PASS = 'defaultPass';
 
+/**
+ * @typedef TableOptions
+ * @property {number=} wastedMs
+ * @property {number=} wastedBytes
+ */
+
+/**
+ * @typedef OpportunityOptions
+ * @property {number} overallSavingsMs
+ * @property {number=} overallSavingsBytes
+ */
+
 /**
  * Clamp figure to 2 decimal places
  * @param {number} val
@@ -123,10 +135,12 @@ class Audit {
   /**
    * @param {LH.Audit.Details.Table['headings']} headings
    * @param {LH.Audit.Details.Table['items']} results
-   * @param {LH.Audit.Details.Table['summary']=} summary
+   * @param {TableOptions=} options
    * @return {LH.Audit.Details.Table}
    */
-  static makeTableDetails(headings, results, summary) {
+  static makeTableDetails(headings, results, options = {}) {
+    const {wastedBytes, wastedMs} = options;
+    const summary = (wastedBytes || wastedMs) ? {wastedBytes, wastedMs} : undefined;
     if (results.length === 0) {
       return {
         type: 'table',
@@ -215,12 +229,12 @@ class Audit {
   /**
    * @param {LH.Audit.Details.Opportunity['headings']} headings
    * @param {LH.Audit.Details.Opportunity['items']} items
-   * @param {number} overallSavingsMs
-   * @param {number=} overallSavingsBytes
+   * @param {OpportunityOptions} options
    * @return {LH.Audit.Details.Opportunity}
    */
-  static makeOpportunityDetails(headings, items, overallSavingsMs, overallSavingsBytes) {
+  static makeOpportunityDetails(headings, items, options) {
     Audit.assertHeadingKeysExist(headings, items);
+    const {overallSavingsMs, overallSavingsBytes} = options;
 
     return {
       type: 'opportunity',

package/core/audits/byte-efficiency/byte-efficiency-audit.js

@@ -228,7 +228,8 @@ class ByteEfficiencyAudit extends Audit {
       displayValue = str_(i18n.UIStrings.displayValueByteSavings, {wastedBytes});
     }
 
-    const details = Audit.makeOpportunityDetails(result.headings, results, wastedMs, wastedBytes);
+    const details = Audit.makeOpportunityDetails(result.headings, results,
+      {overallSavingsMs: wastedMs, overallSavingsBytes: wastedBytes});
 
     return {
       explanation: result.explanation,

package/core/audits/byte-efficiency/render-blocking-resources.js

@@ -290,7 +290,8 @@ class RenderBlockingResources extends Audit {
       {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
     ];
 
-    const details = Audit.makeOpportunityDetails(headings, results, wastedMs);
+    const details = Audit.makeOpportunityDetails(headings, results,
+      {overallSavingsMs: wastedMs});
 
     return {
       displayValue,

package/core/audits/dobetterweb/js-libraries.js

@@ -57,7 +57,7 @@ class JsLibrariesAudit extends Audit {
       {key: 'name', valueType: 'text', label: str_(i18n.UIStrings.columnName)},
       {key: 'version', valueType: 'text', label: str_(UIStrings.columnVersion)},
     ];
-    const details = Audit.makeTableDetails(headings, libDetails, {});
+    const details = Audit.makeTableDetails(headings, libDetails);
 
     const debugData = {
       type: /** @type {const} */ ('debugdata'),

package/core/audits/dobetterweb/uses-http2.js

@@ -247,7 +247,8 @@ class UsesHTTP2Audit extends Audit {
       {key: 'protocol', valueType: 'text', label: str_(UIStrings.columnProtocol)},
     ];
 
-    const details = Audit.makeOpportunityDetails(headings, resources, wastedMs);
+    const details = Audit.makeOpportunityDetails(headings, resources,
+      {overallSavingsMs: wastedMs});
 
     return {
       displayValue,

package/core/audits/{preload-lcp-image.d.ts → prioritize-lcp-image.d.ts}

@@ -1,4 +1,4 @@
-export default PreloadLCPImageAudit;
+export default PrioritizeLcpImage;
 export type InitiatorPath = Array<{
     url: string;
     initiatorType: string;
@@ -6,7 +6,7 @@ export type InitiatorPath = Array<{
 /**
  * @typedef {Array<{url: string, initiatorType: string}>} InitiatorPath
  */
-declare class PreloadLCPImageAudit extends Audit {
+declare class PrioritizeLcpImage extends Audit {
     /**
      *
      * @param {LH.Artifacts.NetworkRequest} request
@@ -73,4 +73,4 @@ export namespace UIStrings {
 import { Audit } from "./audit.js";
 import { NetworkRequest } from "../lib/network-request.js";
 import { ProcessedNavigation } from "../computed/processed-navigation.js";
-//# sourceMappingURL=preload-lcp-image.d.ts.map
+//# sourceMappingURL=prioritize-lcp-image.d.ts.map

package/core/audits/{preload-lcp-image.js → prioritize-lcp-image.js}

@@ -27,13 +27,13 @@ const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
  * @typedef {Array<{url: string, initiatorType: string}>} InitiatorPath
  */
 
-class PreloadLCPImageAudit extends Audit {
+class PrioritizeLcpImage extends Audit {
   /**
    * @return {LH.Audit.Meta}
    */
   static get meta() {
     return {
-      id: 'preload-lcp-image',
+      id: 'prioritize-lcp-image',
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
       supportedModes: ['navigation'],
@@ -92,11 +92,11 @@ class PreloadLCPImageAudit extends Audit {
    */
   static getLCPNodeToPreload(mainResource, graph, lcpUrl) {
     if (!lcpUrl) return {};
-    const {lcpNode, path} = PreloadLCPImageAudit.findLCPNode(graph, lcpUrl);
+    const {lcpNode, path} = PrioritizeLcpImage.findLCPNode(graph, lcpUrl);
     if (!lcpNode || !path) return {};
 
     // eslint-disable-next-line max-len
-    const shouldPreload = PreloadLCPImageAudit.shouldPreloadRequest(lcpNode.record, mainResource, path);
+    const shouldPreload = PrioritizeLcpImage.shouldPreloadRequest(lcpNode.record, mainResource, path);
     const lcpNodeToPreload = shouldPreload ? lcpNode : undefined;
 
     const initiatorPath = [
@@ -119,7 +119,8 @@ class PreloadLCPImageAudit extends Audit {
    * @return {string | undefined}
    */
   static getLcpUrl(trace, processedNavigation) {
-    const lcpEvent = processedNavigation.largestContentfulPaintAllFramesEvt;
+    // Use main-frame-only LCP to match the metric value.
+    const lcpEvent = processedNavigation.largestContentfulPaintEvt;
     if (!lcpEvent) return;
 
     const lcpImagePaintEvent = trace.traceEvents.filter(e => {
@@ -229,8 +230,8 @@ class PreloadLCPImageAudit extends Audit {
    */
   static async audit(artifacts, context) {
     const gatherContext = artifacts.GatherContext;
-    const trace = artifacts.traces[PreloadLCPImageAudit.DEFAULT_PASS];
-    const devtoolsLog = artifacts.devtoolsLogs[PreloadLCPImageAudit.DEFAULT_PASS];
+    const trace = artifacts.traces[PrioritizeLcpImage.DEFAULT_PASS];
+    const devtoolsLog = artifacts.devtoolsLogs[PrioritizeLcpImage.DEFAULT_PASS];
     const URL = artifacts.URL;
     const metricData = {trace, devtoolsLog, gatherContext, settings: context.settings, URL};
     const lcpElement = artifacts.TraceElements
@@ -247,13 +248,13 @@ class PreloadLCPImageAudit extends Audit {
       LoadSimulator.request({devtoolsLog, settings: context.settings}, context),
     ]);
 
-    const lcpUrl = PreloadLCPImageAudit.getLcpUrl(trace, processedNavigation);
+    const lcpUrl = PrioritizeLcpImage.getLcpUrl(trace, processedNavigation);
     const graph = lanternLCP.pessimisticGraph;
     // eslint-disable-next-line max-len
-    const {lcpNodeToPreload, initiatorPath} = PreloadLCPImageAudit.getLCPNodeToPreload(mainResource, graph, lcpUrl);
+    const {lcpNodeToPreload, initiatorPath} = PrioritizeLcpImage.getLCPNodeToPreload(mainResource, graph, lcpUrl);
 
     const {results, wastedMs} =
-      PreloadLCPImageAudit.computeWasteWithGraph(lcpElement, lcpNodeToPreload, graph, simulator);
+      PrioritizeLcpImage.computeWasteWithGraph(lcpElement, lcpNodeToPreload, graph, simulator);
 
     /** @type {LH.Audit.Details.Opportunity['headings']} */
     const headings = [
@@ -261,7 +262,8 @@ class PreloadLCPImageAudit extends Audit {
       {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
       {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
     ];
-    const details = Audit.makeOpportunityDetails(headings, results, wastedMs);
+    const details = Audit.makeOpportunityDetails(headings, results,
+      {overallSavingsMs: wastedMs});
 
     // If LCP element was an image and had valid network records (regardless of
     // if it should be preloaded), it will be found first in the `initiatorPath`.
@@ -284,5 +286,5 @@ class PreloadLCPImageAudit extends Audit {
   }
 }
 
-export default PreloadLCPImageAudit;
+export default PrioritizeLcpImage;
 export {UIStrings};

package/core/audits/redirects.js

@@ -142,7 +142,8 @@ class Redirects extends Audit {
       {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
       {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnTimeSpent)},
     ];
-    const details = Audit.makeOpportunityDetails(headings, tableRows, totalWastedMs);
+    const details = Audit.makeOpportunityDetails(headings, tableRows,
+      {overallSavingsMs: totalWastedMs});
 
     return {
       // We award a passing grade if you only have 1 redirect

package/core/audits/seo/link-text.js

@@ -141,7 +141,7 @@ class LinkText extends Audit {
       {key: 'text', valueType: 'text', label: 'Link Text'},
     ];
 
-    const details = Audit.makeTableDetails(headings, failingLinks, {});
+    const details = Audit.makeTableDetails(headings, failingLinks);
     let displayValue;
 
     if (failingLinks.length) {

package/core/audits/seo/robots-txt.js

@@ -235,7 +235,7 @@ class RobotsTxt extends Audit {
       {key: 'message', valueType: 'code', label: 'Error'},
     ];
 
-    const details = Audit.makeTableDetails(headings, validationErrors, {});
+    const details = Audit.makeTableDetails(headings, validationErrors);
     let displayValue;
 
     if (validationErrors.length) {

package/core/audits/server-response-time.js

@@ -73,7 +73,7 @@ class ServerResponseTime extends Audit {
     const details = Audit.makeOpportunityDetails(
       headings,
       [{url: mainResource.url, responseTime}],
-      responseTime - TARGET_MS
+      {overallSavingsMs: responseTime - TARGET_MS}
     );
 
     return {

package/core/audits/uses-rel-preconnect.js

@@ -233,7 +233,8 @@ class UsesRelPreconnectAudit extends Audit {
       {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
     ];
 
-    const details = Audit.makeOpportunityDetails(headings, results, maxWasted);
+    const details = Audit.makeOpportunityDetails(headings, results,
+      {overallSavingsMs: maxWasted});
 
     return {
       score: ByteEfficiencyAudit.scoreForWastedMs(maxWasted),

package/core/audits/uses-rel-preload.js

@@ -239,7 +239,8 @@ class UsesRelPreloadAudit extends Audit {
       {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
       {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
     ];
-    const details = Audit.makeOpportunityDetails(headings, results, wastedMs);
+    const details = Audit.makeOpportunityDetails(headings, results,
+      {overallSavingsMs: wastedMs});
 
     return {
       score: ByteEfficiencyAudit.scoreForWastedMs(wastedMs),
@@ -259,7 +260,8 @@ class UsesRelPreloadAudit extends Audit {
   static async audit() {
     // Preload advice is on hold until https://github.com/GoogleChrome/lighthouse/issues/11960
     // is resolved.
-    return {score: 1, notApplicable: true, details: Audit.makeOpportunityDetails([], [], 0)};
+    return {score: 1, notApplicable: true,
+      details: Audit.makeOpportunityDetails([], [], {overallSavingsMs: 0})};
   }
 }
 

package/core/audits/valid-source-maps.js

@@ -7,6 +7,8 @@
 import {Audit} from './audit.js';
 import {EntityClassification} from '../computed/entity-classification.js';
 import * as i18n from '../lib/i18n/i18n.js';
+import {Util} from '../../shared/util.js';
+import UrlUtils from '../lib/url-utils.js';
 
 const UIStrings = {
   /** Title of a Lighthouse audit that provides detail on HTTP to HTTPS redirects. This descriptive title is shown to users when HTTP traffic is redirected to HTTPS. */
@@ -54,11 +56,13 @@ class ValidSourceMaps extends Audit {
    * @return {boolean}
    */
   static isLargeFirstPartyJS(script, classifiedEntities) {
-    if (!script.length) return false;
+    const url = script.url;
+    if (!script.length || !url) return false;
+    if (!UrlUtils.isValid(url)) return false;
+    if (!Util.createOrReturnURL(url).protocol.startsWith('http')) return false;
 
     const isLargeJS = script.length >= LARGE_JS_BYTE_THRESHOLD;
-    const isFirstPartyJS = script.url ? classifiedEntities.isFirstParty(script.url) : false;
-    return isLargeJS && isFirstPartyJS;
+    return classifiedEntities.isFirstParty(url) && isLargeJS;
   }
 
   /**

package/core/config/config.js

@@ -37,6 +37,18 @@ const defaultConfigPath = path.join(
   '../../config/default-config.js'
 );
 
+/**
+ * Certain gatherers are destructive to the page state.
+ * We should ensure that these gatherers run after any custom gatherers.
+ * The default priority should be 0.
+ * TODO: Make this an official part of the config or design a different solution.
+ * @type {Record<string, number|undefined>}
+ */
+const internalArtifactPriorities = {
+  FullPageScreenshot: 1,
+  BFCacheFailures: 1,
+};
+
 /**
  * @param {LH.Config|undefined} config
  * @param {{configPath?: string}} context
@@ -129,12 +141,19 @@ async function resolveArtifactsToDefns(artifacts, configDir) {
   const status = {msg: 'Resolve artifact definitions', id: 'lh:config:resolveArtifactsToDefns'};
   log.time(status, 'verbose');
 
+  const sortedArtifacts = [...artifacts];
+  sortedArtifacts.sort((a, b) => {
+    const aPriority = internalArtifactPriorities[a.id] || 0;
+    const bPriority = internalArtifactPriorities[b.id] || 0;
+    return aPriority - bPriority;
+  });
+
   /** @type {Map<Symbol, LH.Config.AnyArtifactDefn>} */
   const artifactDefnsBySymbol = new Map();
 
   const coreGathererList = Runner.getGathererList();
   const artifactDefns = [];
-  for (const artifactJson of artifacts) {
+  for (const artifactJson of sortedArtifacts) {
     /** @type {LH.Config.GathererJson} */
     // @ts-expect-error - remove when legacy runner path is removed.
     const gathererJson = artifactJson.gatherer;

package/core/config/default-config.js

@@ -122,105 +122,57 @@ const UIStrings = {
 
 const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
 
-// Ensure all artifact IDs match the typedefs.
-/** @type {Record<keyof LH.FRArtifacts, string>} */
-const artifacts = {
-  DevtoolsLog: '',
-  Trace: '',
-  Accessibility: '',
-  AnchorElements: '',
-  BFCacheFailures: '',
-  CacheContents: '',
-  ConsoleMessages: '',
-  CSSUsage: '',
-  Doctype: '',
-  DOMStats: '',
-  EmbeddedContent: '',
-  FontSize: '',
-  Inputs: '',
-  FullPageScreenshot: '',
-  GlobalListeners: '',
-  IFrameElements: '',
-  ImageElements: '',
-  InstallabilityErrors: '',
-  InspectorIssues: '',
-  JsUsage: '',
-  LinkElements: '',
-  MainDocumentContent: '',
-  MetaElements: '',
-  NetworkUserAgent: '',
-  OptimizedImages: '',
-  ResponseCompression: '',
-  RobotsTxt: '',
-  ServiceWorker: '',
-  ScriptElements: '',
-  Scripts: '',
-  SourceMaps: '',
-  Stacks: '',
-  TagsBlockingFirstPaint: '',
-  TapTargets: '',
-  TraceElements: '',
-  ViewportDimensions: '',
-  WebAppManifest: '',
-  devtoolsLogs: '',
-  traces: '',
-};
-
-for (const key of Object.keys(artifacts)) {
-  artifacts[/** @type {keyof typeof artifacts} */ (key)] = key;
-}
-
 /** @type {LH.Config} */
 const defaultConfig = {
   settings: constants.defaultSettings,
   artifacts: [
     // Artifacts which can be depended on come first.
-    {id: artifacts.DevtoolsLog, gatherer: 'devtools-log'},
-    {id: artifacts.Trace, gatherer: 'trace'},
+    {id: 'DevtoolsLog', gatherer: 'devtools-log'},
+    {id: 'Trace', gatherer: 'trace'},
 
-    {id: artifacts.Accessibility, gatherer: 'accessibility'},
-    {id: artifacts.AnchorElements, gatherer: 'anchor-elements'},
-    {id: artifacts.CacheContents, gatherer: 'cache-contents'},
-    {id: artifacts.ConsoleMessages, gatherer: 'console-messages'},
-    {id: artifacts.CSSUsage, gatherer: 'css-usage'},
-    {id: artifacts.Doctype, gatherer: 'dobetterweb/doctype'},
-    {id: artifacts.DOMStats, gatherer: 'dobetterweb/domstats'},
-    {id: artifacts.EmbeddedContent, gatherer: 'seo/embedded-content'},
-    {id: artifacts.FontSize, gatherer: 'seo/font-size'},
-    {id: artifacts.Inputs, gatherer: 'inputs'},
-    {id: artifacts.GlobalListeners, gatherer: 'global-listeners'},
-    {id: artifacts.IFrameElements, gatherer: 'iframe-elements'},
-    {id: artifacts.ImageElements, gatherer: 'image-elements'},
-    {id: artifacts.InstallabilityErrors, gatherer: 'installability-errors'},
-    {id: artifacts.InspectorIssues, gatherer: 'inspector-issues'},
-    {id: artifacts.JsUsage, gatherer: 'js-usage'},
-    {id: artifacts.LinkElements, gatherer: 'link-elements'},
-    {id: artifacts.MainDocumentContent, gatherer: 'main-document-content'},
-    {id: artifacts.MetaElements, gatherer: 'meta-elements'},
-    {id: artifacts.NetworkUserAgent, gatherer: 'network-user-agent'},
-    {id: artifacts.OptimizedImages, gatherer: 'dobetterweb/optimized-images'},
-    {id: artifacts.ResponseCompression, gatherer: 'dobetterweb/response-compression'},
-    {id: artifacts.RobotsTxt, gatherer: 'seo/robots-txt'},
-    {id: artifacts.ServiceWorker, gatherer: 'service-worker'},
-    {id: artifacts.ScriptElements, gatherer: 'script-elements'},
-    {id: artifacts.Scripts, gatherer: 'scripts'},
-    {id: artifacts.SourceMaps, gatherer: 'source-maps'},
-    {id: artifacts.Stacks, gatherer: 'stacks'},
-    {id: artifacts.TagsBlockingFirstPaint, gatherer: 'dobetterweb/tags-blocking-first-paint'},
-    {id: artifacts.TapTargets, gatherer: 'seo/tap-targets'},
-    {id: artifacts.TraceElements, gatherer: 'trace-elements'},
-    {id: artifacts.ViewportDimensions, gatherer: 'viewport-dimensions'},
-    {id: artifacts.WebAppManifest, gatherer: 'web-app-manifest'},
+    {id: 'Accessibility', gatherer: 'accessibility'},
+    {id: 'AnchorElements', gatherer: 'anchor-elements'},
+    {id: 'CacheContents', gatherer: 'cache-contents'},
+    {id: 'ConsoleMessages', gatherer: 'console-messages'},
+    {id: 'CSSUsage', gatherer: 'css-usage'},
+    {id: 'Doctype', gatherer: 'dobetterweb/doctype'},
+    {id: 'DOMStats', gatherer: 'dobetterweb/domstats'},
+    {id: 'EmbeddedContent', gatherer: 'seo/embedded-content'},
+    {id: 'FontSize', gatherer: 'seo/font-size'},
+    {id: 'Inputs', gatherer: 'inputs'},
+    {id: 'GlobalListeners', gatherer: 'global-listeners'},
+    {id: 'IFrameElements', gatherer: 'iframe-elements'},
+    {id: 'ImageElements', gatherer: 'image-elements'},
+    {id: 'InstallabilityErrors', gatherer: 'installability-errors'},
+    {id: 'InspectorIssues', gatherer: 'inspector-issues'},
+    {id: 'JsUsage', gatherer: 'js-usage'},
+    {id: 'LinkElements', gatherer: 'link-elements'},
+    {id: 'MainDocumentContent', gatherer: 'main-document-content'},
+    {id: 'MetaElements', gatherer: 'meta-elements'},
+    {id: 'NetworkUserAgent', gatherer: 'network-user-agent'},
+    {id: 'OptimizedImages', gatherer: 'dobetterweb/optimized-images'},
+    {id: 'ResponseCompression', gatherer: 'dobetterweb/response-compression'},
+    {id: 'RobotsTxt', gatherer: 'seo/robots-txt'},
+    {id: 'ServiceWorker', gatherer: 'service-worker'},
+    {id: 'ScriptElements', gatherer: 'script-elements'},
+    {id: 'Scripts', gatherer: 'scripts'},
+    {id: 'SourceMaps', gatherer: 'source-maps'},
+    {id: 'Stacks', gatherer: 'stacks'},
+    {id: 'TagsBlockingFirstPaint', gatherer: 'dobetterweb/tags-blocking-first-paint'},
+    {id: 'TapTargets', gatherer: 'seo/tap-targets'},
+    {id: 'TraceElements', gatherer: 'trace-elements'},
+    {id: 'ViewportDimensions', gatherer: 'viewport-dimensions'},
+    {id: 'WebAppManifest', gatherer: 'web-app-manifest'},
 
     // Artifact copies are renamed for compatibility with legacy artifacts.
-    {id: artifacts.devtoolsLogs, gatherer: 'devtools-log-compat'},
-    {id: artifacts.traces, gatherer: 'trace-compat'},
+    {id: 'devtoolsLogs', gatherer: 'devtools-log-compat'},
+    {id: 'traces', gatherer: 'trace-compat'},
 
     // FullPageScreenshot comes at the end so all other node analysis is captured.
-    {id: artifacts.FullPageScreenshot, gatherer: 'full-page-screenshot'},
+    {id: 'FullPageScreenshot', gatherer: 'full-page-screenshot'},
 
-    // BFCacheErrors comes at the very end because it can perform a page navigation.
-    {id: artifacts.BFCacheFailures, gatherer: 'bf-cache-failures'},
+    // BFCacheFailures comes at the very end because it can perform a page navigation.
+    {id: 'BFCacheFailures', gatherer: 'bf-cache-failures'},
   ],
   audits: [
     'is-on-https',
@@ -275,7 +227,7 @@ const defaultConfig = {
     'non-composited-animations',
     'unsized-images',
     'valid-source-maps',
-    'preload-lcp-image',
+    'prioritize-lcp-image',
     'csp-xss',
     'script-treemap-data',
     'manual/pwa-cross-browser',
@@ -494,7 +446,7 @@ const defaultConfig = {
         {id: 'efficient-animated-content', weight: 0},
         {id: 'duplicated-javascript', weight: 0},
         {id: 'legacy-javascript', weight: 0},
-        {id: 'preload-lcp-image', weight: 0},
+        {id: 'prioritize-lcp-image', weight: 0},
         {id: 'total-byte-weight', weight: 0},
         {id: 'uses-long-cache-ttl', weight: 0},
         {id: 'dom-size', weight: 0},

package/core/config/metrics-to-audits.js

@@ -22,7 +22,7 @@ const fcpRelevantAudits = [
 const lcpRelevantAudits = [
   ...fcpRelevantAudits,
   'largest-contentful-paint-element',
-  'preload-lcp-image',
+  'prioritize-lcp-image',
   'unused-javascript',
   'efficient-animated-content',
   'total-byte-weight',

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

@@ -222,9 +222,13 @@ class FullPageScreenshot extends FRGatherer {
         await this._resizeViewport(context, deviceMetrics);
       }
 
+      // Issue both commands at once, to reduce the chance that the page changes between capturing
+      // a screenshot and resolving the nodes. https://github.com/GoogleChrome/lighthouse/pull/14763
+      const [screenshot, nodes] =
+        await Promise.all([this._takeScreenshot(context), this._resolveNodes(context)]);
       return {
-        screenshot: await this._takeScreenshot(context),
-        nodes: await this._resolveNodes(context),
+        screenshot,
+        nodes,
       };
     } finally {
       if (!settings.usePassiveGathering) {

package/core/gather/gatherers/trace-elements.js

@@ -230,8 +230,9 @@ class TraceElements extends FRGatherer {
       throw err;
     }
 
+    // Use main-frame-only LCP to match the metric value.
+    const lcpData = processedNavigation.largestContentfulPaintEvt?.args?.data;
     // These should exist, but trace types are loose.
-    const lcpData = processedNavigation.largestContentfulPaintAllFramesEvt?.args?.data;
     if (lcpData?.nodeId === undefined || !lcpData.type) return;
 
     return {

package/core/gather/navigation-runner.d.ts

@@ -66,12 +66,14 @@ export function _navigations(args: {
     artifacts: Partial<LH.FRArtifacts & LH.FRBaseArtifacts>;
 }>;
 /**
- * @param {{requestedUrl?: string, driver: Driver, resolvedConfig: LH.Config.ResolvedConfig}} args
+ * @param {{requestedUrl?: string, driver: Driver, resolvedConfig: LH.Config.ResolvedConfig, lhBrowser?: LH.Puppeteer.Browser, lhPage?: LH.Puppeteer.Page}} args
  */
-export function _cleanup({ requestedUrl, driver, resolvedConfig }: {
+export function _cleanup({ requestedUrl, driver, resolvedConfig, lhBrowser, lhPage }: {
     requestedUrl?: string;
     driver: Driver;
     resolvedConfig: LH.Config.ResolvedConfig;
+    lhBrowser?: LH.Puppeteer.Browser;
+    lhPage?: LH.Puppeteer.Page;
 }): Promise<void>;
 import { Driver } from "./driver.js";
 import { collectPhaseArtifacts } from "./runner-helpers.js";

package/core/gather/navigation-runner.js

@@ -309,13 +309,17 @@ async function _navigations(args) {
 }
 
 /**
- * @param {{requestedUrl?: string, driver: Driver, resolvedConfig: LH.Config.ResolvedConfig}} args
+ * @param {{requestedUrl?: string, driver: Driver, resolvedConfig: LH.Config.ResolvedConfig, lhBrowser?: LH.Puppeteer.Browser, lhPage?: LH.Puppeteer.Page}} args
  */
-async function _cleanup({requestedUrl, driver, resolvedConfig}) {
+async function _cleanup({requestedUrl, driver, resolvedConfig, lhBrowser, lhPage}) {
   const didResetStorage = !resolvedConfig.settings.disableStorageReset && requestedUrl;
   if (didResetStorage) await storage.clearDataForOrigin(driver.defaultSession, requestedUrl);
 
   await driver.disconnect();
+
+  // If Lighthouse started the Puppeteer instance then we are responsible for closing it.
+  await lhPage?.close();
+  await lhBrowser?.disconnect();
 }
 
 /**
@@ -338,17 +342,25 @@ async function navigationGather(page, requestor, options = {}) {
     async () => {
       const normalizedRequestor = isCallback ? requestor : UrlUtils.normalizeUrl(requestor);
 
+      /** @type {LH.Puppeteer.Browser|undefined} */
+      let lhBrowser = undefined;
+      /** @type {LH.Puppeteer.Page|undefined} */
+      let lhPage = undefined;
+
       // 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} = flags;
-        const browser = await puppeteer.connect({browserURL: `http://${hostname}:${port}`});
-        page = await browser.newPage();
+        lhBrowser = await puppeteer.connect({browserURL: `http://${hostname}:${port}`});
+        lhPage = await lhBrowser.newPage();
+        page = lhPage;
       }
 
       const driver = new Driver(page);
       const context = {
         driver,
+        lhBrowser,
+        lhPage,
         resolvedConfig,
         requestor: normalizedRequestor,
       };