lighthouse 11.7.0-dev.20240331 → 11.7.0-dev.20240402

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

@@ -61,7 +61,6 @@ import screenshot from './test-definitions/screenshot.js';
 import seoFailing from './test-definitions/seo-failing.js';
 import seoPassing from './test-definitions/seo-passing.js';
 import seoStatus403 from './test-definitions/seo-status-403.js';
-import seoTapTargets from './test-definitions/seo-tap-targets.js';
 import serviceWorkerReloaded from './test-definitions/service-worker-reloaded.js';
 import shiftAttribution from './test-definitions/shift-attribution.js';
 import sourceMaps from './test-definitions/source-maps.js';
@@ -126,7 +125,6 @@ const smokeTests = [
   seoFailing,
   seoPassing,
   seoStatus403,
-  seoTapTargets,
   serviceWorkerReloaded,
   shiftAttribution,
   sourceMaps,

package/core/audits/byte-efficiency/byte-efficiency-audit.d.ts

@@ -56,22 +56,6 @@ export class ByteEfficiencyAudit extends Audit {
         simulationBeforeChanges: LH.Gatherer.Simulation.Result;
         simulationAfterChanges: LH.Gatherer.Simulation.Result;
     };
-    /**
-     * Computes the estimated effect of all the byte savings on the maximum of the following:
-     *
-     * - end time of the last long task in the provided graph
-     * - (if includeLoad is true or not provided) end time of the last node in the graph
-     *
-     * @param {Array<LH.Audit.ByteEfficiencyItem>} results The array of byte savings results per resource
-     * @param {Node} graph
-     * @param {Simulator} simulator
-     * @param {{includeLoad?: boolean, providedWastedBytesByUrl?: Map<string, number>}=} options
-     * @return {number}
-     */
-    static computeWasteWithTTIGraph(results: Array<LH.Audit.ByteEfficiencyItem>, graph: Node, simulator: Simulator, options?: {
-        includeLoad?: boolean;
-        providedWastedBytesByUrl?: Map<string, number>;
-    } | undefined): number;
     /**
      * @param {ByteEfficiencyProduct} result
      * @param {Simulator} simulator

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

@@ -5,11 +5,9 @@
  */
 
 import {Audit} from '../audit.js';
-import {LanternInteractive} from '../../computed/metrics/lantern-interactive.js';
 import * as i18n from '../../lib/i18n/i18n.js';
 import {NetworkRecords} from '../../computed/network-records.js';
 import {LoadSimulator} from '../../computed/load-simulator.js';
-import {PageDependencyGraph} from '../../computed/page-dependency-graph.js';
 import {LanternLargestContentfulPaint} from '../../computed/metrics/lantern-largest-contentful-paint.js';
 import {LanternFirstContentfulPaint} from '../../computed/metrics/lantern-first-contentful-paint.js';
 import {LCPImageRecord} from '../../computed/lcp-image-record.js';
@@ -151,37 +149,6 @@ class ByteEfficiencyAudit extends Audit {
     };
   }
 
-  /**
-   * Computes the estimated effect of all the byte savings on the maximum of the following:
-   *
-   * - end time of the last long task in the provided graph
-   * - (if includeLoad is true or not provided) end time of the last node in the graph
-   *
-   * @param {Array<LH.Audit.ByteEfficiencyItem>} results The array of byte savings results per resource
-   * @param {Node} graph
-   * @param {Simulator} simulator
-   * @param {{includeLoad?: boolean, providedWastedBytesByUrl?: Map<string, number>}=} options
-   * @return {number}
-   */
-  static computeWasteWithTTIGraph(results, graph, simulator, options) {
-    options = Object.assign({includeLoad: true}, options);
-    const {savings: savingsOnOverallLoad, simulationBeforeChanges, simulationAfterChanges} =
-      this.computeWasteWithGraph(results, graph, simulator, {
-        ...options,
-        label: 'overallLoad',
-      });
-
-    const savingsOnTTI =
-      LanternInteractive.getLastLongTaskEndTime(simulationBeforeChanges.nodeTimings) -
-      LanternInteractive.getLastLongTaskEndTime(simulationAfterChanges.nodeTimings);
-
-    let savings = savingsOnTTI;
-    if (options.includeLoad) savings = Math.max(savings, savingsOnOverallLoad);
-
-    // Round waste to nearest 10ms
-    return Math.round(Math.max(savings, 0) / 10) * 10;
-  }
-
   /**
    * @param {ByteEfficiencyProduct} result
    * @param {Simulator} simulator
@@ -204,7 +171,6 @@ class ByteEfficiencyAudit extends Audit {
     // This is useful information in the LHR and should be preserved.
     let wastedMs;
     if (metricComputationInput.gatherContext.gatherMode === 'navigation') {
-      const graph = await PageDependencyGraph.request(metricComputationInput, context);
       const {
         optimisticGraph: optimisticFCPGraph,
       } = await LanternFirstContentfulPaint.request(metricComputationInput, context);
@@ -212,10 +178,6 @@ class ByteEfficiencyAudit extends Audit {
         optimisticGraph: optimisticLCPGraph,
       } = await LanternLargestContentfulPaint.request(metricComputationInput, context);
 
-      wastedMs = this.computeWasteWithTTIGraph(results, graph, simulator, {
-        providedWastedBytesByUrl: result.wastedBytesByUrl,
-      });
-
       const {savings: fcpSavings} = this.computeWasteWithGraph(
         results,
         optimisticFCPGraph,
@@ -243,6 +205,7 @@ class ByteEfficiencyAudit extends Audit {
 
       metricSavings.FCP = fcpSavings;
       metricSavings.LCP = Math.max(lcpGraphSavings, lcpRecordSavings);
+      wastedMs = metricSavings.LCP;
     } else {
       wastedMs = simulator.computeWastedMsFromWastedBytes(wastedBytes);
     }

package/core/audits/byte-efficiency/offscreen-images.d.ts

@@ -47,17 +47,6 @@ declare class OffscreenImages extends ByteEfficiencyAudit {
      * @param {number} interactiveTimestamp
      */
     static filterObservedResults(images: WasteResult[], interactiveTimestamp: number): WasteResult[];
