DevTools: move search in styles out of experimental. It proved to be stable.

Source/devtools/front_end/StylesSidebarPane.js

 /*
  * Copyright (C) 2007 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 168 matching lines @@
         contextMenu.appendApplicableItems(/** @type {!Node} */ (event.target));
         contextMenu.show();
     },
 
     /**
      * @param {!Element} matchedStylesElement
      * @param {!Element} computedStylesElement
      */
     setFilterBoxContainers: function(matchedStylesElement, computedStylesElement)
     {
-        if (!WebInspector.experimentsSettings.cssStyleSearch.isEnabled())
-            return;
-
         matchedStylesElement.appendChild(this._createCSSFilterControl());
         this._computedStylePane.setFilterBoxContainer(computedStylesElement);
     },
 
     /**
      * @return {!Element}
      */
     _createCSSFilterControl: function()
     {
         var filterInput = this._createPropertyFilterElement(false, searchHandler.bind(this));
 
         /**
          * @param {?RegExp} regex
          * @this {WebInspector.StylesSidebarPane}
          */
         function searchHandler(regex)
         {
             this._filterRegex = regex;
         }
 
-        filterInput.addEventListener("keydown", tabHandler.bind(this), false);
-
-        /**
-         * @param {?Event} event
-         * @this {WebInspector.StylesSidebarPane}
-         */
-        function tabHandler(event)
-        {
-            if (event.keyIdentifier !== "U+0009")
-                return;
-
-            event.consume(true);
-            var firstSection = this.sections[0][1];
-            if (!firstSection)
-                return;
-            firstSection._moveEditorFromSelector(event.shiftKey ? "backward" : "forward");
-        }
         return filterInput;
     },
 
     get _forcedPseudoClasses()
     {
         return this.node ? (this.node.getUserProperty("pseudoState") || undefined) : undefined;
     },
 
     _updateForcedPseudoStateInputs: function()
     {
@@ skipping 646 matching lines @@
     /**
      * @param {boolean} isComputedStyleFilter
      * @return {!Element}
      * @param {function(?RegExp)} filterCallback
      */
     _createPropertyFilterElement: function(isComputedStyleFilter, filterCallback)
     {
         var input = document.createElement("input");
         input.type = "text";
         input.placeholder = isComputedStyleFilter ? WebInspector.UIString("Filter") : WebInspector.UIString("Find in Styles");
-        input.className = "filter-box toolbar-search-control search-replace";
         var boundSearchHandler = searchHandler.bind(this);
 
         /**
          * @this {WebInspector.StylesSidebarPane}
          */
         function searchHandler()
         {
             var regex = input.value ? new RegExp(input.value.escapeForRegExp(), "i") : null;
             filterCallback(regex);
+            input.parentNode.classList.toggle("styles-filter-engaged", !!input.value);
             this._updateFilter(isComputedStyleFilter);
         }
         input.addEventListener("input", boundSearchHandler, false);
 
         /**
          * @param {?Event} event
          */
         function keydownHandler(event)
         {
             var Esc = "U+001B";
@@ skipping 12 matching lines @@
      * @param {boolean} isComputedStyleFilter
      */
     _updateFilter: function(isComputedStyleFilter)
     {
         for (var pseudoId in this.sections) {
             var sections = this.sections[pseudoId];
             for (var i = 0; i < sections.length; ++i) {
                 var section = sections[i];
                 if (isComputedStyleFilter !== !!section.computedStyle)
                     continue;
-                section.updateFilter();
+                section._updateFilter();
             }
         }
     },
 
     /**
      * @param {!WebInspector.Event} event
      */
     _showUserAgentStylesSettingChanged: function(event)
     {
         var showStyles = /** @type {boolean} */ (event.data);
@@ skipping 416 matching lines @@
             if (shorthandPropertyAvailable)
                 continue;  // Shorthand for the property found.
 
             var inherited = this.isPropertyInherited(property.name);
             var overloaded = property.inactive || this.isPropertyOverloaded(property.name, isShorthand);
             var item = new WebInspector.StylePropertyTreeElement(this._parentPane, this.styleRule, style, property, isShorthand, inherited, overloaded);
             this.propertiesTreeOutline.appendChild(item);
         }
     },
 
-    updateFilter: function()
+    _updateFilter: function()
     {
+        if (this.styleRule.isAttribute)
+            return;
+        var regex = this._parentPane.filterRegex();
+        var hideRule = regex && !regex.test(this.element.textContent);
+        this.element.classList.toggle("hidden", hideRule);
+        if (hideRule)
+            return;
+
         var children = this.propertiesTreeOutline.children;
         for (var i = 0; i < children.length; ++i)
-            children[i].updateFilter();
+            children[i]._updateFilter();
 
         if (this.styleRule.rule)
             this._markSelectorHighlights();
     },
 
     _markSelectorMatches: function()
     {
         var rule = this.styleRule.rule;
         if (!rule)
             return;
@@ skipping 340 matching lines @@
         this._expandedPropertyNames = {};
         for (var name in this._propertyTreeElements) {
             if (this._propertyTreeElements[name].expanded)
                 this._expandedPropertyNames[name] = true;
         }
         this._propertyTreeElements = {};
         this.propertiesTreeOutline.removeChildren();
         this.populated = false;
     },
 
-    updateFilter: function()
+    _updateFilter: function()
     {
         var children = this.propertiesTreeOutline.children;
         for (var i = 0; i < children.length; ++i)
-            children[i].updateFilter();
+            children[i]._updateFilter();
     },
 
     onpopulate: function()
     {
         function sorter(a, b)
         {
             return a.name.compareTo(b.name);
         }
 
         var style = this.styleRule.style;
@@ skipping 389 matching lines @@
         if (!this.parsedOk) {
             // Avoid having longhands under an invalid shorthand.
             this.hasChildren = false;
             this.listItemElement.classList.add("not-parsed-ok");
 
             // Add a separate exclamation mark IMG element with a tooltip.
             this.listItemElement.insertBefore(WebInspector.StylesSidebarPane.createExclamationMark(this.property), this.listItemElement.firstChild);
         }
         if (this.property.inactive)
             this.listItemElement.classList.add("inactive");
-        this.updateFilter();
+        this._updateFilter();
     },
 
-    updateFilter: function()
+    _updateFilter: function()
     {
         var regEx = this.parentPane().filterRegex();
         this.listItemElement.classList.toggle("filter-match", !!regEx && (regEx.test(this.property.name) || regEx.test(this.property.value)));
     },
 
     /**
      * @param {!Element} nameElement
      * @param {!Element} valueElement
      * @param {string} text
      */
@@ skipping 222 matching lines @@
     },
 
     /**
      * @return {!WebInspector.ComputedStyleSidebarPane}
      */
     parentPane: function()
     {
         return this._stylesPane._computedStylePane;
     },
 
-    updateFilter: function()
+    _updateFilter: function()
     {
         var regEx = this.parentPane().filterRegex();
         this.listItemElement.classList.toggle("hidden", !!regEx && (!regEx.test(this.property.name) && !regEx.test(this.property.value)));
     },
 
     __proto__: WebInspector.StylePropertyTreeElementBase.prototype
 }
 
 /**
  * @constructor
@@ skipping 841 matching lines @@
             return;
         }
 
         var results = this._cssCompletions.startsWith(prefix);
         var selectedIndex = this._cssCompletions.mostUsedOf(results);
         completionsReadyCallback(results, selectedIndex);
     },
 
     __proto__: WebInspector.TextPrompt.prototype
 }