ITMLKit Inspector: Computed Style Box Model section throws exceptions
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 20 Dec 2018 20:05:34 +0000 (20:05 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 20 Dec 2018 20:05:34 +0000 (20:05 +0000)
https://bugs.webkit.org/show_bug.cgi?id=192911
<rdar://problem/46861112>

Patch by Joseph Pecoraro <pecoraro@apple.com> on 2018-12-20
Reviewed by Matt Baker.

* UserInterface/Views/BoxModelDetailsSectionRow.js:
(WI.BoxModelDetailsSectionRow.prototype._updateMetrics.createBoxPartElement):
(WI.BoxModelDetailsSectionRow.prototype._updateMetrics.createContentAreaElement):
(WI.BoxModelDetailsSectionRow.prototype._updateMetrics):
ITMLKit doesn't always provide a display/position/width/height etc properties.
Protect against this, and just show an empty message in the box model section
if those properties do not exist.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@239459 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js

index 6c0ae38..b4d500d 100644 (file)
@@ -1,3 +1,19 @@
+2018-12-20  Joseph Pecoraro  <pecoraro@apple.com>
+
+        ITMLKit Inspector: Computed Style Box Model section throws exceptions
+        https://bugs.webkit.org/show_bug.cgi?id=192911
+        <rdar://problem/46861112>
+
+        Reviewed by Matt Baker.
+
+        * UserInterface/Views/BoxModelDetailsSectionRow.js:
+        (WI.BoxModelDetailsSectionRow.prototype._updateMetrics.createBoxPartElement):
+        (WI.BoxModelDetailsSectionRow.prototype._updateMetrics.createContentAreaElement):
+        (WI.BoxModelDetailsSectionRow.prototype._updateMetrics):
+        ITMLKit doesn't always provide a display/position/width/height etc properties.
+        Protect against this, and just show an empty message in the box model section
+        if those properties do not exist.
+
 2018-12-20  Devin Rousso  <drousso@apple.com>
 
         Web Inspector: UIString should take an optional key and description to aid localization
index aaac904..9441b2a 100644 (file)
@@ -137,7 +137,11 @@ WI.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WI.Detail
         {
             let suffix = this._getComponentSuffix(name);
             let propertyName = (name !== "position" ? name + "-" : "") + side + suffix;
-            let value = style.propertyForName(propertyName).value;
+            let property = style.propertyForName(propertyName);
+            if (!property)
+                return null;
+
+            let value = property.value;
             if (value === "" || (name !== "position" && value === "0px") || (name === "position" && value === "auto"))
                 value = "";
             else
@@ -152,7 +156,11 @@ WI.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WI.Detail
         {
             console.assert(name === "width" || name === "height");
 
-            let size = style.propertyForName(name).value.replace(/px$/, "");
+            let property = style.propertyForName(name);
+            if (!property)
+                return null;
+
+            let size = property.value.replace(/px$/, "");
             if (style.propertyForName("box-sizing").value === "border-box") {
                 let borderBox = this._getBox(style, "border");
                 let paddingBox = this._getBox(style, "padding");
@@ -197,16 +205,24 @@ WI.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WI.Detail
             return;
         }
 
+        let displayProperty = style.propertyForName("display");
+        let positionProperty = style.propertyForName("position");
+        if (!displayProperty || !positionProperty) {
+            this.showEmptyMessage();
+            return;
+        }
+
         var previousBox = null;
         for (let name of ["content", "padding", "border", "margin", "position"]) {
-            if (name === "margin" && noMarginDisplayType[style.propertyForName("display").value])
+
+            if (name === "margin" && noMarginDisplayType[displayProperty.value])
                 continue;
-            if (name === "padding" && noPaddingDisplayType[style.propertyForName("display").value])
+            if (name === "padding" && noPaddingDisplayType[displayProperty.value])
                 continue;
-            if (name === "position" && noPositionType[style.propertyForName("position").value])
+            if (name === "position" && noPositionType[positionProperty.value])
                 continue;
 
-            var boxElement = document.createElement("div");
+            let boxElement = document.createElement("div");
             boxElement.className = name;
             boxElement._name = name;
             boxElement.addEventListener("mouseover", this._highlightDOMNode.bind(this, true, name === "position" ? "all" : name), false);
@@ -215,23 +231,37 @@ WI.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WI.Detail
             if (name === "content") {
                 let widthElement = createContentAreaElement.call(this, "width");
                 let heightElement = createContentAreaElement.call(this, "height");
+                if (!widthElement || !heightElement) {
+                    this.showEmptyMessage();
+                    return;
+                }
+
                 boxElement.append(widthElement, " \u00D7 ", heightElement);
             } else {
-                var labelElement = document.createElement("div");
+                let topElement = createBoxPartElement.call(this, name, "top");
+                let leftElement = createBoxPartElement.call(this, name, "left");
+                let rightElement = createBoxPartElement.call(this, name, "right");
+                let bottomElement = createBoxPartElement.call(this, name, "bottom");
+                if (!topElement || !leftElement || !rightElement || !bottomElement) {
+                    this.showEmptyMessage();
+                    return;
+                }
+
+                let labelElement = document.createElement("div");
                 labelElement.className = "label";
                 labelElement.textContent = name;
                 boxElement.appendChild(labelElement);
 
-                boxElement.appendChild(createBoxPartElement.call(this, name, "top"));
+                boxElement.appendChild(topElement);
                 boxElement.appendChild(document.createElement("br"));
-                boxElement.appendChild(createBoxPartElement.call(this, name, "left"));
+                boxElement.appendChild(leftElement);
 
                 if (previousBox)
                     boxElement.appendChild(previousBox);
 
-                boxElement.appendChild(createBoxPartElement.call(this, name, "right"));
+                boxElement.appendChild(rightElement);
                 boxElement.appendChild(document.createElement("br"));
-                boxElement.appendChild(createBoxPartElement.call(this, name, "bottom"));
+                boxElement.appendChild(bottomElement);
             }
 
             previousBox = boxElement;