Test fixes for polyfilled environments: shadydom + shimmed css properties.

This commit is contained in:
Steven Orvell
2016-11-07 16:42:51 -08:00
parent f195676f1e
commit c49c3f3a16
5 changed files with 63 additions and 35 deletions

View File

@@ -16,6 +16,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../polymer.html">
<link rel="import" href="bind-elements.html">
<body>
<script>
// TODO(sorvell): remove when ShadyDOM no longer requires this.
// blocked on https://github.com/webcomponents/shadydom/issues/7.
if (window.ShadyDOM) {
ShadyDOM.patch(document.body);
}
</script>
<dom-repeat id="class-repeat" items='["class1", "class2"]'>
<template>

View File

@@ -17,11 +17,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</head>
<body>
<style is="custom-style">
.c {
--cache-element-border: 8px solid blue;
}
</style>
<custom-style>
<style is="custom-style">
.c {
--cache-element-border: 8px solid blue;
}
</style>
</custom-style>
<dom-module id="cache-element">
<template>
<style>

View File

@@ -62,10 +62,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
x-foo {
--primary: 10px;
}
body /deep/ * {
--deeep: 6px solid orange;
--x-foo-more: 6px solid orange;
}
</style>
</custom-style>
@@ -181,15 +178,15 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
@apply --bag;
}
#deep {
border: var(--deeep);
#more {
border: var(--x-foo-more);
}
</style>
<div id="me">x-foo</div>
<x-bar id="bar1"></x-bar>
<x-bar id="bar2"></x-bar>
<x-bar id="bar3"></x-bar>
<div id="deep">deep</div>
<div id="more">deep</div>
</template>
</dom-module>

View File

@@ -470,15 +470,17 @@ suite('scoped-styling-apply', function() {
suffix = ApplyShim._separator + 'border';
}
var e = styled;
assert.property(e.__styleProperties, '--mixin1' + suffix);
assert.property(e.__styleProperties, '--mixin2' + suffix);
assert.property(e.__styleProperties, '--mixin3' + suffix);
assert.property(e.__styleProperties, '--mixin4' + suffix);
var info = ShadyCSS._styleInfoForNode(e);
assert.property(info.styleProperties, '--mixin1' + suffix);
assert.property(info.styleProperties, '--mixin2' + suffix);
assert.property(info.styleProperties, '--mixin3' + suffix);
assert.property(info.styleProperties, '--mixin4' + suffix);
e = styled.$.child;
assert.property(e.__styleProperties, '--mixin1' + suffix);
assert.property(e.__styleProperties, '--mixin2' + suffix);
assert.property(e.__styleProperties, '--mixin3' + suffix);
assert.property(e.__styleProperties, '--mixin4' + suffix);
info = ShadyCSS._styleInfoForNode(e);
assert.property(info.styleProperties, '--mixin1' + suffix);
assert.property(info.styleProperties, '--mixin2' + suffix);
assert.property(info.styleProperties, '--mixin3' + suffix);
assert.property(info.styleProperties, '--mixin4' + suffix);
});
test('variable mixins apply', function() {
@@ -512,8 +514,9 @@ suite('scoped-styling-apply', function() {
if (stylesBuilt) {
propName = propName + ApplyShim._separator + 'background';
}
assert.include(e.__styleProperties[propName], url);
assert.include(e.__customStyle.textContent, url);
var info = ShadyCSS._styleInfoForNode(e);
assert.include(info.styleProperties[propName], url);
assert.include(info.customStyle.textContent, url);
}
});

View File

@@ -16,18 +16,27 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../polymer.html">
</head>
<body>
<style is="custom-style">
unknown-host {
display: block;
}
<script>
// TODO(sorvell): remove when ShadyDOM no longer requires this.
// blocked on https://github.com/webcomponents/shadydom/issues/7.
if (window.ShadyDOM) {
ShadyDOM.patch(document.body);
}
</script>
<custom-style>
<style is="custom-style">
unknown-host {
display: block;
}
:root {
--border: 2px solid steelblue;
--mixin: {
color: blue;
};
}
</style>
html {
--border: 2px solid steelblue;
--mixin: {
color: blue;
};
}
</style>
</custom-style>
<script>
HTMLImports.whenReady(function() {
@@ -108,14 +117,24 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var foo = document.createElement('x-foo');
host.shadowRoot.appendChild(foo);
document.body.appendChild(host);
CustomElements.takeRecords();
if (window.ShadyDOM) {
ShadyDOM.flush();
}
if (window.customElements.flush) {
customElements.flush();
}
assertComputed(foo, '2px');
});
test('element in unknown host styled via containing polymer element', function() {
var n = document.createElement('x-nest');
document.body.appendChild(n);
CustomElements.takeRecords();
if (window.ShadyDOM) {
ShadyDOM.flush();
}
if (window.customElements.flush) {
customElements.flush();
}
var foo = n.$.unknown.shadowRoot.querySelector('x-foo');
assertComputed(foo, '4px');
});