DevTools: do not use CSSMetadata instances for autocompletion

third_party/WebKit/Source/devtools/front_end/sdk/CSSMetadata.js

 /*
  * Copyright (C) 2010 Nikita Vasilyev. All rights reserved.
  * Copyright (C) 2010 Joseph Pecoraro. All rights reserved.
  * Copyright (C) 2010 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
@@ skipping 14 matching lines @@
  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 /**
  * @constructor
- * @param {!Array.<!{name: string, longhands: !Array.<string>}|string>} properties

[lushnikov, 2016/08/05 07:16:33]

The ambiguity here was coming from the WI.CSSMetadata.keywordsForProperty
method,
which returned a CSSMetadata object.

+ * @param {!Array.<!{name: string, longhands: !Array.<string>}>} properties
  */
 WebInspector.CSSMetadata = function(properties)
 {
     this._values = /** !Array.<string> */ ([]);
     this._longhands = {};
     this._shorthands = {};
     for (var i = 0; i < properties.length; ++i) {
         var property = properties[i];
-        if (typeof property === "string") {
-            this._values.push(property);
-            continue;
-        }
         var propertyName = property.name;
         if (!CSS.supports(propertyName, "initial"))
             continue;
         this._values.push(propertyName);
 
         var longhands = properties[i].longhands;
         if (longhands) {
             this._longhands[propertyName] = longhands;
             for (var j = 0; j < longhands.length; ++j) {
                 var longhandName = longhands[j];
@@ skipping 17 matching lines @@
 {
     return !!WebInspector.CSSMetadata._colorAwareProperties[propertyName.toLowerCase()] || WebInspector.CSSMetadata.isCustomProperty(propertyName.toLowerCase());
 }
 
 /**
  * @param {string} propertyName
  * @return {boolean}
  */
 WebInspector.CSSMetadata.isLengthProperty = function(propertyName)
 {
     if (propertyName === "line-height")

[dgozman, 2016/08/05 16:38:21]

toLowerCase

[lushnikov, 2016/08/05 17:12:01]

Done.

         return false;
     if (!WebInspector.CSSMetadata._distancePropertiesKeySet)
         WebInspector.CSSMetadata._distancePropertiesKeySet = WebInspector.CSSMetadata._distanceProperties.keySet();
     return WebInspector.CSSMetadata._distancePropertiesKeySet[propertyName] || propertyName.startsWith("margin") || propertyName.startsWith("padding") || propertyName.indexOf("width") !== -1 || propertyName.indexOf("height") !== -1;
 }
 
 /**
  * @param {string} propertyName
  * @return {boolean}
  */
@@ skipping 27 matching lines @@
 ].keySet();
 
 /**
  * @param {string} name
  * @return {string}
  */
 WebInspector.CSSMetadata.canonicalPropertyName = function(name)
 {
     if (!name || name.length < 9 || name.charAt(0) !== "-")
         return name.toLowerCase();
     var match = name.match(/(?:-webkit-)(.+)/);

[dgozman, 2016/08/05 16:38:21]

toLowerCase

[lushnikov, 2016/08/05 17:12:01]

Done.

-    var propertiesSet = WebInspector.CSSMetadata.cssPropertiesMetainfo.keySet();
-    var hasSupportedProperties = WebInspector.CSSMetadata.cssPropertiesMetainfo._values.length > 0;

[lushnikov, 2016/08/05 07:16:33]

cssPropertiesMetainfo could be empty iff the SupportedCSSProperties.js was not
served (e.g. in hosted mode).
With the new approach for the hosted mode, this is never a case.

-    if (!match || (hasSupportedProperties && !propertiesSet.hasOwnProperty(match[1].toLowerCase())))
+    if (!match || !WebInspector.CSSMetadata.cssPropertiesMetainfo.hasProperty(match[1].toLowerCase()))
         return name.toLowerCase();
     return match[1].toLowerCase();
 }
 
 /**
  * @param {string} propertyName
  * @return {boolean}
  */
 WebInspector.CSSMetadata.isCSSPropertyName = function(propertyName)
 {
+    propertyName = propertyName.toLowerCase();
     if (propertyName.startsWith("-moz-") || propertyName.startsWith("-o-") || propertyName.startsWith("-webkit-") || propertyName.startsWith("-ms-"))
         return true;
-    var hasSupportedProperties = WebInspector.CSSMetadata.cssPropertiesMetainfo._values.length > 0;
-    return !hasSupportedProperties || WebInspector.CSSMetadata.cssPropertiesMetainfo.keySet().hasOwnProperty(propertyName);
+    return WebInspector.CSSMetadata.cssPropertiesMetainfo.hasProperty(propertyName);
 }
 
 /**
  * @param {string} propertyName
  * @return {boolean}
  */
 WebInspector.CSSMetadata.isPropertyInherited = function(propertyName)
 {
     return !!(WebInspector.CSSMetadata.InheritedProperties[WebInspector.CSSMetadata.canonicalPropertyName(propertyName)]
             || WebInspector.CSSMetadata.NonStandardInheritedProperties[propertyName.toLowerCase()]);
@@ skipping 475 matching lines @@
         "difference", "exclusion", "hue", "saturation", "color", "luminosity", "unset"
     ] },
     "background-blend-mode": { values: [
         "normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light",
         "difference", "exclusion", "hue", "saturation", "color", "luminosity", "unset"
     ] },
 }
 
 /**
  * @param {string} propertyName
- * @return {!WebInspector.CSSMetadata}
+ * @return {!Array<string>}
  */
-WebInspector.CSSMetadata.keywordsForProperty = function(propertyName)
+WebInspector.CSSMetadata.propertyValues = function(propertyName)
 {
     var acceptedKeywords = ["inherit", "initial"];
-    var descriptor = WebInspector.CSSMetadata.descriptor(propertyName);
-    if (descriptor && descriptor.values)
-        acceptedKeywords.push.apply(acceptedKeywords, descriptor.values);
+    propertyName = propertyName.toLowerCase();
+    var unprefixedName = propertyName.replace(/^-webkit-/, "");
+    var entry = WebInspector.CSSMetadata._propertyDataMap[propertyName] || WebInspector.CSSMetadata._propertyDataMap[unprefixedName];
+    if (entry && entry.values)
+        acceptedKeywords.pushAll(entry.values);
     if (WebInspector.CSSMetadata.isColorAwareProperty(propertyName)) {
         acceptedKeywords.push("currentColor");
         for (var color in WebInspector.Color.Nicknames)
             acceptedKeywords.push(color);
     }
-    return new WebInspector.CSSMetadata(acceptedKeywords);
-}
-
-/**
- * @param {string} propertyName
- * @return {?Object}
- */
-WebInspector.CSSMetadata.descriptor = function(propertyName)
-{
-    if (!propertyName)
-        return null;
-    var unprefixedName = propertyName.replace(/^-webkit-/, "");
-    propertyName = propertyName.toLowerCase();
-    var entry = WebInspector.CSSMetadata._propertyDataMap[propertyName];
-    if (!entry && unprefixedName !== propertyName)
-        entry = WebInspector.CSSMetadata._propertyDataMap[unprefixedName];
-    return entry || null;
+    return acceptedKeywords.sort();
 }
 
 WebInspector.CSSMetadata.initializeWithSupportedProperties = function(properties)
 {
     WebInspector.CSSMetadata.cssPropertiesMetainfo = new WebInspector.CSSMetadata(properties);
 }
 
 // Weight of CSS properties based on their usage from https://www.chromestatus.com/metrics/css/popularity
 WebInspector.CSSMetadata.Weight = {
     "align-content": 57,
@@ skipping 245 matching lines @@
     "width": 268,
     "will-change": 74,
     "word-break": 166,
     "word-spacing": 157,
     "word-wrap": 197,
     "writing-mode": 41,
     "z-index": 239,
     "zoom": 200
 };
 
+/**
+ * @param {!Array.<string>} properties
+ * @return {number}
+ */
+WebInspector.CSSMetadata.mostUsedProperty = function(properties)
+{
+    var maxWeight = 0;
+    var index = 0;
+    for (var i = 0; i < properties.length; i++) {
+        var weight = WebInspector.CSSMetadata.Weight[properties[i]];
+        if (!weight)
+            weight = WebInspector.CSSMetadata.Weight[WebInspector.CSSMetadata.canonicalPropertyName(properties[i])];
+        if (weight > maxWeight) {
+            maxWeight = weight;
+            index = i;
+        }
+    }
+    return index;
+}
 
 WebInspector.CSSMetadata.prototype = {
     /**
-     * @param {string} prefix
-     * @return {!Array.<string>}
+     * @return {!Array<string>}
      */
-    startsWith: function(prefix)
+    allProperties: function()
     {
-        var firstIndex = this._firstIndexOfPrefix(prefix);

[lushnikov, 2016/08/05 07:16:33]

this implementation of startsWith pretends to be fast for no good reason:
maximum length of _values array is <400 elements.

-        if (firstIndex === -1)
-            return [];
-
-        var results = [];
-        while (firstIndex < this._values.length && this._values[firstIndex].startsWith(prefix))
-            results.push(this._values[firstIndex++]);
-        return results;
+        return this._values;
     },
 
     /**
-     * @param {!Array.<string>} properties
-     * @return {number}
+     * @param {string} propertyName
+     * @return {boolean}
      */
-    mostUsedOf: function(properties)

[lushnikov, 2016/08/05 07:16:33]

renamed into WI.CSSMetadata.mostUserProperty

+    hasProperty: function(propertyName)
     {
-        var maxWeight = 0;
-        var index = 0;
-        for (var i = 0; i < properties.length; i++) {
-            var weight = WebInspector.CSSMetadata.Weight[properties[i]];
-            if (!weight)
-                weight = WebInspector.CSSMetadata.Weight[WebInspector.CSSMetadata.canonicalPropertyName(properties[i])];
-            if (weight > maxWeight) {
-                maxWeight = weight;
-                index = i;
-            }
-        }
-        return index;
-    },
-
-    _firstIndexOfPrefix: function(prefix)
-    {
-        if (!this._values.length)
-            return -1;
-        if (!prefix)
-            return 0;
-
-        var maxIndex = this._values.length - 1;
-        var minIndex = 0;
-        var foundIndex;
-
-        do {
-            var middleIndex = (maxIndex + minIndex) >> 1;
-            if (this._values[middleIndex].startsWith(prefix)) {
-                foundIndex = middleIndex;
-                break;
-            }
-            if (this._values[middleIndex] < prefix)
-                minIndex = middleIndex + 1;
-            else
-                maxIndex = middleIndex - 1;
-        } while (minIndex <= maxIndex);
-
-        if (foundIndex === undefined)
-            return -1;
-
-        while (foundIndex && this._values[foundIndex - 1].startsWith(prefix))
-            foundIndex--;
-
-        return foundIndex;
+        if (!this._valuesSet)
+            this._valuesSet = new Set(this._values);
+        return this._valuesSet.has(propertyName);
     },
 
     /**
-     * @return {!Object.<string, boolean>}
-     */
-    keySet: function()
-    {
-        if (!this._keySet)
-            this._keySet = this._values.keySet();
-        return this._keySet;
-    },
-
-    /**
-     * @param {string} str
-     * @param {string} prefix
-     * @return {string}
-     */
-    next: function(str, prefix)

[lushnikov, 2016/08/05 07:16:33]

next, previoius, _closest: dead code

-    {
-        return this._closest(str, prefix, 1);
-    },
-
-    /**
-     * @param {string} str
-     * @param {string} prefix
-     * @return {string}
-     */
-    previous: function(str, prefix)
-    {
-        return this._closest(str, prefix, -1);
-    },
-
-    /**
-     * @param {string} str
-     * @param {string} prefix
-     * @param {number} shift
-     * @return {string}
-     */
-    _closest: function(str, prefix, shift)
-    {
-        if (!str)
-            return "";
-
-        var index = this._values.indexOf(str);
-        if (index === -1)
-            return "";
-
-        if (!prefix) {
-            index = (index + this._values.length + shift) % this._values.length;
-            return this._values[index];
-        }
-
-        var propertiesWithPrefix = this.startsWith(prefix);
-        var j = propertiesWithPrefix.indexOf(str);
-        j = (j + propertiesWithPrefix.length + shift) % propertiesWithPrefix.length;
-        return propertiesWithPrefix[j];
-    },
-
-    /**
      * @param {string} shorthand
      * @return {?Array.<string>}
      */
     longhands: function(shorthand)

[dgozman, 2016/08/05 16:38:21]

Let's follow up with lazy cssMetadata() and all instance methods.

[lushnikov, 2016/08/05 17:12:01]

Sounds good

     {
         return this._longhands[shorthand];
     },
 
     /**
      * @param {string} longhand
      * @return {?Array.<string>}
      */
     shorthands: function(longhand)
     {
         return this._shorthands[longhand];
     }
 }
 
-WebInspector.CSSMetadata.initializeWithSupportedProperties([]);
+WebInspector.CSSMetadata.initializeWithSupportedProperties([]);