Merge pull request #200 from ebidel/resetStyleInheritance-feature

Fixes issue #199 - adds support for resetStyleInheritance on prototype
Polymer · Jul 8, 2013 · 411d53c · 411d53c
2 parents e9ef557 + ef2c3d3
commit 411d53c
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 0 deletions.
diff --git a/src/instance/base.js b/src/instance/base.js
@@ -61,6 +61,7 @@
         root.olderShadowRoot = elderRoot;
         // migrate flag(s)
         root.applyAuthorStyles = this.applyAuthorStyles;
+        root.resetStyleInheritance = this.resetStyleInheritance;
         // TODO(sorvell): host not set per spec; we set it for convenience
         // so we can traverse from root to host.
         root.host = this;

diff --git a/test/html/styling/apply-reset-styles.html b/test/html/styling/apply-reset-styles.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+Copyright 2013 The Polymer Authors. All rights reserved.
+Use of this source code is governed by a BSD-style
+license that can be found in the LICENSE file.
+-->
+<html>
+<head>
+  <title>applyAuthorStyles / resetStyleInheirtance</title>
+  <script src="../../../polymer.js"></script>
+  <script src="../../../tools/test/htmltest.js"></script>
+  <script src="../../../node_modules/chai/chai.js"></script>
+  <style>
+    body {
+      color: rgb(255, 0, 0);
+      font-size: 100px;
+    }
+    div {
+      color: rgb(0, 255, 0);
+    }
+  </style>
+</head>
+<body>
+  <x-test></x-test>
+
+  <polymer-element name="x-test">
+    <template><div id="div">I should be small and green</div></template>
+    <script>
+      Polymer('x-test', {
+        applyAuthorStyles: true,
+        resetStyleInheritance: true,
+        ready: function() {
+          this.appliedAuthorStyles = this.shadowRoot.applyAuthorStyles;
+          this.appliedResetStyles = this.shadowRoot.resetStyleInheritance;
+        }
+      });
+    </script>
+  </polymer-element>
+
+  <script>
+    document.addEventListener('WebComponentsReady', function() {
+      var test = document.querySelector('x-test');
+      chai.assert.isTrue(test.appliedAuthorStyles, 'applyAuthorStyles applied');
+      chai.assert.isTrue(test.appliedResetStyles, 'resetStyleInheritance applied');
+      chai.assert.equal(getComputedStyle(test).color, 'rgb(255, 0, 0)',
+          'author styles applied correctly');
+      chai.assert.equal(getComputedStyle(test.$.div).color, 'rgb(0, 255, 0)',
+          'styles reset correctly');
+      chai.assert.notEqual(parseInt(getComputedStyle(test.$.div).fontSize), 100,
+          'styles reset correctly');
+      done();
+    });
+  </script>
+</body>
+</html>
diff --git a/test/js/styling.js b/test/js/styling.js
@@ -7,5 +7,6 @@ htmlSuite('styling', function() {
   htmlTest('html/styling/sheet-order.html');
   htmlTest('html/styling/sheet-order.html?shadow');
   htmlTest('html/styling/sheet-main-doc.html');
+  htmlTest('html/styling/apply-reset-styles.html');
 });