From ff88e174c011426b6a332520a96d3cd5f0582717 Mon Sep 17 00:00:00 2001
From: Steven Orvell <sorvell@google.com>
Date: Tue, 28 Jun 2016 17:55:53 -0700
Subject: [PATCH] Restore functionality of selectors like `:host(.foo)::after`.

Fixes #3749.
---
 src/lib/style-transformer.html         | 6 +++++-
 test/unit/styling-scoped-elements.html | 5 +++++
 test/unit/styling-scoped.html          | 7 +++++--
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/lib/style-transformer.html b/src/lib/style-transformer.html
index 1fa3c30cd0..8ff71f0304 100644
--- a/src/lib/style-transformer.html
+++ b/src/lib/style-transformer.html
@@ -250,7 +250,11 @@
               return SELECTOR_NO_MATCH;
             }
           } else {
-            return hostScope + paren;    
+            // make sure to do a replace here to catch selectors like:
+            // `:host(.foo)::before`
+            return selector.replace(HOST_PAREN, function(m, host, paren) {
+              return hostScope + paren;
+            });
           }
         // if no paren, do a straight :host replacement.
         // TODO(sorvell): this should not strictly be necessary but 
diff --git a/test/unit/styling-scoped-elements.html b/test/unit/styling-scoped-elements.html
index e69da7bf59..a138905e79 100644
--- a/test/unit/styling-scoped-elements.html
+++ b/test/unit/styling-scoped-elements.html
@@ -133,6 +133,11 @@
       border-width: 2px;
     }
 
+    :host(.wide)::after {
+      content: 'a';
+      border: 4px solid blue;
+    };
+
     #keyframes2.special {
       --keyframes100: 200px;
     }
diff --git a/test/unit/styling-scoped.html b/test/unit/styling-scoped.html
index d37f11319a..1b4dd260c0 100644
--- a/test/unit/styling-scoped.html
+++ b/test/unit/styling-scoped.html
@@ -58,8 +58,8 @@
 <script>
   suite('scoped-styling', function() {
 
-  function assertComputed(element, value, property) {
-    var computed = getComputedStyle(element);
+  function assertComputed(element, value, property, pseudo) {
+    var computed = getComputedStyle(element, pseudo);
     property = property || 'border-top-width';
     assert.equal(computed[property], value, 'computed style incorrect for ' + property);
   }
@@ -73,6 +73,9 @@
   test(':host, :host(...)', function() {
     assertComputed(styled, '1px');
     assertComputed(styledWide, '2px');
+    assertComputed(styled, '0px', null, '::after');
+    assertComputed(styledWide, '2px');
+    assertComputed(styledWide, '4px', null, '::after');
 
   });