Skip to content

Commit 58d3c3b

Browse files
author
Steven Orvell
committed
Add tests and require module to be on style elements.
1 parent 3734c4d commit 58d3c3b

5 files changed

Lines changed: 31 additions & 15 deletions

File tree

‎src/lib/style-util.html‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -105,20 +105,24 @@
105105
var cssText = '';
106106
var e$ = Array.prototype.slice.call(
107107
element.querySelectorAll(this.MODULE_STYLES_SELECTOR));
108-
for (var i=0, e; i < e$.length; i++) {
108+
for (var i=0, e, addModule; i < e$.length; i++) {
109109
e = e$[i];
110+
addModule = null;
110111
// look inside templates for elements
111112
if (e.localName === 'template') {
112113
cssText += this._cssFromElement(e.content);
113114
} else {
114115
// style elements inside dom-modules will apply to the main document
115116
// we don't want this, so we remove them here.
116117
if (e.localName === 'style') {
118+
addModule = e.getAttribute('module');
117119
// get style element applied to main doc via HTMLImports polyfill
118120
e = e.__appliedElement || e;
119121
e.parentNode.removeChild(e);
120122
// it's an import, assume this is a text file of css content.
121123
} else {
124+
// TODO(sorvell): plan is to deprecate this way to get styles;
125+
// remember to add deprecation warning when this is done.
122126
e = e.import && e.import.body;
123127
}
124128
// adjust paths in css.
@@ -127,14 +131,13 @@
127131
}
128132
}
129133
// now support module refs on 'styling' elements
130-
var module = e.getAttribute('module');
131-
if (module) {
132-
cssText += this.cssFromModules(module);
134+
if (addModule) {
135+
cssText += this.cssFromModules(addModule);
133136
}
134137
}
135138
return cssText;
136139
},
137-
140+
138141
resolveCss: Polymer.ResolveUrl.resolveCss,
139142
parser: Polymer.CssParse,
140143
ruleTypes: Polymer.CssParse.types

‎test/unit/custom-style-import.html‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,21 @@
1-
<style is="custom-style">
2-
:root {
1+
<dom-module id="shared-style">
2+
<template>
3+
<style>
4+
:root {
5+
--import-var: 3px solid orange;
6+
}
7+
</style>
8+
</template>
9+
</dom-module>
310

4-
--import-var: 3px solid orange;
11+
<style is="custom-style" module="shared-style">
12+
:root {
513

614
--import-mixin: {
715
border: 4px solid blue;
816
};
917

1018
padding: 10px;
1119
}
12-
</style>
20+
</style>
21+

‎test/unit/styling-remote-elements.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,8 @@
8787

8888
</style>
8989
<template>
90+
<!-- style in template using module! -->
91+
<style module="remote-styles"></style>
9092
<content select=".blank"></content>
9193
<div id="simple">simple</div>
9294
<div id="complex1" class="scoped">complex1</div>
@@ -111,7 +113,6 @@
111113
<script>
112114
Polymer({
113115
is: 'x-styled',
114-
styleModules: ['remote-styles'],
115116

116117
computeClass: function(className) {
117118
return className;

‎test/unit/styling-remote-module-sheet.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<dom-module id="remote-styles">
2+
<template>
23
<style>
34
#simple {
45
border: 3px solid orange;
@@ -8,4 +9,5 @@
89
border: 4px solid pink;
910
}
1011
</style>
12+
</template>
1113
</dom-module>

‎test/unit/styling-scoped-elements.html‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
<dom-module id="x-gchild">
2-
<style>
3-
:host-context(.wide) #target {
4-
border: 10px solid orange;
5-
}
6-
</style>
72
<template>
3+
<!-- styles can be in templates -->
4+
<style>
5+
:host-context(.wide) #target {
6+
border: 10px solid orange;
7+
}
8+
</style>
89
<div id="target">x-gchild</div>
910
</template>
1011
</dom-module>

0 commit comments

Comments
 (0)