diff --git a/src/lib/style-transformer.html b/src/lib/style-transformer.html
index aa5a557222..fc493f9521 100644
--- a/src/lib/style-transformer.html
+++ b/src/lib/style-transformer.html
@@ -235,26 +235,21 @@
// :host(...) -> scopeName...
_transformHostSelector: function(selector, hostScope) {
- var m = HOST_PAREN.exec(selector);
- HOST_PAREN.lastIndex = 0;
- var paren = m && m[2].trim();
- if (paren) {
- var selectorKind = /[[.:#*]/;
- if (!paren[0].match(selectorKind)) {
- var typeSelector = paren.split(selectorKind)[0];
- if (typeSelector === hostScope) {
- hostScope = '';
- } else {
- return SELECTOR_NO_MATCH;
- }
+ var m = selector.match(HOST_PAREN);
+ var paren = m && m[2].trim() || '';
+ if (paren && !paren[0].match(SIMPLE_SELECTOR_PREFIX)) {
+ // paren starts with a type selector
+ var typeSelector = paren.split(SIMPLE_SELECTOR_PREFIX)[0];
+ // if the type selector is our hostScope then avoid pre-pending it
+ if (typeSelector === hostScope) {
+ return paren;
+ // otherwise, this selector should not match in this scope so
+ // output a bogus selector.
+ } else {
+ return SELECTOR_NO_MATCH;
}
- return selector.replace(HOST_PAREN, function(m, host, paren) {
- return hostScope + paren;
- });
- } else {
- // now normal :host
- return selector.replace(HOST, hostScope);
}
+ return hostScope + paren;
},
documentRule: function(rule) {
@@ -286,12 +281,13 @@
':not(.' + SCOPE_NAME + ')';
var COMPLEX_SELECTOR_SEP = ',';
var SIMPLE_SELECTOR_SEP = /(^|[\s>+~]+)((?:\[.+?\]|[^\s>+~=\[])+)/g;
+ var SIMPLE_SELECTOR_PREFIX = /[[.:#*]/;
var HOST = ':host';
var ROOT = ':root';
// NOTE: this supports 1 nested () pair for things like
// :host(:not([selected]), more general support requires
// parsing which seems like overkill
- var HOST_PAREN = /(:host)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/g;
+ var HOST_PAREN = /(:host)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))/;
var HOST_CONTEXT = ':host-context';
var HOST_CONTEXT_PAREN = /(.*)(?::host-context)(?:\(((?:\([^)(]*\)|[^)(]*)+?)\))(.*)/;
var CONTENT = '::content';