lighthouse 9.5.0-dev.20220314 → 9.5.0-dev.20220317

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

@@ -52,6 +52,7 @@ import pwaSvgomg from './test-definitions/pwa-svgomg.js';
 import redirectsClientPaintServer from './test-definitions/redirects-client-paint-server.js';
 import redirectsHistoryPushState from './test-definitions/redirects-history-push-state.js';
 import redirectsMultipleServer from './test-definitions/redirects-multiple-server.js';
+import redirectScripts from './test-definitions/redirects-scripts.js';
 import redirectsSingleClient from './test-definitions/redirects-single-client.js';
 import redirectsSingleServer from './test-definitions/redirects-single-server.js';
 import redirectsSelf from './test-definitions/redirects-self.js';
@@ -112,6 +113,7 @@ const smokeTests = [
   redirectsClientPaintServer,
   redirectsHistoryPushState,
   redirectsMultipleServer,
+  redirectScripts,
   redirectsSingleClient,
   redirectsSingleServer,
   redirectsSelf,

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

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

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

@@ -11,8 +11,8 @@
 
 const ByteEfficiencyAudit = require('./byte-efficiency-audit.js');
 const ModuleDuplication = require('../../computed/module-duplication.js');
-const NetworkAnalyzer = require('../../lib/dependency-graph/simulator/network-analyzer.js');
 const i18n = require('../../lib/i18n/i18n.js');
+const {getRequestForScript} = require('../../lib/script-helpers.js');
 
 const UIStrings = {
   /** Imperative title of a Lighthouse audit that tells the user to remove duplicate JavaScript from their code. This is displayed in a list of audit titles that Lighthouse generates. */
@@ -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;
@@ -130,7 +130,6 @@ class DuplicatedJavascript extends ByteEfficiencyAudit {
       context.options?.ignoreThresholdInBytes || IGNORE_THRESHOLD_IN_BYTES;
     const duplication =
       await DuplicatedJavascript._getDuplicationGroupedByNodeModules(artifacts, context);
-    const mainDocumentRecord = NetworkAnalyzer.findOptionalMainDocument(networkRecords);
 
     /** @type {Map<string, number>} */
     const transferRatioByUrl = new Map();
@@ -157,22 +156,21 @@ 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);
         if (transferRatio === undefined) {
-          const networkRecord = url === artifacts.URL.finalUrl ?
-            mainDocumentRecord :
-            networkRecords.find(n => n.url === url);
+          const networkRecord = getRequestForScript(networkRecords, script);
 
-          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

@@ -22,7 +22,7 @@ const ByteEfficiencyAudit = require('./byte-efficiency-audit.js');
 const JsBundles = require('../../computed/js-bundles.js');
 const i18n = require('../../lib/i18n/i18n.js');
 const thirdPartyWeb = require('../../lib/third-party-web.js');
-const NetworkAnalyzer = require('../../lib/dependency-graph/simulator/network-analyzer.js');
+const {getRequestForScript} = require('../../lib/script-helpers.js');
 
 const UIStrings = {
   /** Title of a Lighthouse audit that tells the user about legacy polyfills and transforms used on the page. This is displayed in a list of audit titles that Lighthouse generates. */
@@ -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;
@@ -373,17 +372,14 @@ class LegacyJavascript extends ByteEfficiencyAudit {
     let transferRatio = transferRatioByUrl.get(url);
     if (transferRatio !== undefined) return transferRatio;
 
-    const mainDocumentRecord = NetworkAnalyzer.findOptionalMainDocument(networkRecords);
-    const networkRecord = url === artifacts.URL.finalUrl ?
-      mainDocumentRecord :
-      networkRecords.find(n => n.url === url);
-    const script = artifacts.ScriptElements.find(script => script.src === url);
+    const script = artifacts.Scripts.find(script => script.url === url);
+    const networkRecord = getRequestForScript(networkRecords, script);
 
     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 +411,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 +428,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

@@ -8,6 +8,7 @@
 const ByteEfficiencyAudit = require('./byte-efficiency-audit.js');
 const i18n = require('../../lib/i18n/i18n.js');
 const computeTokenLength = require('../../lib/minification-estimator.js').computeJSTokenLength;
+const {getRequestForScript} = require('../../lib/script-helpers.js');
 
 const UIStrings = {
   /** Imperative title of a Lighthouse audit that tells the user to minify the page’s JS code to reduce file size. This is displayed in a list of audit titles that Lighthouse generates. */
@@ -42,7 +43,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 +79,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 = getRequestForScript(networkRecords, script);
+      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 +95,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

@@ -9,6 +9,7 @@ const ByteEfficiencyAudit = require('./byte-efficiency-audit.js');
 const UnusedJavaScriptSummary = require('../../computed/unused-javascript-summary.js');
 const JsBundles = require('../../computed/js-bundles.js');
 const i18n = require('../../lib/i18n/i18n.js');
+const {getRequestForScript} = require('../../lib/script-helpers.js');
 
 const UIStrings = {
   /** Imperative title of a Lighthouse audit that tells the user to reduce JavaScript that is never evaluated during page load. This is displayed in a list of audit titles that Lighthouse generates. */
@@ -67,7 +68,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 +87,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 = getRequestForScript(networkRecords, script);
       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 +104,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)