DevTools: simplify & fix property overload logic

Source/devtools/front_end/elements/StylesSectionModel.js

Index: Source/devtools/front_end/elements/StylesSectionModel.js
diff --git a/Source/devtools/front_end/elements/StylesSectionModel.js b/Source/devtools/front_end/elements/StylesSectionModel.js
index b28723ed2aaf8a027688ad22ae47f7eafcd56426..2fbe3c46ffff3dfe8911620c227e835b3a6bb2a7 100644
--- a/Source/devtools/front_end/elements/StylesSectionModel.js
+++ b/Source/devtools/front_end/elements/StylesSectionModel.js
@@ -157,44 +157,19 @@ WebInspector.StylesSectionModel.prototype = {
     },
 
     /**
-     * @return {!Set.<string>}
-     */
-    usedProperties: function()
-    {
-        return this._cascade._usedPropertiesForModel(this);
-    },
-
-    /**
      * @param {string} propertyName
-     * @param {boolean=} isShorthand
      * @return {boolean}
      */
-    isPropertyOverloaded: function(propertyName, isShorthand)
+    isPropertyOverloaded: function(propertyName)
     {
         if (!this.hasMatchingSelectors())
             return false;
-
-        if (this.inherited() && !WebInspector.CSSMetadata.isPropertyInherited(propertyName)) {
-            // In the inherited sections, only show overrides for the potentially inherited properties.
+        if (this.inherited() && !WebInspector.CSSMetadata.isPropertyInherited(propertyName))
             return false;
-        }
 
+        var usedProperties = this._cascade._usedPropertiesForModel(this);
         var canonicalName = WebInspector.CSSMetadata.canonicalPropertyName(propertyName);
-        var used = this.usedProperties().has(canonicalName);
-        if (used || !isShorthand)
-            return !used;
-
-        // Find out if any of the individual longhand properties of the shorthand
-        // are used, if none are then the shorthand is overloaded too.
-        var longhandProperties = this.style().longhandProperties(propertyName);
-        for (var j = 0; j < longhandProperties.length; ++j) {
-            var individualProperty = longhandProperties[j];
-            var canonicalPropertyName = WebInspector.CSSMetadata.canonicalPropertyName(individualProperty.name);
-            if (this.usedProperties().has(canonicalPropertyName))
-                return false;
-        }
-
-        return true;
+        return !usedProperties.has(canonicalName);
     }
 }
 
@@ -360,6 +335,25 @@ WebInspector.SectionCascade._computeUsedProperties = function(styleRules, allUse
             allUsedProperties.add(canonicalName);
             propertyToEffectiveRule.set(canonicalName, styleRuleUsedProperties);
         }
+
+        // If every longhand of the shorthand is not active, then the shorthand is not active too.
+        for (var property of style.leadingProperties()) {

[pfeldman, 2015/08/26 01:32:38]

I think we should stop doing this and implement it on the backend. Otherwise,
these are just the parts of the logic that won't be needed.

[lushnikov, 2015/08/26 01:35:44]

We will still have leadingProperties when your changes are implemented.
Anyway, this is the last piece which was blocking the revert of CSSP

+            var canonicalName = WebInspector.CSSMetadata.canonicalPropertyName(property.name);
+            if (!styleRuleUsedProperties.has(canonicalName))
+                continue;
+            var longhands = style.longhandProperties(property.name);
+            if (!longhands.length)
+                continue;
+            var notUsed = true;
+            for (var longhand of longhands) {
+                var longhandCanonicalName = WebInspector.CSSMetadata.canonicalPropertyName(longhand.name);
+                notUsed = notUsed && !styleRuleUsedProperties.has(longhandCanonicalName);
+            }
+            if (!notUsed)
+                continue;
+            styleRuleUsedProperties.delete(canonicalName);
+            allUsedProperties.delete(canonicalName);
+        }
     }
     return stylesUsedProperties;
 }