lighthouse 12.6.0 → 12.6.1-dev.20250603

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

@@ -291,7 +291,7 @@ class RenderBlockingResources extends Audit {
     const headings = [
       {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
       {key: 'totalBytes', valueType: 'bytes', label: str_(i18n.UIStrings.columnTransferSize)},
-      {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
+      {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnDuration)},
     ];
 
     const details = Audit.makeOpportunityDetails(headings, results,

package/core/audits/deprecations.js

@@ -58,7 +58,7 @@ class Deprecations extends Audit {
   static async audit(artifacts, context) {
     const bundles = await JSBundles.request(artifacts, context);
 
-    const deprecations = artifacts.InspectorIssues.deprecationIssue
+    const deprecations = (artifacts.InspectorIssues.deprecationIssue ?? [])
       .map(deprecation => {
         const {scriptId, url, lineNumber, columnNumber} = deprecation.sourceCodeLocation;
         const bundle = bundles.find(bundle => bundle.script.scriptId === scriptId);

package/core/audits/dobetterweb/doctype.js

@@ -71,7 +71,7 @@ class Doctype extends Audit {
 
     /** @type {LH.Crdp.Audits.QuirksModeIssueDetails[]} */
     let quirksModeIssues = [];
-    if (trace && artifacts.InspectorIssues) {
+    if (trace && artifacts.InspectorIssues?.quirksModeIssue) {
       const processedTrace = await ProcessedTrace.request(trace, context);
       const mainFrameId = processedTrace.mainFrameInfo.frameId;
       quirksModeIssues =

package/core/audits/dobetterweb/inspector-issues.js

@@ -160,25 +160,20 @@ class IssuesPanelEntries extends Audit {
     /** @type LH.Audit.Details.TableItem[] */
     const items = [];
 
-    if (issues.mixedContentIssue.length) {
+    if (issues.mixedContentIssue?.length) {
       items.push(this.getMixedContentRow(issues.mixedContentIssue));
     }
-    if (issues.cookieIssue.length) {
+    if (issues.cookieIssue?.length) {
       items.push(this.getCookieRow(issues.cookieIssue));
     }
-    if (issues.blockedByResponseIssue.length) {
+    if (issues.blockedByResponseIssue?.length) {
       items.push(this.getBlockedByResponseRow(issues.blockedByResponseIssue));
     }
-    if (issues.heavyAdIssue.length) {
+    if (issues.heavyAdIssue?.length) {
       items.push({issueType: str_(UIStrings.issueTypeHeavyAds)});
     }
-    const cspIssues = issues.contentSecurityPolicyIssue.filter(issue => {
-      // kTrustedTypesSinkViolation and kTrustedTypesPolicyViolation aren't currently supported by the Issues panel
-      return issue.contentSecurityPolicyViolationType !== 'kTrustedTypesSinkViolation' &&
-        issue.contentSecurityPolicyViolationType !== 'kTrustedTypesPolicyViolation';
-    });
-    if (cspIssues.length) {
-      items.push(this.getContentSecurityPolicyRow(cspIssues));
+    if (issues.contentSecurityPolicyIssue?.length) {
+      items.push(this.getContentSecurityPolicyRow(issues.contentSecurityPolicyIssue));
     }
     return {
       score: items.length > 0 ? 0 : 1,

package/core/audits/insights/document-latency-insight.js

@@ -40,7 +40,14 @@ class DocumentLatencyInsight extends Audit {
         return;
       }
 
-      return Audit.makeChecklistDetails(insight.data.checklist);
+      const details = Audit.makeChecklistDetails(insight.data.checklist);
+      details.debugData = {
+        type: 'debugdata',
+        redirectDuration: insight.data.redirectDuration,
+        serverResponseTime: insight.data.serverResponseTime,
+        uncompressedResponseBytes: insight.data.uncompressedResponseBytes,
+      };
+      return details;
     });
   }
 }

package/core/audits/insights/dom-size-insight.js

@@ -77,7 +77,15 @@ class DOMSizeInsight extends Audit {
           },
         },
       ];
-      return Audit.makeTableDetails(headings, items);
+
+      const details = Audit.makeTableDetails(headings, items);
+      details.debugData = {
+        type: 'debugdata',
+        totalElements,
+        maxChildren: maxChildren.numChildren,
+        maxDepth: maxDepth.depth,
+      };
+      return details;
     });
   }
 }

package/core/audits/insights/insight-audit.js

@@ -75,6 +75,13 @@ async function adaptInsightToAuditProduct(artifacts, context, insightName, creat
     };
   }
 
+  if (insight.wastedBytes !== undefined) {
+    if (!details.debugData) {
+      details.debugData = {type: 'debugdata'};
+    }
+    details.debugData.wastedBytes = insight.wastedBytes;
+  }
+
   // This hack is to add metric adorners if an insight category links it to a metric,
   // but doesn't output a metric savings for that metric.
   let metricSavings = insight.metricSavings;

package/core/audits/insights/render-blocking-insight.js

@@ -41,7 +41,7 @@ class RenderBlockingInsight extends Audit {
       const headings = [
         {key: 'url', valueType: 'url', label: str_(i18n.UIStrings.columnURL)},
         {key: 'totalBytes', valueType: 'bytes', label: str_(i18n.UIStrings.columnTransferSize)},
-        {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnWastedMs)},
+        {key: 'wastedMs', valueType: 'timespanMs', label: str_(i18n.UIStrings.columnDuration)},
       ];
       /** @type {LH.Audit.Details.Table['items']} */
       const items = insight.renderBlockingRequests.map(request => ({

package/core/audits/is-on-https.js

@@ -86,7 +86,7 @@ class HTTPS extends Audit {
       {key: 'resolution', valueType: 'text', label: str_(UIStrings.columnResolution)},
     ];
 
-    for (const details of artifacts.InspectorIssues.mixedContentIssue) {
+    for (const details of artifacts.InspectorIssues.mixedContentIssue ?? []) {
       let item = items.find(item => item.url === details.insecureURL);
       if (!item) {
         item = {url: details.insecureURL};

package/core/audits/third-party-cookies.js

@@ -68,7 +68,7 @@ class ThirdPartyCookies extends Audit {
 
     /** @type {LH.Audit.Details.TableItem[]} */
     const items = [];
-    for (const issue of artifacts.InspectorIssues.cookieIssue) {
+    for (const issue of artifacts.InspectorIssues.cookieIssue ?? []) {
       const isPhaseoutWarn = issue.cookieWarningReasons.includes('WarnThirdPartyPhaseout');
       const isPhaseoutExclude = issue.cookieExclusionReasons.includes('ExcludeThirdPartyPhaseout');
       if (!isPhaseoutWarn && !isPhaseoutExclude) continue;

package/core/computed/metrics/timing-summary.js

@@ -4,6 +4,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import log from 'lighthouse-logger';
+
 import {ProcessedTrace} from '../processed-trace.js';
 import {ProcessedNavigation} from '../processed-navigation.js';
 import {Speedline} from '../speedline.js';
@@ -19,6 +21,7 @@ import {TotalBlockingTime} from './total-blocking-time.js';
 import {makeComputedArtifact} from '../computed-artifact.js';
 import {TimeToFirstByte} from './time-to-first-byte.js';
 import {LCPBreakdown} from './lcp-breakdown.js';
+import {isUnderTest} from '../../lib/lh-env.js';
 
 class TimingSummary {
   /**
@@ -43,7 +46,12 @@ class TimingSummary {
      * @return {Promise<TReturn|undefined>}
      */
     const requestOrUndefined = (Artifact, artifact) => {
-      return Artifact.request(artifact, context).catch(_ => undefined);
+      return Artifact.request(artifact, context).catch(err => {
+        if (isUnderTest) {
+          log.error('lh:computed:TimingSummary', err);
+        }
+        return undefined;
+      });
     };
 
     /* eslint-disable max-len */

package/core/computed/page-dependency-graph.js

@@ -36,6 +36,10 @@ class PageDependencyGraph {
       return graph;
     }
 
+    // TODO: currently the trace version has no requests that failed, or requests that have "Preflight".
+    //       so the following gets the devtools log version _closer_ to the exact same results as the trace.
+    // const lanternRequests = networkRecords.map(NetworkRequest.asLanternNetworkRequest).filter(r => !r.failed && r.resourceType !== 'Preflight');
+
     const lanternRequests = networkRecords.map(NetworkRequest.asLanternNetworkRequest);
     return Lantern.Graph.PageDependencyGraph.createGraph(mainThreadEvents, lanternRequests, URL);
   }

package/core/computed/trace-engine-result.js

@@ -97,6 +97,9 @@ class TraceEngineResult {
         if (value && typeof value === 'object' && '__i18nBytes' in value) {
           values[key] = value.__i18nBytes;
           // TODO: use an actual byte formatter. Right now, this shows the exact number of bytes.
+        } else if (value && typeof value === 'object' && '__i18nMillis' in value) {
+          values[key] = `${value.__i18nMillis} ms`;
+          // TODO: use an actual time formatter.
         } else if (value && typeof value === 'object' && 'i18nId' in value) {
           // TODO: add support for str_ values to be IcuMessage. For now, we translate it here.
           // This means that locale swapping won't work for this portion of the IcuMessage.
@@ -172,6 +175,10 @@ class TraceEngineResult {
             // @ts-expect-error
             values[key] = value.__i18nBytes;
             // TODO: use an actual byte formatter. Right now, this shows the exact number of bytes.
+          } else if (value && typeof value === 'object' && '__i18nMillis' in value) {
+            // @ts-expect-error
+            values[key] = `${value.__i18nMillis} ms`;
+            // TODO: use an actual time formatter.
           } else if (value && typeof value === 'object' && 'i18nId' in value) {
             // TODO: add support for str_ values to be IcuMessage.
             // @ts-expect-error

package/core/config/constants.d.ts

@@ -51,7 +51,7 @@ declare const MOTOGPOWER_EMULATION_METRICS: Required<LH.SharedFlagsSettings["scr
  * @type {Required<LH.SharedFlagsSettings['screenEmulation']>}
  */
 declare const DESKTOP_EMULATION_METRICS: Required<LH.SharedFlagsSettings["screenEmulation"]>;
-declare const MOTOG4_USERAGENT: "Mozilla/5.0 (Linux; Android 11; moto g power (2022)) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Mobile Safari/537.36";
-declare const DESKTOP_USERAGENT: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36";
+declare const MOTOG4_USERAGENT: "Mozilla/5.0 (Linux; Android 11; moto g power (2022)) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Mobile Safari/537.36";
+declare const DESKTOP_USERAGENT: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36";
 export {};
 //# sourceMappingURL=constants.d.ts.map

package/core/config/constants.js

@@ -39,8 +39,8 @@ const screenEmulationMetrics = {
 };
 
 
-const MOTOG4_USERAGENT = 'Mozilla/5.0 (Linux; Android 11; moto g power (2022)) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Mobile Safari/537.36'; // eslint-disable-line max-len
-const DESKTOP_USERAGENT = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36'; // eslint-disable-line max-len
+const MOTOG4_USERAGENT = 'Mozilla/5.0 (Linux; Android 11; moto g power (2022)) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Mobile Safari/537.36'; // eslint-disable-line max-len
+const DESKTOP_USERAGENT = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36'; // eslint-disable-line max-len
 
 const userAgents = {
   mobile: MOTOG4_USERAGENT,

package/core/config/lr-desktop-config.js

@@ -19,6 +19,7 @@ const config = {
     skipAudits: [
       // Skip the h2 audit so it doesn't lie to us. See https://github.com/GoogleChrome/lighthouse/issues/6539
       'uses-http2',
+      'modern-http-insight',
       // There are always bf-cache failures when testing in headless. Reenable when headless can give us realistic bf-cache insights.
       'bf-cache',
     ],

package/core/config/lr-mobile-config.js

@@ -18,6 +18,7 @@ const config = {
     skipAudits: [
       // Skip the h2 audit so it doesn't lie to us. See https://github.com/GoogleChrome/lighthouse/issues/6539
       'uses-http2',
+      'modern-http-insight',
       // There are always bf-cache failures when testing in headless. Reenable when headless can give us realistic bf-cache insights.
       'bf-cache',
     ],

package/core/gather/driver/execution-context.d.ts

@@ -58,11 +58,13 @@ export class ExecutionContext {
      */
     _evaluateInContext(expression: string, contextId: number | undefined, timeout: number): Promise<any>;
     /**
-     * Note: Prefer `evaluate` instead.
      * Evaluate an expression in the context of the current page. If useIsolation is true, the expression
      * will be evaluated in a content script that has access to the page's DOM but whose JavaScript state
      * is completely separate.
      * Returns a promise that resolves on the expression's value.
+     *
+     * @deprecated Use `evaluate` instead! It has a better API, and unlike `evaluateAsync` doesn't sometimes
+     * execute invalid code.
      * @param {string} expression
      * @param {{useIsolation?: boolean}=} options
      * @return {Promise<*>}

package/core/gather/driver/execution-context.js

@@ -151,11 +151,13 @@ class ExecutionContext {
   }
 
   /**
-   * Note: Prefer `evaluate` instead.
    * Evaluate an expression in the context of the current page. If useIsolation is true, the expression
    * will be evaluated in a content script that has access to the page's DOM but whose JavaScript state
    * is completely separate.
    * Returns a promise that resolves on the expression's value.
+   *
+   * @deprecated Use `evaluate` instead! It has a better API, and unlike `evaluateAsync` doesn't sometimes
+   * execute invalid code.
    * @param {string} expression
    * @param {{useIsolation?: boolean}=} options
    * @return {Promise<*>}

package/core/gather/gatherers/css-usage.js

@@ -30,7 +30,10 @@ class CSSUsage extends BaseGatherer {
 
     // Force style to recompute.
     // Doesn't appear to be necessary in newer versions of Chrome.
-    await executionContext.evaluateAsync('getComputedStyle(document.body)');
+    /* global window, document */
+    await executionContext.evaluate(() => window.getComputedStyle(document.body), {
+      args: [],
+    });
 
     const {ruleUsage} = await session.sendCommand('CSS.stopRuleUsageTracking');
     await session.sendCommand('CSS.disable');

package/core/gather/gatherers/inspector-issues.d.ts

@@ -19,9 +19,9 @@ declare class InspectorIssues extends BaseGatherer {
     stopInstrumentation(context: LH.Gatherer.Context): Promise<void>;
     /**
      * @param {LH.Gatherer.Context<'DevtoolsLog'>} context
-     * @return {Promise<LH.Artifacts['InspectorIssues']>}
+     * @return {Promise<LH.Artifacts.InspectorIssues>}
      */
-    getArtifact(context: LH.Gatherer.Context<"DevtoolsLog">): Promise<LH.Artifacts["InspectorIssues"]>;
+    getArtifact(context: LH.Gatherer.Context<"DevtoolsLog">): Promise<LH.Artifacts.InspectorIssues>;
 }
 import BaseGatherer from '../base-gatherer.js';
 //# sourceMappingURL=inspector-issues.d.ts.map

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

@@ -54,7 +54,7 @@ class InspectorIssues extends BaseGatherer {
 
   /**
    * @param {LH.Gatherer.Context<'DevtoolsLog'>} context
-   * @return {Promise<LH.Artifacts['InspectorIssues']>}
+   * @return {Promise<LH.Artifacts.InspectorIssues>}
    */
   async getArtifact(context) {
     const devtoolsLog = context.dependencies.DevtoolsLog;
@@ -62,6 +62,7 @@ class InspectorIssues extends BaseGatherer {
 
     /** @type {LH.Artifacts.InspectorIssues} */
     const artifact = {
+      // TODO(v13): remove empty arrays.
       attributionReportingIssue: [],
       blockedByResponseIssue: [],
       bounceTrackingIssue: [],
@@ -86,27 +87,39 @@ class InspectorIssues extends BaseGatherer {
       stylesheetLoadingIssue: [],
       sriMessageSignatureIssue: [],
       federatedAuthUserInfoRequestIssue: [],
+      userReidentificationIssue: [],
     };
-    const keys = /** @type {Array<keyof LH.Artifacts['InspectorIssues']>} */(Object.keys(artifact));
-    for (const key of keys) {
-      /** @type {`${key}Details`} */
-      const detailsKey = `${key}Details`;
-      const allDetails = this._issues.map(issue => issue.details[detailsKey]);
-      for (const detail of allDetails) {
-        if (!detail) {
-          continue;
-        }
-        // Duplicate issues can occur for the same request; only use the one with a matching networkRequest.
-        const requestId = 'request' in detail && detail.request && detail.request.requestId;
-        if (requestId) {
-          if (networkRecords.find(req => req.requestId === requestId)) {
-            // @ts-expect-error - detail types are not all compatible
-            artifact[key].push(detail);
+
+    for (const issue of this._issues) {
+      const detailsKey = /** @type {keyof LH.Crdp.Audits.InspectorIssueDetails} */(
+        Object.keys(issue.details)[0]);
+      const details = issue.details[detailsKey];
+      if (!details) {
+        continue;
+      }
+
+      const artifactKey =
+        /** @type {LH.Artifacts.InspectorIssuesKeyToArtifactKey<typeof detailsKey>} */(
+          detailsKey.replace('Details', ''));
+
+      // Duplicate issues can occur for the same request; only use the one with a matching networkRequest.
+      const requestId = 'request' in details && details.request && details.request.requestId;
+      if (requestId) {
+        if (networkRecords.find(req => req.requestId === requestId)) {
+          if (!artifact[artifactKey]) {
+            artifact[artifactKey] = [];
           }
-        } else {
+
           // @ts-expect-error - detail types are not all compatible
-          artifact[key].push(detail);
+          artifact[artifactKey].push(details);
         }
+      } else {
+        if (!artifact[artifactKey]) {
+          artifact[artifactKey] = [];
+        }
+
+        // @ts-expect-error - detail types are not all compatible
+        artifact[artifactKey].push(details);
       }
     }
 

package/core/gather/gatherers/stylesheets.js

@@ -74,7 +74,10 @@ class Stylesheets extends BaseGatherer {
 
     // Force style to recompute.
     // Doesn't appear to be necessary in newer versions of Chrome.
-    await executionContext.evaluateAsync('getComputedStyle(document.body)');
+    /* global window, document */
+    await executionContext.evaluate(() => window.getComputedStyle(document.body), {
+      args: [],
+    });
 
     session.off('CSS.styleSheetAdded', this._onStylesheetAdded);
 

package/core/lib/network-request.js

@@ -107,6 +107,7 @@ const RESOURCE_TYPES = {
   Preflight: 'Preflight',
   CSPViolationReport: 'CSPViolationReport',
   Prefetch: 'Prefetch',
+  FedCM: 'FedCM',
 };
 
 class NetworkRequest {

package/core/lib/trace-engine.d.ts

@@ -8,6 +8,8 @@ export type DevToolsIcuMessage = {
     i18nId: string;
     values: Record<string, string | number | {
         __i18nBytes: number;
+    } | {
+        __i18nMillis: number;
     }>;
 };
 export const TraceProcessor: typeof TraceEngine.Processor.TraceProcessor;

package/core/lib/trace-engine.js

@@ -4,7 +4,7 @@ import {polyfillDOMRect} from './polyfill-dom-rect.js';
 
 /** @typedef {import('@paulirish/trace_engine').Types.Events.SyntheticLayoutShift} SyntheticLayoutShift */
 /** @typedef {SyntheticLayoutShift & {args: {data: NonNullable<SyntheticLayoutShift['args']['data']>}}} SaneSyntheticLayoutShift */
-/** @typedef {{i18nId: string, values: Record<string, string|number|{__i18nBytes: number}>}} DevToolsIcuMessage */
+/** @typedef {{i18nId: string, values: Record<string, string|number|{__i18nBytes: number}|{__i18nMillis: number}>}} DevToolsIcuMessage */
 
 polyfillDOMRect();