Merge pull request #3406 from TimvdLippe/var-with-parenthesis

Fix parsing of parenthesis in default of variable declaration
This commit is contained in:
Steve Orvell 2016-02-12 17:41:16 -08:00
commit 605e5fe24f
2 changed files with 18 additions and 8 deletions

View File

@ -160,12 +160,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
if (m) { if (m) {
p = this.valueForProperty(props[m[1]], props); p = this.valueForProperty(props[m[1]], props);
} else { } else {
var pp = p.split(':'); var colon = p.indexOf(':');
if (pp[1]) { if (colon !== -1) {
pp[1] = pp[1].trim(); var pp = p.substring(colon);
pp[1] = this.valueForProperty(pp[1], props) || pp[1]; pp = pp.trim();
pp = this.valueForProperty(pp, props) || pp;
p = p.substring(0, colon) + pp;
} }
p = pp.join(':');
} }
parts[i] = (p && p.lastIndexOf(';') === p.length - 1) ? parts[i] = (p && p.lastIndexOf(';') === p.length - 1) ?
// strip trailing ; // strip trailing ;
@ -449,7 +450,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// var(--a, --b) // var(--a, --b)
// var(--a, fallback-literal) // var(--a, fallback-literal)
// var(--a, fallback-literal(with-one-nested-parentheses)) // var(--a, fallback-literal(with-one-nested-parentheses))
VAR_MATCH: /(^|\W+)var\([\s]*([^,)]*)[\s]*,?[\s]*((?:[^,)]*)|(?:[^;]*\([^;)]*\)))[\s]*?\)/gi, VAR_MATCH: /(^|\W+)var\([\s]*([^,)]*)[\s]*,?[\s]*((?:[^,()]*)|(?:[^;()]*\([^;)]*\)))[\s]*?\)/gi,
VAR_CAPTURE: /\([\s]*(--[^,\s)]*)(?:,[\s]*(--[^,\s)]*))?(?:\)|,)/gi, VAR_CAPTURE: /\([\s]*(--[^,\s)]*)(?:,[\s]*(--[^,\s)]*))?(?:\)|,)/gi,
ANIMATION_MATCH: /(animation\s*:)|(animation-name\s*:)/, ANIMATION_MATCH: /(animation\s*:)|(animation-name\s*:)/,
IS_VAR: /^--/, IS_VAR: /^--/,

View File

@ -445,6 +445,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
} }
#endTerm {border: var(--end-term)} #endTerm {border: var(--end-term)}
#parenthesis {
background-image: var(--foo-background-image, url(http://placehold.it/400x300));
}
</style> </style>
<div id="me">x-scope</div> <div id="me">x-scope</div>
<x-keyframes id="keyframes"></x-keyframes> <x-keyframes id="keyframes"></x-keyframes>
@ -473,6 +477,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<x-dynamic id="dynamic"></x-dynamic> <x-dynamic id="dynamic"></x-dynamic>
<div id="wsTerm">new line var</div> <div id="wsTerm">new line var</div>
<div id="endTerm">end var</div> <div id="endTerm">end var</div>
<div id="parenthesis">parenthesis</div>
</template> </template>
<script> <script>
HTMLImports.whenReady(function() { HTMLImports.whenReady(function() {
@ -556,8 +561,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script> <script>
suite('scoped-styling-var', function() { suite('scoped-styling-var', function() {
function assertComputed(element, value, pseudo) { function assertComputed(element, value, pseudo, name) {
var name = 'border-top-width'; var name = name || 'border-top-width';
var computed = element.getComputedStyleValue && !pseudo ? var computed = element.getComputedStyleValue && !pseudo ?
element.getComputedStyleValue(name) : element.getComputedStyleValue(name) :
getComputedStyle(element, pseudo)[name]; getComputedStyle(element, pseudo)[name];
@ -794,6 +799,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
assertComputed(styled.$.endTerm, '19px'); assertComputed(styled.$.endTerm, '19px');
}); });
test('variable with parenthesis', function() {
assertComputed(styled.$.parenthesis, 'url("http://placehold.it/400x300")', false, 'background-image');
});
// skip for now, until #3326 is fixed // skip for now, until #3326 is fixed
test.skip('custom style class overrides css variable', function() { test.skip('custom style class overrides css variable', function() {
var d = document.createElement('x-variable-override'); var d = document.createElement('x-variable-override');