Merge pull request #4886 from Polymer/document-selector-fix

Check that document selectors are actually simple selectors
Polymer · Oct 17, 2017 · 63376cb · 63376cb
2 parents 5c0df2d + feaf5c6
commit 63376cb
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 4 deletions.
diff --git a/src/lib/style-transformer.html b/src/lib/style-transformer.html
@@ -311,9 +311,7 @@
       },
 
       _transformDocumentSelector: function(selector) {
-        return selector.match(SCOPE_JUMP) ?
-          this._transformComplexSelector(selector, SCOPE_DOC_SELECTOR) :
-          this._transformSimpleSelector(selector.trim(), SCOPE_DOC_SELECTOR);
+        return this._transformComplexSelector(selector, SCOPE_DOC_SELECTOR);
       },
 
       // For forward compatibility with ShadowDOM v1 and Polymer 2.x,

diff --git a/test/runner.html b/test/runner.html
@@ -98,7 +98,11 @@
       'unit/dir.html',
       'unit/dir.html?dom=shadow',
       'unit/dir.html?lazyRegister=true&useNativeCSSProperties=true',
-      'unit/dir.html?lazyRegister=true&useNativeCSSProperties=true&dom=shadow'
+      'unit/dir.html?lazyRegister=true&useNativeCSSProperties=true&dom=shadow',
+      'unit/custom-style-transformed.html',
+      'unit/custom-style-transformed.html?dom=shadow',
+      'unit/custom-style-transformed.html?lazyRegister=true&useNativeCSSProperties=true',
+      'unit/custom-style-transformed.html?lazyRegister=true&useNativeCSSProperties=true&dom=shadow'
     ];
 
     if (window.customElements || document.registerElement) {

diff --git a/test/unit/custom-style-transformed.html b/test/unit/custom-style-transformed.html
@@ -0,0 +1,62 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
+  <script src="../../../web-component-tester/browser.js"></script>
+  <link rel="import" href="../../polymer.html">
+</head>
+<body>
+  <style is="custom-style">
+    html:not([foo]) * {
+      color: rgb(123, 123, 123);
+      border: 10px solid black;
+    }
+    html, body:not([foo]) * {
+      padding-left: 10px;
+    }
+  </style>
+</body>
+<dom-module id="x-styled">
+  <template>
+    <style>
+      :host {
+        display: block;
+      }
+    </style>
+    <div id="target"></div>
+  </template>
+</dom-module>
+
+<x-styled id="target"></x-styled>
+
+<script>
+  HTMLImports.whenReady(function() {
+    Polymer({is: 'x-styled'});
+  });
+  suite('complicated custom style', function() {
+    var el, target;
+    suiteSetup(function() {
+      el = document.querySelector('x-styled#target');
+      target = el.$.target;
+    });
+    test('complex selector', function() {
+      assert.equal(getComputedStyle(el).getPropertyValue('border-top-width').trim(), '10px');
+      assert.equal(getComputedStyle(target).getPropertyValue('border-top-width').trim(), '0px');
+      assert.equal(getComputedStyle(target).getPropertyValue('color').trim(), 'rgb(123, 123, 123)');
+    });
+    test('list of complex selectors', function() {
+      assert.equal(getComputedStyle(el).getPropertyValue('padding-left').trim(), '10px');
+      assert.equal(getComputedStyle(target).getPropertyValue('padding-left').trim(), '0px');
+    });
+  })
+</script>