report(xbrowser): replace Typed OM getComputedStyle() with CSSOM equi…

…valent (#5984)

lighthouse-core/report/html/renderer/report-ui-features.js

@@ -130,20 +130,17 @@ class ReportUIFeatures {
 
   _setupHeaderAnimation() {
     const scoresWrapper = this._dom.find('.lh-scores-wrapper', this._document);
-    this.headerOverlap = /** @type {number} */
-      // @ts-ignore - TODO: move off CSSOM to support other browsers
-      (scoresWrapper.computedStyleMap().get('margin-top').value);
-
+    const computedMarginTop = window.getComputedStyle(scoresWrapper).marginTop;
+    this.headerOverlap = parseFloat(computedMarginTop || '0');
     this.headerSticky = this._dom.find('.lh-header-sticky', this._document);
     this.headerBackground = this._dom.find('.lh-header-bg', this._document);
     this.lighthouseIcon = this._dom.find('.lh-lighthouse', this._document);
     this.scoresWrapperBg = this._dom.find('.lh-scores-wrapper__background', this._document);
     this.productInfo = this._dom.find('.lh-product-info', this._document);
     this.toolbar = this._dom.find('.lh-toolbar', this._document);
     this.toolbarMetadata = this._dom.find('.lh-toolbar__metadata', this._document);
-
-    // @ts-ignore - TODO: move off CSSOM to support other browsers
-    this.headerHeight = this.headerBackground.computedStyleMap().get('height').value;
+    const computedHeight = window.getComputedStyle(this.headerBackground).height;
+    this.headerHeight = parseFloat(computedHeight || '0');
 
     this._document.addEventListener('scroll', this.onScroll, {passive: true});