lighthouse 10.1.1 → 10.2.0

package/core/audits/prioritize-lcp-image.js

@@ -11,8 +11,7 @@ import {MainResource} from '../computed/main-resource.js';
 import {LanternLargestContentfulPaint} from '../computed/metrics/lantern-largest-contentful-paint.js';
 import {LoadSimulator} from '../computed/load-simulator.js';
 import {ByteEfficiencyAudit} from './byte-efficiency/byte-efficiency-audit.js';
-import {ProcessedNavigation} from '../computed/processed-navigation.js';
-import {NetworkRecords} from '../computed/network-records.js';
+import {LCPImageRecord} from '../computed/lcp-image-record.js';
 
 const UIStrings = {
   /** Title of a lighthouse audit that tells a user to preload an image in order to improve their LCP time. */
@@ -140,55 +139,6 @@ class PrioritizeLcpImage extends Audit {
     };
   }
 
-  /**
-   * Match the LCP event with the paint event to get the request of the image actually painted.
-   * This could differ from the `ImageElement` associated with the nodeId if e.g. the LCP
-   * was a pseudo-element associated with a node containing a smaller background-image.
-   * @param {LH.Trace} trace
-   * @param {LH.Artifacts.ProcessedNavigation} processedNavigation
-   * @param {Array<NetworkRequest>} networkRecords
-   * @return {NetworkRequest|undefined}
-   */
-  static getLcpRecord(trace, processedNavigation, networkRecords) {
-    // Use main-frame-only LCP to match the metric value.
-    const lcpEvent = processedNavigation.largestContentfulPaintEvt;
-    if (!lcpEvent) return;
-
-    const lcpImagePaintEvent = trace.traceEvents.filter(e => {
-      return e.name === 'LargestImagePaint::Candidate' &&
-          e.args.frame === lcpEvent.args.frame &&
-          e.args.data?.DOMNodeId === lcpEvent.args.data?.nodeId &&
-          e.args.data?.size === lcpEvent.args.data?.size;
-    // Get last candidate, in case there was more than one.
-    }).sort((a, b) => b.ts - a.ts)[0];
-
-    const lcpUrl = lcpImagePaintEvent?.args.data?.imageUrl;
-    if (!lcpUrl) return;
-
-    const candidates = networkRecords.filter(record => {
-      return record.url === lcpUrl &&
-          record.finished &&
-          // Same frame as LCP trace event.
-          record.frameId === lcpImagePaintEvent.args.frame &&
-          record.networkRequestTime < (processedNavigation.timestamps.largestContentfulPaint || 0);
-    }).map(record => {
-      // Follow any redirects to find the real image request.
-      while (record.redirectDestination) {
-        record = record.redirectDestination;
-      }
-      return record;
-    }).filter(record => {
-      // Don't select if also loaded by some other means (xhr, etc). `resourceType`
-      // isn't set on redirect _sources_, so have to check after following redirects.
-      return record.resourceType === 'Image';
-    });
-
-    // If there are still multiple candidates, at this point it appears the page
-    // simply made multiple requests for the image. The first loaded is the best
-    // guess of the request that made the image available for use.
-    return candidates.sort((a, b) => a.networkEndTime - b.networkEndTime)[0];
-  }
-
   /**
    * Computes the estimated effect of preloading the LCP image.
    * @param {LH.Artifacts.TraceElement} lcpElement
@@ -297,17 +247,15 @@ class PrioritizeLcpImage extends Audit {
       return {score: null, notApplicable: true};
     }
 
-    const networkRecords = await NetworkRecords.request(devtoolsLog, context);
-    const processedNavigation = await ProcessedNavigation.request(trace, context);
     const mainResource = await MainResource.request({devtoolsLog, URL}, context);
     const lanternLCP = await LanternLargestContentfulPaint.request(metricData, context);
     const simulator = await LoadSimulator.request({devtoolsLog, settings}, context);
 
-    const lcpRecord = PrioritizeLcpImage.getLcpRecord(trace, processedNavigation, networkRecords);
+    const lcpImageRecord = await LCPImageRecord.request({trace, devtoolsLog}, context);
     const graph = lanternLCP.pessimisticGraph;
     // Note: if moving to LCPAllFrames, mainResource would need to be the LCP frame's main resource.
     const {lcpNodeToPreload, initiatorPath} = PrioritizeLcpImage.getLCPNodeToPreload(mainResource,
-        graph, lcpRecord);
+        graph, lcpImageRecord);
 
     const {results, wastedMs} =
       PrioritizeLcpImage.computeWasteWithGraph(lcpElement, lcpNodeToPreload, graph, simulator);

package/core/audits/redirects.d.ts

@@ -28,6 +28,6 @@ export namespace UIStrings {
     const title: string;
     const description: string;
 }
-import { Audit } from "./audit.js";
-import { ProcessedTrace } from "../computed/processed-trace.js";
+import { Audit } from './audit.js';
+import { ProcessedTrace } from '../computed/processed-trace.js';
 //# sourceMappingURL=redirects.d.ts.map

package/core/audits/resource-summary.d.ts

@@ -12,5 +12,5 @@ export namespace UIStrings {
     const description: string;
     const displayValue: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=resource-summary.d.ts.map

package/core/audits/screenshot-thumbnails.d.ts

@@ -28,6 +28,6 @@ declare class ScreenshotThumbnails extends Audit {
      */
     static audit(artifacts: LH.Artifacts, context: LH.Audit.Context): Promise<LH.Audit.Product>;
 }
