Bug 1475947 - (Part 2) Update font editor unit conversion to use getOwnerGlobalDimensions(). r=gl

MozReview-Commit-ID: A9efHXiMs46

--HG--
extra : rebase_source : 5de4e66f6ead40e02f08e6cf8fc742ed2955b120

devtools/client/inspector/fonts/fonts.js

@@ -178,8 +178,6 @@ class FontInspector {
     let out = value;
     // Computed style for reference node used for conversion of "em", "rem", "%".
     let computedStyle;
-    // Raw DOM node of selected element used for conversion of "vh", "vw", "vmin", "vmax".
-    let rawNode;
 
     if (unit === "in") {
       out = fromPx
@@ -233,36 +231,31 @@ class FontInspector {
         : value * parseFloat(computedStyle["font-size"].value);
     }
 
-    if (unit === "vh") {
+    if (unit === "vh" || unit === "vw" || unit === "vmin" || unit === "vmax") {
-      rawNode = await node.rawNode();
+      const dim = await node.getOwnerGlobalDimensions();
-      out = fromPx
-        ? value * 100 / rawNode.ownerGlobal.innerHeight
-        : value / 100 * rawNode.ownerGlobal.innerHeight;
-    }
 
-    if (unit === "vw") {
+      // The getOwnerGlobalDimensions() method does not exist on the NodeFront API spec
-      rawNode = await node.rawNode();
+      // prior to Firefox 63. In that case, return a 1-to-1 conversion which isn't a
-      out = fromPx
+      // correct conversion, but doesn't break the font editor either.
-        ? value * 100 / rawNode.ownerGlobal.innerWidth
+      if (!dim || !dim.innerWidth || !dim.innerHeight) {
-        : value / 100 * rawNode.ownerGlobal.innerWidth;
+        out = value;
-    }
+      } else if (unit === "vh") {
-
+        out = fromPx
-    if (unit === "vmin") {
+          ? value * 100 / dim.innerHeight
-      rawNode = await node.rawNode();
+          : value / 100 * dim.innerHeight;
-      out = fromPx
+      } else if (unit === "vw") {
-        ? value * 100 / Math.min(
+        out = fromPx
-          rawNode.ownerGlobal.innerWidth, rawNode.ownerGlobal.innerHeight)
+          ? value * 100 / dim.innerWidth
-        : value / 100 * Math.min(
+          : value / 100 * dim.innerWidth;
-          rawNode.ownerGlobal.innerWidth, rawNode.ownerGlobal.innerHeight);
+      } else if (unit === "vmin") {
-    }
+        out = fromPx
-
+          ? value * 100 / Math.min(dim.innerWidth, dim.innerHeight)
-    if (unit === "vmax") {
+          : value / 100 * Math.min(dim.innerWidth, dim.innerHeight);
-      rawNode = await node.rawNode();
+      } else if (unit === "vmax") {
-      out = fromPx
+        out = fromPx
-        ? value * 100 / Math.max(
+          ? value * 100 / Math.max(dim.innerWidth, dim.innerHeight)
-          rawNode.ownerGlobal.innerWidth, rawNode.ownerGlobal.innerHeight)
+          : value / 100 * Math.max(dim.innerWidth, dim.innerHeight);
-        : value / 100 * Math.max(
+      }
-          rawNode.ownerGlobal.innerWidth, rawNode.ownerGlobal.innerHeight);
     }
 
     // Return rounded pixel values. Limit other values to 3 decimals.
@@ -728,12 +721,8 @@ class FontInspector {
       let unit = fromUnit;
 
       if (toUnit && fromUnit) {
-        try {
+        value = await this.convertUnits(value, fromUnit, toUnit);
-          value = await this.convertUnits(value, fromUnit, toUnit);
+        unit = toUnit;
-          unit = toUnit;
-        } catch (err) {
-          // Silent error
-        }
       }
 
       this.onFontPropertyUpdate(property, value, unit);