core(tsc): polish switch to new audit-details types (#7285)

GoogleChrome · Feb 21, 2019 · a529731 · a529731
1 parent 6ad2de2
commit a529731
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 44 deletions.
diff --git a/lighthouse-core/audits/byte-efficiency/render-blocking-resources.js b/lighthouse-core/audits/byte-efficiency/render-blocking-resources.js
@@ -189,9 +189,10 @@ class RenderBlockingResources extends Audit {
     const wastedBytesByUrl = new Map();
     try {
       const results = await UnusedCSS.audit(artifacts, context);
-      // @ts-ignore - TODO(bckenny): details types.
-      for (const item of results.details.items) {
-        wastedBytesByUrl.set(item.url, item.wastedBytes);
+      if (results.details && results.details.type === 'opportunity') {
+        for (const item of results.details.items) {
+          wastedBytesByUrl.set(item.url, item.wastedBytes);
+        }
       }
     } catch (_) {}
 

diff --git a/lighthouse-core/audits/byte-efficiency/unused-css-rules.js b/lighthouse-core/audits/byte-efficiency/unused-css-rules.js
@@ -151,8 +151,7 @@ class UnusedCSSRules extends ByteEfficiencyAudit {
     }
 
     const usage = UnusedCSSRules.computeUsage(stylesheetInfo);
-    // @ts-ignore TODO(bckenny): fix index signature on ByteEfficiencyItem.
-    return Object.assign({url}, usage);
+    return {url, ...usage};
   }
 
   /**

diff --git a/lighthouse-core/report/html/renderer/category-renderer.js b/lighthouse-core/report/html/renderer/category-renderer.js
@@ -85,8 +85,7 @@ class CategoryRenderer {
         .appendChild(this.dom.convertMarkdownLinkSnippets(audit.result.description));
 
     const header = /** @type {HTMLDetailsElement} */ (this.dom.find('details', auditEl));
-    if (audit.result.details && audit.result.details.type) {
-      // @ts-ignore TODO(bckenny): fix detailsRenderer.render input type
+    if (audit.result.details) {
       const elem = this.detailsRenderer.render(audit.result.details);
       if (elem) {
         elem.classList.add('lh-details');

diff --git a/lighthouse-core/report/html/renderer/details-renderer.js b/lighthouse-core/report/html/renderer/details-renderer.js
@@ -80,7 +80,7 @@ class DetailsRenderer {
   _renderBytes(details) {
     // TODO: handle displayUnit once we have something other than 'kb'
     const value = Util.formatBytesToKB(details.value, details.granularity);
-    return this._renderText({value});
+    return this._renderText(value);
   }
 
   /**
@@ -93,15 +93,15 @@ class DetailsRenderer {
       value = Util.formatDuration(details.value);
     }
 
-    return this._renderText({value});
+    return this._renderText(value);
   }
 
   /**
-   * @param {{value: string}} text
+   * @param {string} text
    * @return {HTMLElement}
    */
   _renderTextURL(text) {
-    const url = text.value;
+    const url = text;
 
     let displayedPath;
     let displayedHost;
@@ -116,14 +116,10 @@ class DetailsRenderer {
     }
 
     const element = this._dom.createElement('div', 'lh-text__url');
-    element.appendChild(this._renderText({
-      value: displayedPath,
-    }));
+    element.appendChild(this._renderText(displayedPath));
 
     if (displayedHost) {
-      const hostElem = this._renderText({
-        value: displayedHost,
-      });
+      const hostElem = this._renderText(displayedHost);
       hostElem.classList.add('lh-text__url-host');
       element.appendChild(hostElem);
     }
@@ -141,9 +137,7 @@ class DetailsRenderer {
     const url = new URL(details.url);
     if (!allowedProtocols.includes(url.protocol)) {
       // Fall back to just the link text if protocol not allowed.
-      return this._renderText({
-        value: details.text,
-      });
+      return this._renderText(details.text);
     }
 
     const a = this._dom.createElement('a');
@@ -156,33 +150,33 @@ class DetailsRenderer {
   }
 
   /**
-   * @param {{value: string}} text
+   * @param {string} text
    * @return {Element}
    */
   _renderText(text) {
     const element = this._dom.createElement('div', 'lh-text');
-    element.textContent = text.value;
+    element.textContent = text;
     return element;
   }
 
   /**
-   * @param {{value: string}} text
+   * @param {string} text
    * @return {Element}
    */
   _renderNumeric(text) {
     const element = this._dom.createElement('div', 'lh-numeric');
-    element.textContent = text.value;
+    element.textContent = text;
     return element;
   }
 
   /**
    * Create small thumbnail with scaled down image asset.
-   * @param {{value: string}} details
+   * @param {string} details
    * @return {Element}
    */
   _renderThumbnail(details) {
     const element = this._dom.createElement('img', 'lh-thumbnail');
-    const strValue = details.value;
+    const strValue = details;
     element.src = strValue;
     element.title = strValue;
     element.alt = '';
@@ -207,7 +201,7 @@ class DetailsRenderer {
       // The value's type overrides the heading's for this column.
       switch (value.type) {
         case 'code': {
-          return this._renderCode(value);
+          return this._renderCode(value.value);
         }
         case 'link': {
           return this._renderLink(value);
@@ -216,7 +210,7 @@ class DetailsRenderer {
           return this.renderNode(value);
         }
         case 'url': {
-          return this._renderTextURL(value);
+          return this._renderTextURL(value.value);
         }
         default: {
           throw new Error(`Unknown valueType: ${value.type}`);
@@ -232,7 +226,7 @@ class DetailsRenderer {
       }
       case 'code': {
         const strValue = String(value);
-        return this._renderCode({value: strValue});
+        return this._renderCode(strValue);
       }
       case 'ms': {
         const msValue = {
@@ -244,15 +238,15 @@ class DetailsRenderer {
       }
       case 'numeric': {
         const strValue = String(value);
-        return this._renderNumeric({value: strValue});
+        return this._renderNumeric(strValue);
       }
       case 'text': {
         const strValue = String(value);
-        return this._renderText({value: strValue});
+        return this._renderText(strValue);
       }
       case 'thumbnail': {
         const strValue = String(value);
-        return this._renderThumbnail({value: strValue});
+        return this._renderThumbnail(strValue);
       }
       case 'timespanMs': {
         const numValue = Number(value);
@@ -261,10 +255,10 @@ class DetailsRenderer {
       case 'url': {
         const strValue = String(value);
         if (URL_PREFIXES.some(prefix => strValue.startsWith(prefix))) {
-          return this._renderTextURL({value: strValue});
+          return this._renderTextURL(strValue);
         } else {
           // Fall back to <pre> rendering if not actually a URL.
-          return this._renderCode({value: strValue});
+          return this._renderCode(strValue);
         }
       }
       default: {
@@ -387,12 +381,12 @@ class DetailsRenderer {
   }
 
   /**
-   * @param {{value?: string|number}} details
+   * @param {string} text
    * @return {Element}
    */
-  _renderCode(details) {
+  _renderCode(text) {
     const pre = this._dom.createElement('pre', 'lh-code');
-    pre.textContent = /** @type {string} */ (details.value);
+    pre.textContent = text;
     return pre;
   }
 }

diff --git a/lighthouse-core/report/html/renderer/performance-category-renderer.js b/lighthouse-core/report/html/renderer/performance-category-renderer.js
@@ -19,7 +19,6 @@
 /* globals self, Util, CategoryRenderer */
 
 /** @typedef {import('./dom.js')} DOM */
-/** @typedef {LH.Audit.Details.Opportunity} OpportunityDetails */
 
 class PerformanceCategoryRenderer extends CategoryRenderer {
   /**
@@ -66,8 +65,7 @@ class PerformanceCategoryRenderer extends CategoryRenderer {
     if (!audit.result.details || audit.result.scoreDisplayMode === 'error') {
       return element;
     }
-    // TODO(bckenny): remove cast when details is fully discriminated based on `type`.
-    const details = /** @type {OpportunityDetails} */ (audit.result.details);
+    const details = audit.result.details;
     if (details.type !== 'opportunity') {
       return element;
     }
@@ -97,8 +95,7 @@ class PerformanceCategoryRenderer extends CategoryRenderer {
    */
   _getWastedMs(audit) {
     if (audit.result.details && audit.result.details.type === 'opportunity') {
-      // TODO(bckenny): remove cast when details is fully discriminated based on `type`.
-      const details = /** @type {OpportunityDetails} */ (audit.result.details);
+      const details = audit.result.details;
       if (typeof details.overallSavingsMs !== 'number') {
         throw new Error('non-opportunity details passed to _getWastedMs');
       }
@@ -160,7 +157,6 @@ class PerformanceCategoryRenderer extends CategoryRenderer {
     const thumbnailResult = thumbnailAudit && thumbnailAudit.result;
     if (thumbnailResult && thumbnailResult.details) {
       timelineEl.id = thumbnailResult.id;
-      // @ts-ignore TODO(bckenny): fix detailsRenderer.render input type
       const filmstripEl = this.detailsRenderer.render(thumbnailResult.details);
       filmstripEl && timelineEl.appendChild(filmstripEl);
     }

diff --git a/lighthouse-core/report/html/renderer/report-ui-features.js b/lighthouse-core/report/html/renderer/report-ui-features.js
@@ -447,7 +447,6 @@ class ReportUIFeatures {
    */
   getReportHtml() {
     this._resetUIState();
-    // @ts-ignore - technically documentElement can be null, but that's dumb - https://dom.spec.whatwg.org/#document-element
     return this._document.documentElement.outerHTML;
   }