DevTools: [SSP] fix matched selector highlight for style rules

Source/devtools/front_end/elements/StylesSidebarPane.js

Index: Source/devtools/front_end/elements/StylesSidebarPane.js
diff --git a/Source/devtools/front_end/elements/StylesSidebarPane.js b/Source/devtools/front_end/elements/StylesSidebarPane.js
index ed1dc52870fc88d5d648aa72c53c0715b2d94a43..dcff37971ff94685848cce62f08ee8a14cf40e3a 100644
--- a/Source/devtools/front_end/elements/StylesSidebarPane.js
+++ b/Source/devtools/front_end/elements/StylesSidebarPane.js
@@ -1445,7 +1445,7 @@ WebInspector.StylePropertiesSection = function(parentPane, styleRule)
     this.propertiesTreeOutline.section = this;
 
     var selectorContainer = createElement("div");
-    this._selectorElement = createElement("span");
+    this._selectorElement = createElementWithClass("span", "selector");
     this._selectorElement.textContent = styleRule.selectorText();
     selectorContainer.appendChild(this._selectorElement);
 
@@ -1839,11 +1839,8 @@ WebInspector.StylePropertiesSection.prototype = {
 
         this._mediaListElement.classList.toggle("media-matches", this.styleRule.mediaMatches());
 
-        // .selector is rendered as non-affecting selector by default.
-        if (!this.styleRule.hasMatchingSelectors()) {
-            this._selectorElement.className = "selector";
+        if (!this.styleRule.hasMatchingSelectors())
             return;
-        }
 
         var selectors = rule.selectors;
         var fragment = createDocumentFragment();