Add support for :host-context (#10)

* Add support for host-context

See https://www.html5rocks.com/en/tutorials/webcomponents/shadowdom-201/#toc-style-host

* Add test for :host(.class)

Author: gmaclennan

index.js

@@ -33,6 +33,12 @@ function postcssPrefix (prefix, options) {
         const replacement = Selector.selector()
         replacement.nodes = [prefixNode].concat(selector.clone().nodes)
         selector.replaceWith(replacement)
+      } else if (selector.type === 'pseudo' && selector.value === ':host-context') {
+        const prefixNode = getPrefixNode(prefix)
+        const replacement = Selector.selector()
+        const prevNodes = selector.clone().nodes
+        replacement.nodes = prevNodes.concat(' ', prefixNode, ', ', prefixNode, prevNodes)
+        selector.replaceWith(replacement)
       }
     })
   }

test/fixture-out.css

@@ -13,6 +13,10 @@
 #hello-world { color: green; }
 #hello-world:hover { color: blue; }
 
+#hello-world.test { color: aqua; }
+
+.test #hello-world, #hello-world.test { color: red; }
+
 h1 {}
 h1.title {}
 h2#thing {}

test/fixture.css

@@ -13,6 +13,10 @@
 :host { color: green; }
 :host(:hover) { color: blue; }
 
+:host(.test) { color: aqua; }
+
+:host-context(.test) { color: red; }
+
 h1 {}
 h1.title {}
 h2#thing {}