Polymer
diff --git a/‎test/unit/custom-style-late-import.html‎
Lines changed: 0 additions & 32 deletions b/‎test/unit/custom-style-late-import.html‎
Lines changed: 0 additions & 32 deletions
diff --git a/‎test/unit/custom-style-late.html‎
Lines changed: 34 additions & 5 deletions b/‎test/unit/custom-style-late.html‎
Lines changed: 34 additions & 5 deletions
@@ -14,19 +14,48 @@
   <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
   <script src="../../../web-component-tester/browser.js"></script>
   <link rel="import" href="../../polymer.html">
-  <link rel="import" href="custom-style-late-import.html">
-
 </head>
 <body>
-  <input id="input" is="x-input">
+
+  <custom-style>
+    <style is="custom-style">
+      x-input {
+        border: 4px solid red;
+        @apply --cs-blue;
+      }
+    </style>
+  </custom-style>
+
+  <template id="late">
+  <custom-style>
+    <style is="custom-style">
+      :root {
+        --cs-blue: {
+          border: 8px solid blue;
+        }
+        ;
+      }
+    </style>
+  </custom-style>
+  </template>
+
+  <x-input id="input"></x-input>
 
   <script>
   /* global input */
 
     suite('custom-style late property definition', function() {
 
-      test('late defined properties applied to custom-style', function() {
-        assertComputed(input, '8px');
+      test('late defined properties applied to custom-style', function(done) {
+        Polymer({
+          is: 'x-input'
+        });
+        var template = document.querySelector('template#late');
+        document.body.appendChild(document.importNode(template.content, true));
+        setTimeout(function() {
+          assertComputed(input, '8px');
+          done();
+        }, 125);
       });
 
     });