-import { Speedline } from "../computed/speedline.js";
-import { Audit } from "./audit.js";
+import { Speedline } from '../computed/speedline.js';
+import { Audit } from './audit.js';
 //# sourceMappingURL=screenshot-thumbnails.d.ts.map

package/core/audits/script-treemap-data.d.ts

@@ -38,5 +38,5 @@ declare class ScriptTreemapDataAudit extends Audit {
      */
     static audit(artifacts: LH.Artifacts, context: LH.Audit.Context): Promise<LH.Audit.Product>;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=script-treemap-data.d.ts.map

package/core/audits/seo/canonical.d.ts

@@ -47,5 +47,5 @@ export namespace UIStrings {
     const explanationPointsElsewhere: string;
     const explanationRoot: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=canonical.d.ts.map

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

@@ -12,5 +12,5 @@ export namespace UIStrings {
     const description: string;
     const columnFailingLink: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=crawlable-anchors.d.ts.map

package/core/audits/seo/font-size.d.ts

@@ -20,5 +20,5 @@ export namespace UIStrings {
     const columnPercentPageText: string;
     const columnFontSize: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=font-size.d.ts.map

package/core/audits/seo/hreflang.d.ts

@@ -24,5 +24,5 @@ export namespace UIStrings {
     const unexpectedLanguage: string;
     const notFullyQualified: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=hreflang.d.ts.map

package/core/audits/seo/http-status-code.d.ts

@@ -12,5 +12,5 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=http-status-code.d.ts.map

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

@@ -34,5 +34,5 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=is-crawlable.d.ts.map

package/core/audits/seo/link-text.d.ts

@@ -12,5 +12,5 @@ export namespace UIStrings {
     const description: string;
     const displayValue: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=link-text.d.ts.map

package/core/audits/seo/manual/structured-data.d.ts

@@ -8,5 +8,5 @@ export namespace UIStrings {
     const description: string;
     const title: string;
 }
-import ManualAudit from "../../manual/manual-audit.js";
+import ManualAudit from '../../manual/manual-audit.js';
 //# sourceMappingURL=structured-data.d.ts.map

package/core/audits/seo/meta-description.d.ts

@@ -12,5 +12,5 @@ export namespace UIStrings {
     const description: string;
     const explanation: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=meta-description.d.ts.map

package/core/audits/seo/plugins.d.ts

@@ -11,5 +11,5 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=plugins.d.ts.map

package/core/audits/seo/robots-txt.d.ts

@@ -14,5 +14,5 @@ export namespace UIStrings {
     const displayValueValidationError: string;
     const explanation: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 //# sourceMappingURL=robots-txt.d.ts.map

package/core/audits/seo/tap-targets.d.ts

@@ -45,6 +45,6 @@ export namespace UIStrings {
     const explanationViewportMetaNotOptimized: string;
     const displayValue: string;
 }
-import { Audit } from "../audit.js";
+import { Audit } from '../audit.js';
 declare const FINGER_SIZE_PX: 48;
 //# sourceMappingURL=tap-targets.d.ts.map

package/core/audits/server-response-time.d.ts

@@ -17,5 +17,5 @@ export namespace UIStrings {
     const description: string;
     const displayValue: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=server-response-time.d.ts.map

package/core/audits/service-worker.d.ts

@@ -42,5 +42,5 @@ export namespace UIStrings {
     const explanationBadManifest: string;
     const explanationBadStartUrl: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=service-worker.d.ts.map

package/core/audits/splash-screen.d.ts

@@ -32,6 +32,6 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import MultiCheckAudit from "./multi-check-audit.js";
-import { ManifestValues } from "../computed/manifest-values.js";
+import MultiCheckAudit from './multi-check-audit.js';
+import { ManifestValues } from '../computed/manifest-values.js';
 //# sourceMappingURL=splash-screen.d.ts.map

package/core/audits/themed-omnibox.d.ts

@@ -37,6 +37,6 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import MultiCheckAudit from "./multi-check-audit.js";
-import { ManifestValues } from "../computed/manifest-values.js";
+import MultiCheckAudit from './multi-check-audit.js';
+import { ManifestValues } from '../computed/manifest-values.js';
 //# sourceMappingURL=themed-omnibox.d.ts.map

package/core/audits/third-party-facades.d.ts

@@ -37,6 +37,6 @@ export namespace UIStrings {
     const categoryMarketing: string;
     const categorySocial: string;
 }
-import { Audit } from "./audit.js";
-import { EntityClassification } from "../computed/entity-classification.js";
+import { Audit } from './audit.js';
+import { EntityClassification } from '../computed/entity-classification.js';
 //# sourceMappingURL=third-party-facades.d.ts.map

package/core/audits/third-party-summary.d.ts

@@ -54,6 +54,6 @@ export namespace UIStrings {
     const columnThirdParty: string;
     const displayValue: string;
 }
-import { Audit } from "./audit.js";
-import { EntityClassification } from "../computed/entity-classification.js";
+import { Audit } from './audit.js';
+import { EntityClassification } from '../computed/entity-classification.js';
 //# sourceMappingURL=third-party-summary.d.ts.map

package/core/audits/timing-budget.d.ts

@@ -37,7 +37,7 @@ export namespace UIStrings {
     const columnTimingMetric: string;
     const columnMeasurement: string;
 }
-import { Budget } from "../config/budget.js";
-import { Audit } from "./audit.js";
-import { TimingSummary } from "../computed/metrics/timing-summary.js";
+import { Budget } from '../config/budget.js';
+import { Audit } from './audit.js';
+import { TimingSummary } from '../computed/metrics/timing-summary.js';
 //# sourceMappingURL=timing-budget.d.ts.map

package/core/audits/unsized-images.d.ts

@@ -35,5 +35,5 @@ export namespace UIStrings {
     const failureTitle: string;
     const description: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=unsized-images.d.ts.map

package/core/audits/user-timings.d.ts

@@ -39,5 +39,5 @@ export namespace UIStrings {
     const displayValue: string;
     const columnType: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=user-timings.d.ts.map

package/core/audits/uses-rel-preconnect.d.ts

@@ -33,5 +33,5 @@ export namespace UIStrings {
     const crossoriginWarning: string;
     const tooManyPreconnectLinksWarning: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=uses-rel-preconnect.d.ts.map

package/core/audits/uses-rel-preload.d.ts

@@ -56,6 +56,6 @@ export namespace UIStrings {
     const description: string;
     const crossoriginWarning: string;
 }
-import { Audit } from "./audit.js";
-import { NetworkRequest } from "../lib/network-request.js";
+import { Audit } from './audit.js';
+import { NetworkRequest } from '../lib/network-request.js';
 //# sourceMappingURL=uses-rel-preload.d.ts.map

package/core/audits/valid-source-maps.d.ts

@@ -24,6 +24,6 @@ export namespace UIStrings {
     const missingSourceMapErrorMessage: string;
     const missingSourceMapItemsWarningMesssage: string;
 }
-import { Audit } from "./audit.js";
-import { EntityClassification } from "../computed/entity-classification.js";
+import { Audit } from './audit.js';
+import { EntityClassification } from '../computed/entity-classification.js';
 //# sourceMappingURL=valid-source-maps.d.ts.map

package/core/audits/viewport.d.ts

@@ -13,5 +13,5 @@ export namespace UIStrings {
     const description: string;
     const explanationNoTag: string;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=viewport.d.ts.map

package/core/audits/violation-audit.d.ts

@@ -10,5 +10,5 @@ declare class ViolationAudit extends Audit {
         source: LH.Audit.Details.SourceLocationValue;
     }>>;
 }
-import { Audit } from "./audit.js";
+import { Audit } from './audit.js';
 //# sourceMappingURL=violation-audit.d.ts.map

package/core/audits/work-during-interaction.d.ts

@@ -77,6 +77,6 @@ export namespace UIStrings {
     const displayValue: string;
     const eventTarget: string;
 }
-import { Audit } from "./audit.js";
-import { ProcessedTrace } from "../computed/processed-trace.js";
+import { Audit } from './audit.js';
+import { ProcessedTrace } from '../computed/processed-trace.js';
 //# sourceMappingURL=work-during-interaction.d.ts.map

package/core/computed/critical-request-chains.d.ts

@@ -36,5 +36,5 @@ declare class CriticalRequestChains {
         trace: LH.Trace;
     }, context: LH.Artifacts.ComputedContext): Promise<LH.Artifacts.CriticalRequestNode>;
 }
-import { NetworkRequest } from "../lib/network-request.js";
+import { NetworkRequest } from '../lib/network-request.js';
 //# sourceMappingURL=critical-request-chains.d.ts.map

package/core/computed/document-urls.d.ts

@@ -0,0 +1,32 @@
+export { DocumentUrlsComputed as DocumentUrls };
+declare const DocumentUrlsComputed: typeof DocumentUrls & {
+    request: (dependencies: {
+        trace: LH.Trace;
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<{
+        requestedUrl: string;
+        mainDocumentUrl: string;
+    }>;
+};
+/**
+ * @fileoverview Compute the navigation specific URLs `requestedUrl` and `mainDocumentUrl` in situations where
+ * the `URL` artifact is not present. This is not a drop-in replacement for `URL` but can be helpful in situations
+ * where getting the `URL` artifact is difficult.
+ */
+declare class DocumentUrls {
+    /**
+     * @param {{trace: LH.Trace, devtoolsLog: LH.DevtoolsLog}} data
+     * @param {LH.Artifacts.ComputedContext} context
+     * @return {Promise<{requestedUrl: string, mainDocumentUrl: string}>}
+     */
+    static compute_(data: {
+        trace: LH.Trace;
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: LH.Artifacts.ComputedContext): Promise<{
+        requestedUrl: string;
+        mainDocumentUrl: string;
+    }>;
+}
+//# sourceMappingURL=document-urls.d.ts.map

package/core/computed/document-urls.js

@@ -0,0 +1,53 @@
+/**
+ * @license Copyright 2023 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {NetworkAnalyzer} from '../lib/dependency-graph/simulator/network-analyzer.js';
+import {makeComputedArtifact} from './computed-artifact.js';
+import {NetworkRecords} from './network-records.js';
+import {ProcessedTrace} from './processed-trace.js';
+
+/**
+ * @fileoverview Compute the navigation specific URLs `requestedUrl` and `mainDocumentUrl` in situations where
+ * the `URL` artifact is not present. This is not a drop-in replacement for `URL` but can be helpful in situations
+ * where getting the `URL` artifact is difficult.
+ */
+
+class DocumentUrls {
+  /**
+   * @param {{trace: LH.Trace, devtoolsLog: LH.DevtoolsLog}} data
+   * @param {LH.Artifacts.ComputedContext} context
+   * @return {Promise<{requestedUrl: string, mainDocumentUrl: string}>}
+   */
+  static async compute_(data, context) {
+    const processedTrace = await ProcessedTrace.request(data.trace, context);
+    const networkRecords = await NetworkRecords.request(data.devtoolsLog, context);
+
+    const mainFrameId = processedTrace.mainFrameInfo.frameId;
+
+    /** @type {string|undefined} */
+    let requestedUrl;
+    /** @type {string|undefined} */
+    let mainDocumentUrl;
+    for (const event of data.devtoolsLog) {
+      if (event.method === 'Page.frameNavigated' && event.params.frame.id === mainFrameId) {
+        const {url} = event.params.frame;
+        // Only set requestedUrl on the first main frame navigation.
+        if (!requestedUrl) requestedUrl = url;
+        mainDocumentUrl = url;
+      }
+    }
+    if (!requestedUrl || !mainDocumentUrl) throw new Error('No main frame navigations found');
+
+    const initialRequest = NetworkAnalyzer.findResourceForUrl(networkRecords, requestedUrl);
+    if (initialRequest?.redirects?.length) requestedUrl = initialRequest.redirects[0].url;
+
+    return {requestedUrl, mainDocumentUrl};
+  }
+}
+
+const DocumentUrlsComputed = makeComputedArtifact(DocumentUrls, ['devtoolsLog', 'trace']);
+export {DocumentUrlsComputed as DocumentUrls};
+

package/core/computed/entity-classification.js

@@ -85,7 +85,6 @@ class EntityClassification {
      */
     function isFirstParty(url) {
       const entityUrl = entityByUrl.get(url);
-      if (!entityUrl) throw new Error('A url not in devtoolsLog was used for first-party check.');
       return entityUrl === firstParty;
     }
 

package/core/computed/lcp-image-record.d.ts

@@ -0,0 +1,26 @@
+export { LCPImageRecordComputed as LCPImageRecord };
+declare const LCPImageRecordComputed: typeof LCPImageRecord & {
+    request: (dependencies: {
+        trace: LH.Trace;
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: import("../../types/utility-types.js").default.ImmutableObject<{
+        computedCache: Map<string, import("../lib/arbitrary-equality-map.js").ArbitraryEqualityMap>;
+    }>) => Promise<import("../lib/network-request.js").NetworkRequest | undefined>;
+};
+/**
+ * @fileoverview Match the LCP event with the paint event to get the request of the image actually painted.
+ * This could differ from the `ImageElement` associated with the nodeId if e.g. the LCP
+ * was a pseudo-element associated with a node containing a smaller background-image.
+ */
+declare class LCPImageRecord {
+    /**
+     * @param {{trace: LH.Trace, devtoolsLog: LH.DevtoolsLog}} data
+     * @param {LH.Artifacts.ComputedContext} context
+     * @return {Promise<LH.Artifacts.NetworkRequest|undefined>}
+     */
+    static compute_(data: {
+        trace: LH.Trace;
+        devtoolsLog: import("../index.js").DevtoolsLog;
+    }, context: LH.Artifacts.ComputedContext): Promise<LH.Artifacts.NetworkRequest | undefined>;
+}
+//# sourceMappingURL=lcp-image-record.d.ts.map

package/core/computed/lcp-image-record.js

@@ -0,0 +1,74 @@
+/**
+ * @license Copyright 2023 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {makeComputedArtifact} from './computed-artifact.js';
+import {NetworkRecords} from './network-records.js';
+import {ProcessedNavigation} from './processed-navigation.js';
+import {LighthouseError} from '../lib/lh-error.js';
+
+/**
+ * @fileoverview Match the LCP event with the paint event to get the request of the image actually painted.
+ * This could differ from the `ImageElement` associated with the nodeId if e.g. the LCP
+ * was a pseudo-element associated with a node containing a smaller background-image.
+ */
+
+class LCPImageRecord {
+  /**
+   * @param {{trace: LH.Trace, devtoolsLog: LH.DevtoolsLog}} data
+   * @param {LH.Artifacts.ComputedContext} context
+   * @return {Promise<LH.Artifacts.NetworkRequest|undefined>}
+   */
+  static async compute_(data, context) {
+    const {trace, devtoolsLog} = data;
+    const networkRecords = await NetworkRecords.request(devtoolsLog, context);
+    const processedNavigation = await ProcessedNavigation.request(trace, context);
+    if (processedNavigation.timings.largestContentfulPaint === undefined) {
+      throw new LighthouseError(LighthouseError.errors.NO_LCP);
+    }
+
+    // Use main-frame-only LCP to match the metric value.
+    const lcpEvent = processedNavigation.largestContentfulPaintEvt;
+    if (!lcpEvent) return;
+
+    const lcpImagePaintEvent = trace.traceEvents.filter(e => {
+      return e.name === 'LargestImagePaint::Candidate' &&
+          e.args.frame === lcpEvent.args.frame &&
+          e.args.data?.DOMNodeId === lcpEvent.args.data?.nodeId &&
+          e.args.data?.size === lcpEvent.args.data?.size;
+    // Get last candidate, in case there was more than one.
+    }).sort((a, b) => b.ts - a.ts)[0];
+
+    const lcpUrl = lcpImagePaintEvent?.args.data?.imageUrl;
+    if (!lcpUrl) return;
+
+    const candidates = networkRecords.filter(record => {
+      return record.url === lcpUrl &&
+          record.finished &&
+          // Same frame as LCP trace event.
+          record.frameId === lcpImagePaintEvent.args.frame &&
+          record.networkRequestTime < (processedNavigation.timestamps.largestContentfulPaint || 0);
+    }).map(record => {
+      // Follow any redirects to find the real image request.
+      while (record.redirectDestination) {
+        record = record.redirectDestination;
+      }
+      return record;
+    }).filter(record => {
+      // Don't select if also loaded by some other means (xhr, etc). `resourceType`
+      // isn't set on redirect _sources_, so have to check after following redirects.
+      return record.resourceType === 'Image';
+    });
+
+    // If there are still multiple candidates, at this point it appears the page
+    // simply made multiple requests for the image. The first loaded is the best
+    // guess of the request that made the image available for use.
+    return candidates.sort((a, b) => a.networkEndTime - b.networkEndTime)[0];
+  }
+}
+
+const LCPImageRecordComputed = makeComputedArtifact(LCPImageRecord, ['devtoolsLog', 'trace']);
+export {LCPImageRecordComputed as LCPImageRecord};
+

package/core/computed/load-simulator.d.ts

@@ -23,6 +23,6 @@ declare class LoadSimulator {
      */
     static convertAnalysisToSaveableLanternData(networkAnalysis: LH.Artifacts.NetworkAnalysis): LH.PrecomputedLanternData;
 }
-import { Simulator } from "../lib/dependency-graph/simulator/simulator.js";
-import { NetworkAnalysis } from "./network-analysis.js";
+import { Simulator } from '../lib/dependency-graph/simulator/simulator.js';
+import { NetworkAnalysis } from './network-analysis.js';
 //# sourceMappingURL=load-simulator.d.ts.map

package/core/computed/metrics/cumulative-layout-shift.d.ts

@@ -49,5 +49,5 @@ declare class CumulativeLayoutShift {
         totalCumulativeLayoutShift: number;
     }>;
 }
-import { ProcessedTrace } from "../processed-trace.js";
+import { ProcessedTrace } from '../processed-trace.js';
 //# sourceMappingURL=cumulative-layout-shift.d.ts.map

package/core/computed/metrics/first-contentful-paint-all-frames.d.ts

@@ -15,5 +15,5 @@ declare class FirstContentfulPaintAllFrames extends NavigationMetric {
      */
     static computeObservedMetric(data: LH.Artifacts.NavigationMetricComputationData): Promise<LH.Artifacts.Metric>;
 }
-import { NavigationMetric } from "./navigation-metric.js";
+import { NavigationMetric } from './navigation-metric.js';
 //# sourceMappingURL=first-contentful-paint-all-frames.d.ts.map

package/core/computed/metrics/first-contentful-paint.d.ts

@@ -5,11 +5,17 @@ declare const FirstContentfulPaintComputed: typeof FirstContentfulPaint & {
     }>) => Promise<import("../../index.js").Artifacts.Metric | import("../../index.js").Artifacts.LanternMetric>;
 };
 declare class FirstContentfulPaint extends NavigationMetric {
+    /**
+     * @param {LH.Artifacts.NavigationMetricComputationData} data
+     * @param {LH.Artifacts.ComputedContext} context
+     * @return {Promise<LH.Artifacts.LanternMetric>}
+     */
+    static computeSimulatedMetric(data: LH.Artifacts.NavigationMetricComputationData, context: LH.Artifacts.ComputedContext): Promise<LH.Artifacts.LanternMetric>;
     /**
      * @param {LH.Artifacts.NavigationMetricComputationData} data
      * @return {Promise<LH.Artifacts.Metric>}
      */
     static computeObservedMetric(data: LH.Artifacts.NavigationMetricComputationData): Promise<LH.Artifacts.Metric>;
 }
-import { NavigationMetric } from "./navigation-metric.js";
+import { NavigationMetric } from './navigation-metric.js';
 //# sourceMappingURL=first-contentful-paint.d.ts.map