core: normalize creation of NodeValue

lighthouse-core/audits/accessibility/axe-audit.js

@@ -76,14 +76,8 @@ class AxeAudit extends Audit {
     if (rule && rule.nodes) {
       items = rule.nodes.map(axeNode => ({
         node: {
-          type: /** @type {'node'} */ ('node'),
-          lhId: axeNode.node.lhId,
-          selector: axeNode.node.selector,
-          path: axeNode.node.devtoolsNodePath,
-          snippet: axeNode.node.snippet,
-          boundingRect: axeNode.node.boundingRect,
+          ...Audit.makeNodeValue(axeNode.node),
           explanation: axeNode.failureSummary,
-          nodeLabel: axeNode.node.nodeLabel,
         },
       }));
     }

lighthouse-core/audits/audit.js

@@ -216,6 +216,20 @@ class Audit {
     };
   }
 
+  /**
+   * @param {LH.Artifacts.NodeDetails} node
+   * @return {LH.Audit.Details.NodeValue}
+   */
+  static makeNodeValue(node) {
+    const {devtoolsNodePath, ...rest} = node;
+
+    return {
+      type: 'node',
+      ...rest,
+      path: devtoolsNodePath,
+    };
+  }
+
   /**
    * @param {number|null} score
    * @param {LH.Audit.ScoreDisplayMode} scoreDisplayMode

lighthouse-core/audits/autocomplete.js

@@ -260,11 +260,7 @@ class AutocompleteAudit extends Audit {
           continue;
         }
         failingFormsData.push({
-          node: {
-            type: /** @type {'node'} */ ('node'),
-            snippet: input.node.snippet,
-            nodeLabel: input.node.nodeLabel,
-          },
+          node: Audit.makeNodeValue(input.node),
           suggestion: suggestion,
           current: input.autocomplete.attribute,
         });

lighthouse-core/audits/dobetterweb/dom-size.js

@@ -98,24 +98,12 @@ class DOMSize extends Audit {
         value: stats.totalBodyElements,
       },
       {
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          path: stats.depth.devtoolsNodePath,
-          snippet: stats.depth.snippet,
-          selector: stats.depth.selector,
-          nodeLabel: stats.depth.nodeLabel,
-        },
+        node: Audit.makeNodeValue(stats.depth),
         statistic: str_(UIStrings.statisticDOMDepth),
         value: stats.depth.max,
       },
       {
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          path: stats.width.devtoolsNodePath,
-          snippet: stats.width.snippet,
-          selector: stats.width.selector,
-          nodeLabel: stats.width.nodeLabel,
-        },
+        node: Audit.makeNodeValue(stats.width),
         statistic: str_(UIStrings.statisticDOMWidth),
         value: stats.width.max,
       },

lighthouse-core/audits/dobetterweb/external-anchors-use-rel-noopener.js

