lighthouse 9.5.0-dev.20220313 → 9.5.0-dev.20220316

package/lighthouse-cli/test/smokehouse/lighthouse-runners/cli.js

@@ -78,7 +78,6 @@ async function internalRun(url, tmpPath, configJson, options) {
     '--output=json',
     `-G=${artifactsDirectory}`,
     `-A=${artifactsDirectory}`,
-    '--quiet',
     '--port=0',
   ];
 

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

@@ -158,6 +158,7 @@ class UnusedBytes extends Audit {
 
     const simulationBeforeChanges = simulator.simulate(graph, {label: beforeLabel});
 
+    // TODO: change this to wastedBytesByScriptId
     const wastedBytesByUrl = options.providedWastedBytesByUrl || new Map();
     if (!options.providedWastedBytesByUrl) {
       for (const {url, wastedBytes} of results) {

package/lighthouse-core/audits/byte-efficiency/duplicated-javascript.js

@@ -48,7 +48,7 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
-      requiredArtifacts: ['devtoolsLogs', 'traces', 'SourceMaps', 'ScriptElements',
+      requiredArtifacts: ['devtoolsLogs', 'traces', 'SourceMaps', 'Scripts',
         'GatherContext', 'URL'],
     };
   }
@@ -85,10 +85,10 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
 
       const normalizedSource = 'node_modules/' + DuplicatedJavascript._getNodeModuleName(source);
       const aggregatedSourceDatas = groupedDuplication.get(normalizedSource) || [];
-      for (const {scriptUrl, resourceSize} of sourceDatas) {
-        let sourceData = aggregatedSourceDatas.find(d => d.scriptUrl === scriptUrl);
+      for (const {scriptId, scriptUrl, resourceSize} of sourceDatas) {
+        let sourceData = aggregatedSourceDatas.find(d => d.scriptId === scriptId);
         if (!sourceData) {
-          sourceData = {scriptUrl, resourceSize: 0};
+          sourceData = {scriptId, scriptUrl, resourceSize: 0};
           aggregatedSourceDatas.push(sourceData);
         }
         sourceData.resourceSize += resourceSize;
@@ -157,7 +157,9 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
       let wastedBytesTotal = 0;
       for (let i = 0; i < sourceDatas.length; i++) {
         const sourceData = sourceDatas[i];
-        const url = sourceData.scriptUrl;
+        const scriptId = sourceData.scriptId;
+        const script = artifacts.Scripts.find(script => script.scriptId === scriptId);
+        const url = script?.url || '';
 
         /** @type {number|undefined} */
         let transferRatio = transferRatioByUrl.get(url);
@@ -166,13 +168,12 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
             mainDocumentRecord :
             networkRecords.find(n => n.url === url);
 
-          const script = artifacts.ScriptElements.find(script => script.src === url);
-          if (!script || script.content === null) {
+          if (!script || script.length === undefined) {
             // This should never happen because we found the wasted bytes from bundles, which required contents in a ScriptElement.
             continue;
           }
 
-          const contentLength = script.content.length;
+          const contentLength = script.length;
           transferRatio = DuplicatedJavascript._estimateTransferRatio(networkRecord, contentLength);
           transferRatioByUrl.set(url, transferRatio);
         }

package/lighthouse-core/audits/byte-efficiency/legacy-javascript.js

@@ -109,7 +109,7 @@ class LegacyJavascript extends ByteEfficiencyAudit {
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
       description: str_(UIStrings.description),
       title: str_(UIStrings.title),
-      requiredArtifacts: ['devtoolsLogs', 'traces', 'ScriptElements', 'SourceMaps',
+      requiredArtifacts: ['devtoolsLogs', 'traces', 'Scripts', 'SourceMaps',
         'GatherContext', 'URL'],
     };
   }
@@ -274,7 +274,7 @@ class LegacyJavascript extends ByteEfficiencyAudit {
    * Returns a collection of match results grouped by script url.
    *
    * @param {CodePatternMatcher} matcher
-   * @param {LH.GathererArtifacts['ScriptElements']} scripts
+   * @param {LH.Artifacts['Scripts']} scripts
    * @param {LH.Artifacts.NetworkRequest[]} networkRecords
    * @param {LH.Artifacts.Bundle[]} bundles
    * @return {Map<string, PatternMatchResult[]>}
@@ -284,16 +284,14 @@ class LegacyJavascript extends ByteEfficiencyAudit {
     const urlToMatchResults = new Map();
     const polyfillData = this.getPolyfillData();
 
-    for (const {requestId, content} of Object.values(scripts)) {
+    for (const {scriptId, url, content} of Object.values(scripts)) {
       if (!content) continue;
-      const networkRecord = networkRecords.find(record => record.requestId === requestId);
-      if (!networkRecord) continue;
 
       // Start with pattern matching against the downloaded script.
       const matches = matcher.match(content);
 
       // If it's a bundle with source maps, add in the polyfill modules by name too.
-      const bundle = bundles.find(b => b.script.src === networkRecord.url);
+      const bundle = bundles.find(b => b.script.scriptId === scriptId);
       if (bundle) {
         for (const {coreJs2Module, coreJs3Module, name} of polyfillData) {
           // Skip if the pattern matching found a match for this polyfill.
@@ -313,7 +311,8 @@ class LegacyJavascript extends ByteEfficiencyAudit {
       }
 
       if (!matches.length) continue;
-      urlToMatchResults.set(networkRecord.url, matches);
+      // TODO: scriptId
+      urlToMatchResults.set(url, matches);
     }
 
     return urlToMatchResults;
@@ -374,16 +373,16 @@ class LegacyJavascript extends ByteEfficiencyAudit {
     if (transferRatio !== undefined) return transferRatio;
 
     const mainDocumentRecord = NetworkAnalyzer.findOptionalMainDocument(networkRecords);
+    const script = artifacts.Scripts.find(script => script.url === url);
     const networkRecord = url === artifacts.URL.finalUrl ?
       mainDocumentRecord :
-      networkRecords.find(n => n.url === url);
-    const script = artifacts.ScriptElements.find(script => script.src === url);
+      networkRecords.find(n => n.url === script?.url);
 
     if (!script || script.content === null) {
       // Can't find content, so just use 1.
       transferRatio = 1;
     } else {
-      const contentLength = script.content.length;
+      const contentLength = script.length || 0;
       const transferSize =
         ByteEfficiencyAudit.estimateTransferSize(networkRecord, contentLength, 'Script');
       transferRatio = transferSize / contentLength;
@@ -415,7 +414,7 @@ class LegacyJavascript extends ByteEfficiencyAudit {
     const transferRatioByUrl = new Map();
 
     const urlToMatchResults =
-      this.detectAcrossScripts(matcher, artifacts.ScriptElements, networkRecords, bundles);
+      this.detectAcrossScripts(matcher, artifacts.Scripts, networkRecords, bundles);
     for (const [url, matches] of urlToMatchResults.entries()) {
       const transferRatio = await this.estimateTransferRatioForScript(
         transferRatioByUrl, url, artifacts, networkRecords);
@@ -432,7 +431,7 @@ class LegacyJavascript extends ByteEfficiencyAudit {
         totalBytes: 0,
       };
 
-      const bundle = bundles.find(bundle => bundle.script.src === url);
+      const bundle = bundles.find(bundle => bundle.script.url === url); // TODO: scriptId
       for (const match of matches) {
         const {name, line, column} = match;
         /** @type {SubItem} */

package/lighthouse-core/audits/byte-efficiency/unminified-javascript.js

@@ -42,7 +42,7 @@ class UnminifiedJavaScript extends ByteEfficiencyAudit {
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
-      requiredArtifacts: ['ScriptElements', 'devtoolsLogs', 'traces', 'GatherContext'],
+      requiredArtifacts: ['Scripts', 'devtoolsLogs', 'traces', 'GatherContext', 'URL'],
     };
   }
 
@@ -78,15 +78,15 @@ class UnminifiedJavaScript extends ByteEfficiencyAudit {
     /** @type {Array<LH.Audit.ByteEfficiencyItem>} */
     const items = [];
     const warnings = [];
-    for (const {requestId, src, content} of artifacts.ScriptElements) {
-      if (!content) continue;
+    for (const script of artifacts.Scripts) {
+      if (!script.content) continue;
 
-      const networkRecord = networkRecords.find(record => record.requestId === requestId);
-      const displayUrl = !src || !networkRecord ?
-        `inline: ${content.substr(0, 40)}...` :
-        networkRecord.url;
+      const networkRecord = networkRecords.find(record => record.url === script.url);
+      const displayUrl = script.name === artifacts.URL.finalUrl ?
+        `inline: ${script.content.substring(0, 40)}...` :
+        script.url;
       try {
-        const result = UnminifiedJavaScript.computeWaste(content, displayUrl, networkRecord);
+        const result = UnminifiedJavaScript.computeWaste(script.content, displayUrl, networkRecord);
         // If the ratio is minimal, the file is likely already minified, so ignore it.
         // If the total number of bytes to be saved is quite small, it's also safe to ignore.
         if (result.wastedPercent < IGNORE_THRESHOLD_IN_PERCENT ||
@@ -94,8 +94,7 @@ class UnminifiedJavaScript extends ByteEfficiencyAudit {
           !Number.isFinite(result.wastedBytes)) continue;
         items.push(result);
       } catch (err) {
-        const url = networkRecord ? networkRecord.url : '?';
-        warnings.push(`Unable to process script ${url}: ${err.message}`);
+        warnings.push(`Unable to process script ${script.url}: ${err.message}`);
       }
     }
 

package/lighthouse-core/audits/byte-efficiency/unused-javascript.js

@@ -67,7 +67,7 @@ class UnusedJavaScript extends ByteEfficiencyAudit {
       title: str_(UIStrings.title),
       description: str_(UIStrings.description),
       scoreDisplayMode: ByteEfficiencyAudit.SCORING_MODES.NUMERIC,
-      requiredArtifacts: ['JsUsage', 'ScriptElements', 'SourceMaps', 'GatherContext',
+      requiredArtifacts: ['JsUsage', 'Scripts', 'SourceMaps', 'GatherContext',
         'devtoolsLogs', 'traces'],
     };
   }
@@ -86,12 +86,16 @@ class UnusedJavaScript extends ByteEfficiencyAudit {
     } = context.options || {};
 
     const items = [];
-    for (const [url, scriptCoverages] of Object.entries(artifacts.JsUsage)) {
-      const networkRecord = networkRecords.find(record => record.url === url);
+    for (const [scriptId, scriptCoverage] of Object.entries(artifacts.JsUsage)) {
+      const script = artifacts.Scripts.find(s => s.scriptId === scriptId);
+      if (!script) continue; // This should never happen.
+
+      const networkRecord = networkRecords.find(record => record.url === script.url);
       if (!networkRecord) continue;
-      const bundle = bundles.find(b => b.script.src === url);
+
+      const bundle = bundles.find(b => b.script.scriptId === scriptId);
       const unusedJsSummary =
-        await UnusedJavaScriptSummary.request({url, scriptCoverages, bundle}, context);
+        await UnusedJavaScriptSummary.request({scriptId, scriptCoverage, bundle}, context);
       if (unusedJsSummary.wastedBytes === 0 || unusedJsSummary.totalBytes === 0) continue;
 
       const transfer = ByteEfficiencyAudit
@@ -99,7 +103,7 @@ class UnusedJavaScript extends ByteEfficiencyAudit {
       const transferRatio = transfer / unusedJsSummary.totalBytes;
       /** @type {LH.Audit.ByteEfficiencyItem} */
       const item = {
-        url: unusedJsSummary.url,
+        url: script.url,
         totalBytes: Math.round(transferRatio * unusedJsSummary.totalBytes),
         wastedBytes: Math.round(transferRatio * unusedJsSummary.wastedBytes),
         wastedPercent: unusedJsSummary.wastedPercent,

package/lighthouse-core/audits/deprecations.js

@@ -48,7 +48,7 @@ class Deprecations extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['ConsoleMessages', 'InspectorIssues', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'InspectorIssues', 'SourceMaps', 'Scripts'],
     };
   }
 
@@ -65,8 +65,8 @@ class Deprecations extends Audit {
     if (artifacts.InspectorIssues.deprecationIssue.length) {
       deprecations = artifacts.InspectorIssues.deprecationIssue
         .map(deprecation => {
-          const {url, lineNumber, columnNumber} = deprecation.sourceCodeLocation;
-          const bundle = bundles.find(bundle => bundle.script.src === url);
+          const {scriptId, url, lineNumber, columnNumber} = deprecation.sourceCodeLocation;
+          const bundle = bundles.find(bundle => bundle.script.scriptId === scriptId);
           return {
             value: deprecation.message || '',
             // Protocol.Audits.SourceCodeLocation.columnNumber is 1-indexed, but we use 0-indexed.

package/lighthouse-core/audits/dobetterweb/geolocation-on-start.js

@@ -38,7 +38,7 @@ class GeolocationOnStart extends ViolationAudit {
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
       supportedModes: ['navigation'],
-      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
     };
   }
 

package/lighthouse-core/audits/dobetterweb/no-document-write.js

@@ -54,7 +54,7 @@ class NoDocWriteAudit extends ViolationAudit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
     };
   }
 

package/lighthouse-core/audits/dobetterweb/notification-on-start.js

@@ -38,7 +38,7 @@ class NotificationOnStart extends ViolationAudit {
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
       supportedModes: ['navigation'],
-      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
     };
   }
 

package/lighthouse-core/audits/dobetterweb/uses-passive-event-listeners.js

@@ -37,7 +37,7 @@ class PassiveEventsAudit extends ViolationAudit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
     };
   }
 

package/lighthouse-core/audits/errors-in-console.js

@@ -40,7 +40,7 @@ class ErrorLogs extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['ConsoleMessages', 'SourceMaps', 'Scripts'],
     };
   }
 
@@ -87,7 +87,7 @@ class ErrorLogs extends Audit {
     const consoleRows = artifacts.ConsoleMessages
       .filter(item => item.level === 'error')
       .map(item => {
-        const bundle = bundles.find(bundle => bundle.script.src === item.url);
+        const bundle = bundles.find(bundle => bundle.script.scriptId === item.scriptId);
         return {
           source: item.source,
           description: item.text,

package/lighthouse-core/audits/no-unload-listeners.js

@@ -30,7 +30,7 @@ class NoUnloadListeners extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['GlobalListeners', 'JsUsage', 'SourceMaps', 'ScriptElements'],
+      requiredArtifacts: ['GlobalListeners', 'SourceMaps', 'Scripts'],
     };
   }
 
@@ -54,33 +54,25 @@ class NoUnloadListeners extends Audit {
       {key: 'source', itemType: 'source-location', text: str_(i18n.UIStrings.columnSource)},
     ];
 
-    // Look up scriptId to script URL via the JsUsage artifact.
-    /** @type {Map<string, string>} */
-    const scriptIdToUrl = new Map();
-    for (const [url, usages] of Object.entries(artifacts.JsUsage)) {
-      for (const usage of usages) {
-        scriptIdToUrl.set(usage.scriptId, url);
-      }
-    }
-
     /** @type {Array<{source: LH.Audit.Details.ItemValue}>} */
     const tableItems = unloadListeners.map(listener => {
-      const url = scriptIdToUrl.get(listener.scriptId);
+      const {lineNumber, columnNumber} = listener;
+      const script = artifacts.Scripts.find(s => s.scriptId === listener.scriptId);
 
       // If we can't find a url, still show something so the user can manually
       // look for where an `unload` handler is being created.
-      if (!url) {
+      if (!script) {
         return {
           source: {
             type: 'url',
-            value: '(unknown)',
+            value: `(unknown):${lineNumber}:${columnNumber}`,
           },
         };
       }
 
-      const bundle = bundles.find(bundle => bundle.script.src === url);
+      const bundle = bundles.find(bundle => bundle.script.scriptId === script.scriptId);
       return {
-        source: Audit.makeSourceLocation(url, listener.lineNumber, listener.columnNumber, bundle),
+        source: Audit.makeSourceLocation(script.url, lineNumber, columnNumber, bundle),
       };
     });
 

package/lighthouse-core/audits/script-elements-test-audit.js

@@ -0,0 +1,30 @@
+/**
+ * @license Copyright 2022 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.
+ */
+'use strict';
+
+/**
+ * @fileoverview This is a fake audit used exclusively in smoke tests to force inclusion of ScriptElements artifact.
+ * It is included here for complex reasons in the way the bundled smoketests work.
+ *
+ * The smokehouse configs are evaluated first in the node CLI side (which requires an absolute path using LH_ROOT).
+ * The smokehouse configs are then *re-evaluated* in the bundled context for execution by Lighthouse (which *cannot* use an absolute path using LH_ROOT).
+ *
+ * This mismatch in environment demands that the audit path in the config must be context-aware,
+ * yet the require-graph for the config is included before even the CLI knows that it will be using
+ * a bundled runner. Rather than force a massive smoketest architecture change, we include a harmless,
+ * test-only audit in our core list instead.
+ */
+
+module.exports = {
+  meta: {
+    id: 'script-elements-test-audit',
+    title: 'ScriptElements',
+    failureTitle: 'ScriptElements',
+    description: 'Audit to force the inclusion of ScriptElements artifact',
+    requiredArtifacts: ['ScriptElements'],
+  },
+  audit: () => ({score: 1}),
+};

package/lighthouse-core/audits/script-treemap-data.js

@@ -31,7 +31,7 @@ class ScriptTreemapDataAudit extends Audit {
       title: 'Script Treemap Data',
       description: 'Used for treemap app',
       requiredArtifacts:
-        ['traces', 'devtoolsLogs', 'SourceMaps', 'ScriptElements', 'JsUsage', 'URL'],
+        ['traces', 'devtoolsLogs', 'SourceMaps', 'Scripts', 'JsUsage', 'URL'],
     };
   }
 
@@ -167,11 +167,10 @@ class ScriptTreemapDataAudit extends Audit {
     const nodes = [];
 
     let inlineScriptLength = 0;
-    for (const scriptElement of artifacts.ScriptElements) {
-      // No src means script is inline.
-      // Combine these ScriptElements so that inline scripts show up as a single root node.
-      if (!scriptElement.src) {
-        inlineScriptLength += (scriptElement.content || '').length;
+    for (const script of artifacts.Scripts) {
+      // Combine so that inline scripts show up as a single root node.
+      if (script.url === artifacts.URL.finalUrl) {
+        inlineScriptLength += (script.content || '').length;
       }
     }
     if (inlineScriptLength) {
@@ -185,25 +184,28 @@ class ScriptTreemapDataAudit extends Audit {
     const bundles = await JsBundles.request(artifacts, context);
     const duplicationByPath = await ModuleDuplication.request(artifacts, context);
 
-    for (const scriptElement of artifacts.ScriptElements) {
-      if (!scriptElement.src) continue;
+    for (const script of artifacts.Scripts) {
+      if (script.url === artifacts.URL.finalUrl) continue; // Handled above.
 
-      const name = scriptElement.src;
-      const bundle = bundles.find(bundle => scriptElement.src === bundle.script.src);
-      const scriptCoverages = artifacts.JsUsage[scriptElement.src] || [];
-      if (!bundle && scriptCoverages.length === 0) {
+      const name = script.url;
+      const bundle = bundles.find(bundle => script.scriptId === bundle.script.scriptId);
+      const scriptCoverage = /** @type {Omit<LH.Crdp.Profiler.ScriptCoverage, "url"> | undefined} */
+        (artifacts.JsUsage[script.scriptId]);
+      if (!bundle && !scriptCoverage) {
         // No bundle and no coverage information, so simply make a single node
         // detailing how big the script is.
 
         nodes.push({
           name,
-          resourceBytes: scriptElement.content?.length || 0,
+          resourceBytes: script.length || 0,
         });
         continue;
       }
 
-      const unusedJavascriptSummary = await UnusedJavaScriptSummary.request(
-        {url: scriptElement.src, scriptCoverages, bundle}, context);
+      const unusedJavascriptSummary = scriptCoverage ?
+        await UnusedJavaScriptSummary.request(
+          {scriptId: script.scriptId, scriptCoverage, bundle}, context) :
+        undefined;
 
       /** @type {LH.Treemap.Node} */
       let node;
@@ -218,7 +220,7 @@ class ScriptTreemapDataAudit extends Audit {
             resourceBytes: bundle.sizes.files[source],
           };
 
-          if (unusedJavascriptSummary.sourcesWastedBytes) {
+          if (unusedJavascriptSummary?.sourcesWastedBytes) {
             sourceData.unusedBytes = unusedJavascriptSummary.sourcesWastedBytes[source];
           }
 
@@ -241,20 +243,19 @@ class ScriptTreemapDataAudit extends Audit {
           const sourceData = {
             resourceBytes: bundle.sizes.unmappedBytes,
           };
-          if (unusedJavascriptSummary.sourcesWastedBytes) {
+          if (unusedJavascriptSummary?.sourcesWastedBytes) {
             sourceData.unusedBytes = unusedJavascriptSummary.sourcesWastedBytes['(unmapped)'];
           }
           sourcesData['(unmapped)'] = sourceData;
         }
 
-        node = this.makeScriptNode(scriptElement.src, bundle.rawMap.sourceRoot || '', sourcesData);
+        node = this.makeScriptNode(script.url, bundle.rawMap.sourceRoot || '', sourcesData);
       } else {
         // No valid source map for this script, so we can only produce a single node.
-
         node = {
           name,
-          resourceBytes: unusedJavascriptSummary.totalBytes,
-          unusedBytes: unusedJavascriptSummary.wastedBytes,
+          resourceBytes: unusedJavascriptSummary?.totalBytes ?? script.length ?? 0,
+          unusedBytes: unusedJavascriptSummary?.wastedBytes,
         };
       }
 

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

@@ -44,22 +44,22 @@ class ValidSourceMaps extends Audit {
       title: str_(UIStrings.title),
       failureTitle: str_(UIStrings.failureTitle),
       description: str_(UIStrings.description),
-      requiredArtifacts: ['ScriptElements', 'SourceMaps', 'URL'],
+      requiredArtifacts: ['Scripts', 'SourceMaps', 'URL'],
     };
   }
 
   /**
    * Returns true if the size of the script exceeds a static threshold.
-   * @param {LH.Artifacts.ScriptElement} scriptElement
+   * @param {LH.Artifacts.Script} script
    * @param {string} finalURL
    * @return {boolean}
    */
-  static isLargeFirstPartyJS(scriptElement, finalURL) {
-    if (scriptElement.content === null) return false;
+  static isLargeFirstPartyJS(script, finalURL) {
+    if (!script.length) return false;
 
-    const isLargeJS = scriptElement.content.length >= LARGE_JS_BYTE_THRESHOLD;
-    const isFirstPartyJS = scriptElement.src ?
-      thirdPartyWeb.isFirstParty(scriptElement.src, thirdPartyWeb.getEntity(finalURL)) : false;
+    const isLargeJS = script.length >= LARGE_JS_BYTE_THRESHOLD;
+    const isFirstPartyJS = script.url ?
+      thirdPartyWeb.isFirstParty(script.url, thirdPartyWeb.getEntity(finalURL)) : false;
 
     return isLargeJS && isFirstPartyJS;
   }
@@ -75,16 +75,14 @@ class ValidSourceMaps extends Audit {
 
     let missingMapsForLargeFirstPartyFile = false;
     const results = [];
-    for (const scriptElement of artifacts.ScriptElements) {
-      if (!scriptElement.src) continue; // TODO: inline scripts, how do they work?
-
-      const sourceMap = SourceMaps.find(m => m.scriptUrl === scriptElement.src);
+    for (const script of artifacts.Scripts) {
+      const sourceMap = SourceMaps.find(m => m.scriptId === script.scriptId);
       const errors = [];
-      const isLargeFirstParty = this.isLargeFirstPartyJS(scriptElement, artifacts.URL.finalUrl);
+      const isLargeFirstParty = this.isLargeFirstPartyJS(script, artifacts.URL.finalUrl);
 
       if (isLargeFirstParty && (!sourceMap || !sourceMap.map)) {
         missingMapsForLargeFirstPartyFile = true;
-        isMissingMapForLargeFirstPartyScriptUrl.add(scriptElement.src);
+        isMissingMapForLargeFirstPartyScriptUrl.add(script.url);
         errors.push({error: str_(UIStrings.missingSourceMapErrorMessage)});
       }
 
@@ -107,7 +105,7 @@ class ValidSourceMaps extends Audit {
 
       if (sourceMap || errors.length) {
         results.push({
-          scriptUrl: scriptElement.src,
+          scriptUrl: script.url,
           sourceMapUrl: sourceMap?.sourceMapUrl,
           subItems: {
             type: /** @type {const} */ ('subitems'),

package/lighthouse-core/audits/violation-audit.js

@@ -31,7 +31,7 @@ class ViolationAudit extends Audit {
     return artifacts.ConsoleMessages
         .filter(entry => entry.url && entry.source === 'violation' && pattern.test(entry.text))
         .map(entry => {
-          const bundle = bundles.find(bundle => bundle.script.src === entry.url);
+          const bundle = bundles.find(bundle => bundle.script.scriptId === entry.scriptId);
           return Audit.makeSourceLocationFromConsoleMessage(entry, bundle);
         })
         .filter(filterUndefined)

package/lighthouse-core/computed/js-bundles.js

@@ -12,14 +12,15 @@ const SDK = require('../lib/cdt/SDK.js');
 /**
  * Calculate the number of bytes contributed by each source file
  * @param {LH.Artifacts.Bundle['map']} map
+ * @param {number} contentLength
  * @param {string} content
  * @return {LH.Artifacts.Bundle['sizes']}
  */
-function computeGeneratedFileSizes(map, content) {
+function computeGeneratedFileSizes(map, contentLength, content) {
   const lines = content.split('\n');
   /** @type {Record<string, number>} */
   const files = {};
-  const totalBytes = content.length;
+  const totalBytes = contentLength;
   let unmappedBytes = totalBytes;
 
   // @ts-expect-error: This function is added in SDK.js. This will eventually be added to CDT.
@@ -78,10 +79,10 @@ function computeGeneratedFileSizes(map, content) {
 
 class JSBundles {
   /**
-   * @param {Pick<LH.Artifacts, 'SourceMaps'|'ScriptElements'>} artifacts
+   * @param {Pick<LH.Artifacts, 'SourceMaps'|'Scripts'>} artifacts
    */
   static async compute_(artifacts) {
-    const {SourceMaps, ScriptElements} = artifacts;
+    const {SourceMaps, Scripts} = artifacts;
 
     /** @type {LH.Artifacts.Bundle[]} */
     const bundles = [];
@@ -89,23 +90,22 @@ class JSBundles {
     // Collate map and script, compute file sizes.
     for (const SourceMap of SourceMaps) {
       if (!SourceMap.map) continue;
-      const {scriptUrl, map: rawMap} = SourceMap;
+      const {scriptId, map: rawMap} = SourceMap;
 
       if (!rawMap.mappings) continue;
 
-      const scriptElement = ScriptElements.find(s => s.src === scriptUrl);
-      if (!scriptElement) continue;
+      const script = Scripts.find(s => s.scriptId === scriptId);
+      if (!script) continue;
 
       const compiledUrl = SourceMap.scriptUrl || 'compiled.js';
       const mapUrl = SourceMap.sourceMapUrl || 'compiled.js.map';
       const map = new SDK.TextSourceMap(compiledUrl, mapUrl, rawMap);
 
-      const content = scriptElement?.content ? scriptElement.content : '';
-      const sizes = computeGeneratedFileSizes(map, content);
+      const sizes = computeGeneratedFileSizes(map, script.length || 0, script.content || '');
 
       const bundle = {
         rawMap,
-        script: scriptElement,
+        script,
         map,
         sizes,
       };
@@ -116,4 +116,4 @@ class JSBundles {
   }
 }
 
-module.exports = makeComputedArtifact(JSBundles, ['ScriptElements', 'SourceMaps']);
+module.exports = makeComputedArtifact(JSBundles, ['Scripts', 'SourceMaps']);