From 6dde98c50ec4eaab23d475a5dc1a932f0296af4f Mon Sep 17 00:00:00 2001
From: uchoudh <55554767+uchoudh@users.noreply.github.com>
Date: Fri, 27 Sep 2019 11:45:31 -0400
Subject: [PATCH] core(artifacts): expose id attribute for ScriptElements
 (#9718)

---
 .../test/fixtures/dobetterweb/dbw_tester.html          |  6 +++---
 .../test/smokehouse/dobetterweb/dbw-expectations.js    |  2 +-
 lighthouse-core/gather/gatherers/script-elements.js    |  2 ++
 lighthouse-core/test/results/artifacts/artifacts.json  | 10 ++++++++++
 types/artifacts.d.ts                                   |  2 ++
 5 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html b/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html
index 32e75993292a..308d9eb04484 100644
--- a/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html
+++ b/lighthouse-cli/test/fixtures/dobetterweb/dbw_tester.html
@@ -18,7 +18,7 @@
 
 <!-- AMP-style stylesheet script -->
 <!-- based on https://github.com/ampproject/amphtml/blob/38f1bdf4cc385f9a25cf2979abf215952880b876/src/font-stylesheet-timeout.js#L87-L103 -->
-<script type="text/javascript">
+<script type="text/javascript" id="amp-style-styling-script">
   setTimeout(() => {
     const stylesheet = document.getElementById('amp-style-link');
     stylesheet.media = 'not-matching';
@@ -48,13 +48,13 @@
 <link rel="alternate stylesheet" href="./empty.css">
 
 <!-- FAIL: block rendering -->
-<script src="./dbw_tester.js"></script>
+<script src="./dbw_tester.js" id="dbw-tester-script"></script>
 
 <!-- PASS: 'modules' are deferred by default and don't block rendering -->
 <script type="module" src="./empty_module.js?delay=500"></script>
 
 <!-- FAIL(errors-in-console): exception thrown -->
-<script type="text/javascript">throw new Error('An error');</script>
+<script type="text/javascript" id="error-time">throw new Error('A distinctive error');</script>
 
 <!-- Add non-functional script to appear to be a Wordpress page for Stack Packs. -->
 <script type="example" src="fake-script-wp-includes"></script>
diff --git a/lighthouse-cli/test/smokehouse/dobetterweb/dbw-expectations.js b/lighthouse-cli/test/smokehouse/dobetterweb/dbw-expectations.js
index c6a86c2d975e..d04756bba5f8 100644
--- a/lighthouse-cli/test/smokehouse/dobetterweb/dbw-expectations.js
+++ b/lighthouse-cli/test/smokehouse/dobetterweb/dbw-expectations.js
@@ -109,7 +109,7 @@ module.exports = [
               },
               {
                 source: 'Runtime.exception',
-                description: 'Error: An error\n    at http://localhost:10200/dobetterweb/dbw_tester.html:57:38',
+                description: /^Error: A distinctive error\s+at http:\/\/localhost:10200\/dobetterweb\/dbw_tester.html:\d+:\d+$/,
                 url: 'http://localhost:10200/dobetterweb/dbw_tester.html',
               },
             ],
diff --git a/lighthouse-core/gather/gatherers/script-elements.js b/lighthouse-core/gather/gatherers/script-elements.js
index d68023a5d05e..cb01c66c4331 100644
--- a/lighthouse-core/gather/gatherers/script-elements.js
+++ b/lighthouse-core/gather/gatherers/script-elements.js
@@ -26,6 +26,7 @@ function collectAllScriptElements() {
     return {
       type: script.type || null,
       src: script.src || null,
+      id: script.id || null,
       async: script.async,
       defer: script.defer,
       source: /** @type {'head'|'body'} */ (script.closest('head') ? 'head' : 'body'),
@@ -81,6 +82,7 @@ class ScriptElements extends Gatherer {
             devtoolsNodePath: '',
             type: null,
             src: record.url,
+            id: null,
             async: false,
             defer: false,
             source: 'network',
diff --git a/lighthouse-core/test/results/artifacts/artifacts.json b/lighthouse-core/test/results/artifacts/artifacts.json
index 7c3f04e1811c..c6d9e7ecae8b 100644
--- a/lighthouse-core/test/results/artifacts/artifacts.json
+++ b/lighthouse-core/test/results/artifacts/artifacts.json
@@ -243,6 +243,7 @@
     {
       "type": "text/javascript",
       "src": null,
+      "id": "amp-style-styling-script",
       "async": false,
       "defer": false,
       "source": "head",
@@ -253,6 +254,7 @@
     {
       "type": null,
       "src": "http://localhost:10200/dobetterweb/dbw_tester.js",
+      "id": "dbw-tester-script",
       "async": false,
       "defer": false,
       "source": "head",
@@ -263,6 +265,7 @@
     {
       "type": "module",
       "src": "http://localhost:10200/dobetterweb/empty_module.js?delay=500",
+      "id": null,
       "async": false,
       "defer": false,
       "source": "head",
@@ -273,6 +276,7 @@
     {
       "type": "text/javascript",
       "src": null,
+      "id": "error-time",
       "async": false,
       "defer": false,
       "source": "head",
@@ -283,6 +287,7 @@
     {
       "type": null,
       "src": "http://localhost:10200/dobetterweb/fcp-delayer.js?delay=5000",
+      "id": null,
       "async": false,
       "defer": false,
       "source": "head",
@@ -293,6 +298,7 @@
     {
       "type": null,
       "src": null,
+      "id": null,
       "async": false,
       "defer": false,
       "source": "body",
@@ -303,6 +309,7 @@
     {
       "type": null,
       "src": null,
+      "id": null,
       "async": false,
       "defer": false,
       "source": "body",
@@ -313,6 +320,7 @@
     {
       "type": null,
       "src": null,
+      "id": null,
       "async": false,
       "defer": false,
       "source": "body",
@@ -323,6 +331,7 @@
     {
       "type": null,
       "src": "http://localhost:10200/zone.js",
+      "id": null,
       "async": false,
       "defer": false,
       "source": "body",
@@ -333,6 +342,7 @@
     {
       "type": null,
       "src": "http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js",
+      "id": null,
       "async": false,
       "defer": false,
       "source": "body",
diff --git a/types/artifacts.d.ts b/types/artifacts.d.ts
index 50b188531672..762eb9714a9f 100644
--- a/types/artifacts.d.ts
+++ b/types/artifacts.d.ts
@@ -225,6 +225,8 @@ declare global {
       export interface ScriptElement {
         type: string | null
         src: string | null
+        /** The `id` property of the script element; null if it had no `id` or if `source` is 'network'. */
+        id: string | null
         async: boolean
         defer: boolean
         /** Path that uniquely identifies the node in the DOM */