@@ -69,13 +69,7 @@ class ExternalAnchorsUseRelNoopenerAudit extends Audit {
       })
       .map(anchor => {
         return {
-          node: {
-            type: /** @type {'node'} */ ('node'),
-            path: anchor.node.devtoolsNodePath || '',
-            selector: anchor.node.selector || '',
-            nodeLabel: anchor.node.nodeLabel || '',
-            snippet: anchor.node.snippet || '',
-          },
+          node: Audit.makeNodeValue(anchor.node),
           href: anchor.href || 'Unknown',
           target: anchor.target || '',
           rel: anchor.rel || '',

lighthouse-core/audits/dobetterweb/password-inputs-can-be-pasted-into.js

@@ -43,13 +43,10 @@ class PasswordInputsCanBePastedIntoAudit extends Audit {
 
     /** @type {LH.Audit.Details.Table['items']} */
     const items = [];
+
     passwordInputsWithPreventedPaste.forEach(input => {
       items.push({
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          snippet: input.node.snippet,
-          path: input.node.devtoolsNodePath,
-        },
+        node: Audit.makeNodeValue(input.node),
       });
     });
 

lighthouse-core/audits/largest-contentful-paint-element.js

@@ -42,15 +42,7 @@ class LargestContentfulPaintElement extends Audit {
     const lcpElementDetails = [];
     if (lcpElement) {
       lcpElementDetails.push({
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          lhId: lcpElement.node.lhId,
-          path: lcpElement.node.devtoolsNodePath,
-          selector: lcpElement.node.selector,
-          nodeLabel: lcpElement.node.nodeLabel,
-          snippet: lcpElement.node.snippet,
-          boundingRect: lcpElement.node.boundingRect,
-        },
+        node: Audit.makeNodeValue(lcpElement.node),
       });
     }
 

lighthouse-core/audits/layout-shift-elements.js

@@ -43,15 +43,7 @@ class LayoutShiftElements extends Audit {
 
     const clsElementData = clsElements.map(element => {
       return {
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          lhId: element.node.lhId,
-          path: element.node.devtoolsNodePath,
-          selector: element.node.selector,
-          nodeLabel: element.node.nodeLabel,
-          snippet: element.node.snippet,
-          boundingRect: element.node.boundingRect,
-        },
+        node: Audit.makeNodeValue(element.node),
         score: element.score,
       };
     });

lighthouse-core/audits/non-composited-animations.js

@@ -129,19 +129,11 @@ class NonCompositedAnimations extends Audit {
       };
     }
 
-    /** @type LH.Audit.Details.TableItem[] */
+    /** @type {LH.Audit.Details.TableItem[]} */
     const results = [];
     let shouldAddAnimationNameColumn = false;
     artifacts.TraceElements.forEach(element => {
       if (element.traceEventType !== 'animation') return;
-      /** @type LH.Audit.Details.NodeValue */
-      const node = {
-        type: 'node',
-        path: element.node.devtoolsNodePath,
-        selector: element.node.selector,
-        nodeLabel: element.node.nodeLabel,
-        snippet: element.node.snippet,
-      };
 
       const animations = element.animations || [];
       const animationReasons = new Map();
@@ -171,7 +163,7 @@ class NonCompositedAnimations extends Audit {
       }
 
       results.push({
-        node,
+        node: Audit.makeNodeValue(element.node),
         subItems: {
           type: 'subitems',
           items: allFailureReasons,

lighthouse-core/audits/seo/crawlable-anchors.js

@@ -81,13 +81,7 @@ class CrawlableAnchors extends Audit {
     /** @type {LH.Audit.Details.Table['items']} */
     const itemsToDisplay = failingAnchors.map(anchor => {
       return {
-        node: {
-          type: 'node',
-          path: anchor.node.devtoolsNodePath || '',
-          selector: anchor.node.selector || '',
-          nodeLabel: anchor.node.nodeLabel || '',
-          snippet: anchor.node.snippet || '',
-        },
+        node: Audit.makeNodeValue(anchor.node),
       };
     });
 

lighthouse-core/audits/seo/hreflang.js

@@ -113,13 +113,17 @@ class Hreflang extends Audit {
       }
 
       if (link.source === 'head') {
-        source = {
-          type: 'node',
-          snippet: `<link rel="alternate" hreflang="${link.hreflang}" href="${link.hrefRaw}" />`,
-          path: link.node !== null ? link.node.devtoolsNodePath : '',
-          selector: link.node !== null ? link.node.selector : '',
-          nodeLabel: link.node !== null ? link.node.nodeLabel : '',
-        };
+        if (link.node) {
+          source = {
+            ...Audit.makeNodeValue(link.node),
+            snippet: `<link rel="alternate" hreflang="${link.hreflang}" href="${link.hrefRaw}" />`,
+          };
+        } else {
+          source = {
+            type: 'node',
+            snippet: `<link rel="alternate" hreflang="${link.hreflang}" href="${link.hrefRaw}" />`,
+          };
+        }
       } else if (link.source === 'headers') {
         source = `Link: <${link.hrefRaw}>; rel="alternate"; hreflang="${link.hreflang}"`;
       }

lighthouse-core/audits/seo/is-crawlable.js

@@ -105,7 +105,7 @@ class IsCrawlable extends Audit {
           if (isBlocking) {
             blockingDirectives.push({
               source: {
-                type: /** @type {'node'} */ ('node'),
+                ...Audit.makeNodeValue(metaRobots.node),
                 snippet: `<meta name="robots" content="${metaRobotsContent}" />`,
               },
             });

lighthouse-core/audits/seo/plugins.js

@@ -146,7 +146,7 @@ class Plugins extends Audit {
 
         return {
           source: {
-            type: /** @type {'node'} */ ('node'),
+            ...Audit.makeNodeValue(plugin.node),
             snippet: `<${tagName}${attributes}>${params}</${tagName}>`,
           },
         };

lighthouse-core/audits/seo/tap-targets.js

@@ -248,13 +248,8 @@ function targetToTableNode(target) {
   const boundingRect = getBoundingRect(target.clientRects);
 
   return {
-    type: 'node',
-    lhId: target.node.lhId,
-    snippet: target.node.snippet,
-    path: target.node.devtoolsNodePath,
-    selector: target.node.selector,
+    ...Audit.makeNodeValue(target.node),
     boundingRect,
-    nodeLabel: target.node.nodeLabel,
   };
 }
 

lighthouse-core/audits/unsized-images.js

@@ -96,15 +96,10 @@ class UnsizedImages extends Audit {
 
       if (isFixedImage || UnsizedImages.isSizedImage(image)) continue;
       const url = URL.elideDataURI(image.src);
+
       unsizedImages.push({
         url,
-        node: {
-          type: /** @type {'node'} */ ('node'),
-          path: image.node.devtoolsNodePath,
-          selector: image.node.selector,
-          nodeLabel: image.node.nodeLabel,
-          snippet: image.node.snippet,
-        },
+        node: Audit.makeNodeValue(image.node),
       });
     }
 

lighthouse-core/gather/gatherers/meta-elements.js

@@ -8,12 +8,18 @@
 const Gatherer = require('./gatherer.js');
 const pageFunctions = require('../../lib/page-functions.js');
 
-/* globals getElementsInDocument */
+/* globals getElementsInDocument getNodeDetails */
 
 /* istanbul ignore next */
 function collectMetaElements() {
-  // @ts-expect-error - getElementsInDocument put into scope via stringification
-  const metas = /** @type {HTMLMetaElement[]} */ (getElementsInDocument('head meta'));
+  const functions = /** @type {typeof pageFunctions} */({
+    // @ts-expect-error - getElementsInDocument put into scope via stringification
+    getElementsInDocument,
+    // @ts-expect-error - getNodeDetails put into scope via stringification
+    getNodeDetails,
+  });
+
+  const metas = /** @type {HTMLMetaElement[]} */ (functions.getElementsInDocument('head meta'));
   return metas.map(meta => {
     /** @param {string} name */
     const getAttribute = name => {
@@ -27,6 +33,7 @@ function collectMetaElements() {
       property: getAttribute('property'),
       httpEquiv: meta.httpEquiv ? meta.httpEquiv.toLowerCase() : undefined,
       charset: getAttribute('charset'),
+      node: functions.getNodeDetails(meta),
     };
   });
 }
@@ -44,7 +51,10 @@ class MetaElements extends Gatherer {
     return driver.evaluate(collectMetaElements, {
       args: [],
       useIsolation: true,
-      deps: [pageFunctions.getElementsInDocument],
+      deps: [
+        pageFunctions.getElementsInDocument,
+        pageFunctions.getNodeDetailsString,
+      ],
     });
   }
 }

lighthouse-core/gather/gatherers/seo/embedded-content.js

@@ -5,16 +5,24 @@
  */
 'use strict';
 
-/* globals getElementsInDocument */
+/* globals getElementsInDocument getNodeDetails */
 
 const Gatherer = require('../gatherer.js');
 const pageFunctions = require('../../../lib/page-functions.js');
 
+/**
+ * @return {LH.Artifacts.EmbeddedContentInfo[]}
+ */
 function getEmbeddedContent() {
+  const functions = /** @type {typeof pageFunctions} */({
+    // @ts-expect-error - getElementsInDocument put into scope via stringification
+    getElementsInDocument,
+    // @ts-expect-error - getNodeDetails put into scope via stringification
+    getNodeDetails,
+  });
+
   const selector = 'object, embed, applet';
-  /** @type {HTMLElement[]} */
-  // @ts-expect-error - getElementsInDocument put into scope via stringification
-  const elements = getElementsInDocument(selector);
+  const elements = functions.getElementsInDocument(selector);
   return elements
     .map(node => ({
       tagName: node.tagName,
@@ -28,6 +36,7 @@ function getEmbeddedContent() {
           name: el.getAttribute('name') || '',
           value: el.getAttribute('value') || '',
         })),
+      node: functions.getNodeDetails(node),
     }));
 }
 
@@ -39,7 +48,10 @@ class EmbeddedContent extends Gatherer {
   afterPass(passContext) {
     return passContext.driver.evaluate(getEmbeddedContent, {
       args: [],
-      deps: [pageFunctions.getElementsInDocument],
+      deps: [
+        pageFunctions.getElementsInDocument,
+        pageFunctions.getNodeDetailsString,
+      ],
     });
   }
 }