-    /**
-     * The default byte efficiency audit will report max(TTI, load), since lazy-loading offscreen
-     * images won't reduce the overall time and the wasted bytes are really only "wasted" for TTI,
-     * override the function to just look at TTI savings.
-     *
-     * @param {Array<LH.Audit.ByteEfficiencyItem>} results
-     * @param {LH.Gatherer.Simulation.GraphNode} graph
-     * @param {LH.Gatherer.Simulation.Simulator} simulator
-     * @return {number}
-     */
-    static computeWasteWithTTIGraph(results: Array<LH.Audit.ByteEfficiencyItem>, graph: LH.Gatherer.Simulation.GraphNode, simulator: LH.Gatherer.Simulation.Simulator): number;
     /**
      * @param {LH.Artifacts} artifacts
      * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords

package/core/audits/byte-efficiency/offscreen-images.js

@@ -156,21 +156,6 @@ class OffscreenImages extends ByteEfficiencyAudit {
     });
   }
 
-  /**
-   * The default byte efficiency audit will report max(TTI, load), since lazy-loading offscreen
-   * images won't reduce the overall time and the wasted bytes are really only "wasted" for TTI,
-   * override the function to just look at TTI savings.
-   *
-   * @param {Array<LH.Audit.ByteEfficiencyItem>} results
-   * @param {LH.Gatherer.Simulation.GraphNode} graph
-   * @param {LH.Gatherer.Simulation.Simulator} simulator
-   * @return {number}
-   */
-  static computeWasteWithTTIGraph(results, graph, simulator) {
-    return super.computeWasteWithTTIGraph(results, graph, simulator,
-      {includeLoad: false});
-  }
-
   /**
    * @param {LH.Artifacts} artifacts
    * @param {Array<LH.Artifacts.NetworkRequest>} networkRecords

package/core/audits/dobetterweb/uses-http2.d.ts

@@ -20,19 +20,6 @@ declare class UsesHTTP2Audit extends Audit {
         simulationBefore: LH.Gatherer.Simulation.Result;
         simulationAfter: LH.Gatherer.Simulation.Result;
     };
-    /**
-     * Computes the estimated effect all results being converted to use http/2, the max of:
-     *
-     * - end time of the last long task in the provided graph
-     * - end time of the last node in the graph
-     * @param {Array<{url: string}>} results
-     * @param {Node} graph
-     * @param {Simulator} simulator
-     * @return {number}
-     */
-    static computeWasteWithTTIGraph(results: Array<{
-        url: string;
-    }>, graph: Node, simulator: Simulator): number;
     /**
      * Determines whether a network request is a "static resource" that would benefit from H2 multiplexing.
      * XHRs, tracking pixels, etc generally don't benefit as much because they aren't requested en-masse

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

@@ -15,11 +15,9 @@
 import {Audit} from '../audit.js';
 import {EntityClassification} from '../../computed/entity-classification.js';
 import UrlUtils from '../../lib/url-utils.js';
-import {LanternInteractive} from '../../computed/metrics/lantern-interactive.js';
 import {NetworkRequest} from '../../lib/network-request.js';
 import {NetworkRecords} from '../../computed/network-records.js';
 import {LoadSimulator} from '../../computed/load-simulator.js';
-import {PageDependencyGraph} from '../../computed/page-dependency-graph.js';
 import {LanternLargestContentfulPaint} from '../../computed/metrics/lantern-largest-contentful-paint.js';
 import {LanternFirstContentfulPaint} from '../../computed/metrics/lantern-first-contentful-paint.js';
 import * as i18n from '../../lib/i18n/i18n.js';
@@ -117,32 +115,6 @@ class UsesHTTP2Audit extends Audit {
     };
   }
 
-  /**
-   * Computes the estimated effect all results being converted to use http/2, the max of:
-   *
-   * - end time of the last long task in the provided graph
-   * - end time of the last node in the graph
-   * @param {Array<{url: string}>} results
-   * @param {Node} graph
-   * @param {Simulator} simulator
-   * @return {number}
-   */
-  static computeWasteWithTTIGraph(results, graph, simulator) {
-    const {savings: savingsOnOverallLoad, simulationBefore, simulationAfter} =
-      this.computeWasteWithGraph(results, graph, simulator, {
-        label: 'tti',
-      });
-
-    const savingsOnTTI =
-      LanternInteractive.getLastLongTaskEndTime(simulationBefore.nodeTimings) -
-      LanternInteractive.getLastLongTaskEndTime(simulationAfter.nodeTimings);
-
-    const savings = Math.max(savingsOnTTI, savingsOnOverallLoad);
-
-    // Round waste to nearest 10ms
-    return Math.round(Math.max(savings, 0) / 10) * 10;
-  }
-
   /**
    * Determines whether a network request is a "static resource" that would benefit from H2 multiplexing.
    * XHRs, tracking pixels, etc generally don't benefit as much because they aren't requested en-masse
@@ -235,7 +207,6 @@ class UsesHTTP2Audit extends Audit {
    * @return {Promise<LH.Audit.Product>}
    */
   static async audit(artifacts, context) {
-    const trace = artifacts.traces[Audit.DEFAULT_PASS];
     const devtoolsLog = artifacts.devtoolsLogs[Audit.DEFAULT_PASS];
     const URL = artifacts.URL;
     const networkRecords = await NetworkRecords.request(devtoolsLog, context);
@@ -269,7 +240,6 @@ class UsesHTTP2Audit extends Audit {
       devtoolsLog,
       settings,
     };
-    const pageGraph = await PageDependencyGraph.request({trace, devtoolsLog, URL}, context);
     const simulator = await LoadSimulator.request(simulatorOptions, context);
     const metricComputationInput = Audit.makeMetricComputationDataInput(artifacts, context);
 
@@ -280,8 +250,6 @@ class UsesHTTP2Audit extends Audit {
       pessimisticGraph: lcpGraph,
     } = await LanternLargestContentfulPaint.request(metricComputationInput, context);
 
-    const wastedMsTti = UsesHTTP2Audit.computeWasteWithTTIGraph(
-      resources, pageGraph, simulator);
     const wasteFcp =
       UsesHTTP2Audit.computeWasteWithGraph(resources,
         fcpGraph, simulator, {label: 'fcp'});
@@ -296,11 +264,11 @@ class UsesHTTP2Audit extends Audit {
     ];
 
     const details = Audit.makeOpportunityDetails(headings, resources,
-      {overallSavingsMs: wastedMsTti});
+      {overallSavingsMs: wasteLcp.savings});
 
     return {
       displayValue,
-      numericValue: wastedMsTti,
+      numericValue: wasteLcp.savings,
       numericUnit: 'millisecond',
       score: resources.length ? 0 : 1,
       details,

package/core/audits/seo/is-crawlable.d.ts

@@ -6,11 +6,12 @@ declare class IsCrawlable extends Audit {
     static handleMetaElement(metaElement: LH.Artifacts.MetaElement): {
         source: {
             snippet: string;
+            /** @type {Array<string|undefined>} */
             type: "node";
             lhId?: string | undefined;
             path?: string | undefined;
             selector?: string | undefined;
-            boundingRect?: import("../../../types/lhr/audit-details.js").default.Rect | undefined;
+            boundingRect?: import("../../../types/lhr/audit-details.js").default.Rect | undefined; /** @type {Array<string|undefined>} */
             nodeLabel?: string | undefined;
         };
     } | undefined;

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

@@ -30,8 +30,9 @@ class PageDependencyGraph {
     // Calculates the URL artifact from the processed trace and DT log.
     const URL = data.URL || await DocumentUrls.request(data, context);
 
+    const mainThreadEvents = processedTrace.mainThreadEvents;
     const lanternRequests = networkRecords.map(NetworkRequest.asLanternNetworkRequest);
-    return LanternPageDependencyGraph.createGraph(processedTrace, lanternRequests, URL);
+    return LanternPageDependencyGraph.createGraph(mainThreadEvents, lanternRequests, URL);
   }
 }
 

package/core/config/default-config.js

@@ -153,7 +153,6 @@ const defaultConfig = {
     {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'},
@@ -251,7 +250,6 @@ const defaultConfig = {
     'accessibility/definition-list',
     'accessibility/dlitem',
     'accessibility/document-title',
-    'accessibility/duplicate-id-active',
     'accessibility/duplicate-id-aria',
     'accessibility/empty-heading',
     'accessibility/form-field-multiple-labels',
@@ -330,7 +328,6 @@ const defaultConfig = {
     'seo/crawlable-anchors',
     'seo/is-crawlable',
     'seo/robots-txt',
-    'seo/tap-targets',
     'seo/hreflang',
     'seo/plugins',
     'seo/canonical',
@@ -527,7 +524,6 @@ const defaultConfig = {
         {id: 'definition-list', weight: 7, group: 'a11y-tables-lists'},
         {id: 'dlitem', weight: 7, group: 'a11y-tables-lists'},
         {id: 'document-title', weight: 7, group: 'a11y-names-labels'},
-        {id: 'duplicate-id-active', weight: 7, group: 'a11y-navigation'},
         {id: 'duplicate-id-aria', weight: 10, group: 'a11y-aria'},
         {id: 'form-field-multiple-labels', weight: 3, group: 'a11y-names-labels'},
         {id: 'frame-title', weight: 7, group: 'a11y-names-labels'},
@@ -551,6 +547,7 @@ const defaultConfig = {
         {id: 'skip-link', weight: 3, group: 'a11y-names-labels'},
         {id: 'tabindex', weight: 7, group: 'a11y-navigation'},
         {id: 'table-duplicate-name', weight: 1, group: 'a11y-tables-lists'},
+        {id: 'target-size', weight: 7, group: 'a11y-best-practices'},
         {id: 'td-headers-attr', weight: 7, group: 'a11y-tables-lists'},
         {id: 'th-has-data-cells', weight: 7, group: 'a11y-tables-lists'},
         {id: 'valid-lang', weight: 7, group: 'a11y-language'},
@@ -570,7 +567,6 @@ const defaultConfig = {
         {id: 'empty-heading', weight: 0, group: 'hidden'},
         {id: 'identical-links-same-purpose', weight: 0, group: 'hidden'},
         {id: 'landmark-one-main', weight: 0, group: 'hidden'},
-        {id: 'target-size', weight: 0, group: 'hidden'},
         {id: 'label-content-name-mismatch', weight: 0, group: 'hidden'},
         {id: 'table-fake-caption', weight: 0, group: 'hidden'},
         {id: 'td-has-header', weight: 0, group: 'hidden'},
@@ -620,7 +616,6 @@ const defaultConfig = {
         {id: 'canonical', weight: 1, group: 'seo-content'},
         {id: 'font-size', weight: 1, group: 'seo-mobile'},
         {id: 'plugins', weight: 1, group: 'seo-content'},
-        {id: 'tap-targets', weight: 1, group: 'seo-mobile'},
         // Manual audits
         {id: 'structured-data', weight: 0},
       ],

package/core/gather/gatherers/accessibility.js

@@ -52,7 +52,6 @@ async function runA11yChecks() {
       'aria-text': {enabled: true},
       'audio-caption': {enabled: false},
       'blink': {enabled: false},
-      'duplicate-id-active': {enabled: true},
       'duplicate-id': {enabled: false},
       'empty-heading': {enabled: true},
       'frame-focusable-content': {enabled: false},
@@ -79,8 +78,7 @@ async function runA11yChecks() {
       'tabindex': {enabled: true},
       'table-duplicate-name': {enabled: true},
       'table-fake-caption': {enabled: true},
-      // TODO: https://github.com/GoogleChrome/lighthouse/issues/15824
-      // 'target-size': {enabled: true},
+      'target-size': {enabled: true},
       'td-has-header': {enabled: true},
     },
   });

package/core/lib/lantern/page-dependency-graph.d.ts

@@ -18,10 +18,10 @@ export class PageDependencyGraph {
      */
     static getNetworkNodeOutput(networkRecords: Array<Lantern.NetworkRequest>): NetworkNodeOutput;
     /**
-     * @param {LH.Artifacts.ProcessedTrace} processedTrace
+     * @param {LH.TraceEvent[]} mainThreadEvents
      * @return {Array<CPUNode>}
      */
-    static getCPUNodes({ mainThreadEvents }: LH.Artifacts.ProcessedTrace): Array<CPUNode>;
+    static getCPUNodes(mainThreadEvents: LH.TraceEvent[]): Array<CPUNode>;
     /**
      * @param {NetworkNode} rootNode
      * @param {NetworkNodeOutput} networkNodeOutput
@@ -40,12 +40,12 @@ export class PageDependencyGraph {
      */
     static _pruneNode(node: Node): void;
     /**
-     * @param {LH.Artifacts.ProcessedTrace} processedTrace
+     * @param {LH.TraceEvent[]} mainThreadEvents
      * @param {Array<Lantern.NetworkRequest>} networkRecords
      * @param {URLArtifact} URL
      * @return {Node}
      */
-    static createGraph(processedTrace: LH.Artifacts.ProcessedTrace, networkRecords: Array<Lantern.NetworkRequest>, URL: URLArtifact): Node;
+    static createGraph(mainThreadEvents: LH.TraceEvent[], networkRecords: Array<Lantern.NetworkRequest>, URL: URLArtifact): Node;
     /**
      *
      * @param {Node} rootNode

package/core/lib/lantern/page-dependency-graph.js

@@ -109,10 +109,10 @@ class PageDependencyGraph {
   }
 
   /**
-   * @param {LH.Artifacts.ProcessedTrace} processedTrace
+   * @param {LH.TraceEvent[]} mainThreadEvents
    * @return {Array<CPUNode>}
    */
-  static getCPUNodes({mainThreadEvents}) {
+  static getCPUNodes(mainThreadEvents) {
     /** @type {Array<CPUNode>} */
     const nodes = [];
     let i = 0;
@@ -393,14 +393,14 @@ class PageDependencyGraph {
   }
 
   /**
-   * @param {LH.Artifacts.ProcessedTrace} processedTrace
+   * @param {LH.TraceEvent[]} mainThreadEvents
    * @param {Array<Lantern.NetworkRequest>} networkRecords
    * @param {URLArtifact} URL
    * @return {Node}
    */
-  static createGraph(processedTrace, networkRecords, URL) {
+  static createGraph(mainThreadEvents, networkRecords, URL) {
     const networkNodeOutput = PageDependencyGraph.getNetworkNodeOutput(networkRecords);
-    const cpuNodes = PageDependencyGraph.getCPUNodes(processedTrace);
+    const cpuNodes = PageDependencyGraph.getCPUNodes(mainThreadEvents);
     const {requestedUrl, mainDocumentUrl} = URL;
     if (!requestedUrl) throw new Error('requestedUrl is required to get the root request');
     if (!mainDocumentUrl) throw new Error('mainDocumentUrl is required to get the main resource');

package/core/lib/proto-preprocessor.js

@@ -83,28 +83,44 @@ function processForProto(lhr) {
   }
 
   /**
-   * Remove any found empty strings, as they are dropped after round-tripping anyway
+   * Execute `cb(obj, key)` on every object property where obj[key] is a string, recursively.
    * @param {any} obj
+   * @param {(obj: Record<string, string>, key: string) => void} cb
    */
-  function removeStrings(obj) {
+  function iterateStrings(obj, cb) {
     if (obj && typeof obj === 'object' && !Array.isArray(obj)) {
       Object.keys(obj).forEach(key => {
-        if (typeof obj[key] === 'string' && obj[key] === '') {
-          delete obj[key];
-        } else if (typeof obj[key] === 'object' || Array.isArray(obj[key])) {
-          removeStrings(obj[key]);
+        if (typeof obj[key] === 'string') {
+          cb(obj, key);
+        } else {
+          iterateStrings(obj[key], cb);
         }
       });
     } else if (Array.isArray(obj)) {
       obj.forEach(item => {
         if (typeof item === 'object' || Array.isArray(item)) {
-          removeStrings(item);
+          iterateStrings(item, cb);
         }
       });
     }
   }
 
-  removeStrings(reportJson);
+  iterateStrings(reportJson, (obj, key) => {
+    const value = obj[key];
+
+    // Remove empty strings, as they are dropped after round-tripping anyway.
+    if (value === '') {
+      delete obj[key];
+      return;
+    }
+
+    // Sanitize lone surrogates.
+    // @ts-expect-error node 20
+    if (String.prototype.isWellFormed && !value.isWellFormed()) {
+      // @ts-expect-error node 20
+      obj[key] = value.toWellFormed();
+    }
+  });
 
   return reportJson;
 }