Skip to content

Commit 5a493d8

Browse files
author
Steven Orvell
committed
Add support for one-of attribute selector while not breaking support for general sibling combinator. Fixes #3023. Fix taken from #3067.
1 parent c00c47f commit 5a493d8

3 files changed

Lines changed: 38 additions & 1 deletion

File tree

‎src/lib/style-transformer.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -253,7 +253,7 @@
253253
var SCOPE_DOC_SELECTOR = ':not([' + SCOPE_NAME + '])' +
254254
':not(.' + SCOPE_NAME + ')';
255255
var COMPLEX_SELECTOR_SEP = ',';
256-
var SIMPLE_SELECTOR_SEP = /(^|[\s>+~]+)([^\s>+~]+)/g;
256+
var SIMPLE_SELECTOR_SEP = /(^|[\s>+~]+)((?:\[.+?\]|[^\s>+~=\[])+)/g;
257257
var HOST = ':host';
258258
var ROOT = ':root';
259259
// NOTE: this supports 1 nested () pair for things like

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

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -505,3 +505,31 @@
505505
is: 'x-overriding'
506506
});
507507
</script>
508+
509+
<dom-module id="x-attr-selector">
510+
<template>
511+
<style>
512+
#foo1 ~ #bar1 {
513+
border: 2px solid red;
514+
}
515+
516+
#foo1 ~ #bar1 ~ #foo2[attr~=foo2] ~ #bar2[attr~=bar2] {
517+
border: 4px solid red;
518+
}
519+
520+
#foo1 ~ #bar1 ~ #foo2[attr~=foo2] ~ #bar2[attr~=bar2] ~ #foo3[attr~=foo3][a~=a] ~ #bar3[attr~=bar3][a~=a] {
521+
border: 6px solid red;
522+
}
523+
</style>
524+
<div id="foo1"></div>
525+
<div id="bar1">bar1</div>
526+
<div id="foo2" attr="foo2"></div>
527+
<div id="bar2" attr="bar2">bar2</div>
528+
<div id="foo3" attr="foo3" a="a"></div>
529+
<div id="bar3" attr="bar3" a="a">bar3</div>
530+
531+
</template>
532+
<script>
533+
Polymer({is: 'x-attr-selector'});
534+
</script>
535+
</dom-module>

‎test/unit/styling-scoped.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -236,6 +236,14 @@
236236
document.body.removeChild(el);
237237
});
238238

239+
test('attribute inclusive selector and general sibling selectors', function() {
240+
var e = document.createElement('x-attr-selector');
241+
document.body.appendChild(e);
242+
assertComputed(e.$.bar1, '2px');
243+
assertComputed(e.$.bar2, '4px');
244+
assertComputed(e.$.bar3, '6px');
245+
});
246+
239247
suite('scoped-styling-shady-only', function() {
240248

241249
suiteSetup(function() {
@@ -333,6 +341,7 @@
333341
computed = getComputedStyle(circle);
334342
assert.equal(computed['fill-opacity'], '0.5');
335343
});
344+
336345
});
337346

338347
</script>

0 commit comments

Comments
 (0)