DevTools: [CSS] report matched selectors for pseudoId matches

LayoutTests/inspector/elements/styles/pseudo-elements-expected.txt

 Tests that pseudo elements and their styles are handled properly.
 
 
 Running: dumpOriginalTree
 Original elements tree:
 - <div id="container">
     - <div id="inspected">
           ::before
           "Text"
           ::after
@@ skipping 10 matching lines @@
 [expanded] 
 element.style  { ()
 
 [expanded] 
 [$div$]  { (user agent stylesheet)
 display: block;
 
 
 ======== Pseudo ::before element ========
 [expanded] 
-#inspected:before  { (pseudo-elements.html:4 -> pseudo-elements.html:4:1)
+[$#inspected:before$]  { (pseudo-elements.html:4 -> pseudo-elements.html:4:1)

[vsevik, 2014/11/05 07:09:26]

Let's put two selectors separated with comma here to show that we only match one
of them.

[lushnikov, 2014/11/05 07:41:13]

Done.

 content: "BEFORE";
 
 
 ======== Pseudo ::after element ========
 [expanded] 
-#inspected:after  { (pseudo-elements.html:8 -> pseudo-elements.html:8:1)
+[$#inspected:after$]  { (pseudo-elements.html:8 -> pseudo-elements.html:8:1)
 content: "AFTER";
 
 
 
 Running: dumpBeforeStyles
 [expanded] 
 
 [expanded] 
 [$#inspected:before$]  { (pseudo-elements.html:4 -> pseudo-elements.html:4:1)
 content: "BEFORE";
@@ skipping 91 matching lines @@
 Running: removeNodeAndCheckPseudoElementsUnbound
 - <div id="container">
     - <div id="empty">
           ::before
           ::after
       </div>
   </div>
 inspected:before DOMNode in DOMAgent: false
 inspected:after DOMNode in DOMAgent: false