DevTools: simplify & fix property overload logic

Source/devtools/front_end/elements/StylesSectionModel.js

 // Copyright (c) 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @param {!WebInspector.SectionCascade} cascade
  * @param {?WebInspector.CSSRule} rule
  * @param {!WebInspector.CSSStyleDeclaration} style
  * @param {string} customSelectorText
@@ skipping 139 matching lines @@
     {
         this._style = style;
         if (this._rule) {
             style.parentRule = this._rule;
             this._rule.style = style;
         }
         this._cascade._resetUsedProperties();
     },
 
     /**
-     * @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))
+            return false;
 
-        if (this.inherited() && !WebInspector.CSSMetadata.isPropertyInherited(propertyName)) {
-            // In the inherited sections, only show overrides for the potentially inherited properties.
-            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);
     }
 }
 
 /**
  * @constructor
  */
 WebInspector.SectionCascade = function()
 {
     this._models = [];
     this._resetUsedProperties();
@@ skipping 145 matching lines @@
 
                 foundImportantProperties.add(canonicalName);
                 if (isKnownProperty)
                     propertyToEffectiveRule.get(canonicalName).delete(canonicalName);
             }
 
             styleRuleUsedProperties.add(canonicalName);
             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;
 }