GreenPolyProducts/polymer
5
0
Fork 0
mirror of https://github.com/Polymer/polymer.git synced 2025-02-25 18:55:30 -06:00
Code Issues Packages Projects Releases Wiki Activity

ShadyCSS is back

Browse Source
This commit is contained in:
Daniel Freedman 2017-02-14 23:06:45 -08:00
parent 2c9954f950
commit b163f32888
5 changed files with 23 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.eslintrc.json
View File

@ -17,8 +17,7 @@
"HTMLImports": true, "HTMLImports": true,
"Polymer": true, "Polymer": true,
"ShadyDOM": true, "ShadyDOM": true,
"ScopingShim": true, "ShadyCSS": true,
"ApplyShim": true,
"goog": true "goog": true
} }
} }

4
src/lib/flush.html
View File

@ -35,8 +35,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
let shadyDOM, debouncers; let shadyDOM, debouncers;
do { do {
shadyDOM = window.ShadyDOM && ShadyDOM.flush(); shadyDOM = window.ShadyDOM && ShadyDOM.flush();
if (window.ScopingShim) { if (window.ShadyCSS && window.ShadyCSS.ScopingShim) {
ScopingShim.flush(); window.ShadyCSS.ScopingShim.flush();
} }
debouncers = flushDebouncers(); debouncers = flushDebouncers();
} while (shadyDOM || debouncers); } while (shadyDOM || debouncers);

10
test/unit/custom-style.html
View File

@ -313,19 +313,19 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
test('custom properties registered as defaults', function() { test('custom properties registered as defaults', function() {
var propsToCheck = ['--italic']; var propsToCheck = ['--italic'];
if (!window.ScopingShim || ScopingShim.nativeCss || stylesBuilt) { if (!window.ShadyCSS || ShadyCSS.nativeCss || stylesBuilt) {
var sep = ApplyShim._separator; var sep = window.ShadyCSS.ApplyShim._separator;
propsToCheck.push('--bag' + sep + 'margin', '--bag' + sep + 'border'); propsToCheck.push('--bag' + sep + 'margin', '--bag' + sep + 'border');
} else { } else {
propsToCheck.push('--bag'); propsToCheck.push('--bag');
} }
if (!window.ScopingShim || ScopingShim.nativeCss) { if (!window.ShadyCSS || ShadyCSS.nativeCss) {
var cs = getComputedStyle(document.documentElement); var cs = getComputedStyle(document.documentElement);
propsToCheck.forEach(function(p) { propsToCheck.forEach(function(p) {
assert.ok(cs.getPropertyValue(p)); assert.ok(cs.getPropertyValue(p));
}); });
} else { } else {
var props = ScopingShim._documentOwner.__styleInfo.styleProperties; var props = ShadyCSS.ScopingShim._documentOwner.__styleInfo.styleProperties;
propsToCheck.forEach(function(p) { propsToCheck.forEach(function(p) {
assert.property(props, p); assert.property(props, p);
}); });
@ -354,7 +354,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('imported custom-styles apply', function() { test('imported custom-styles apply', function() {
if (stylesBuilt && window.ScopingShim && !ScopingShim.nativeCss) { if (stylesBuilt && window.ShadyCSS && !ShadyCSS.nativeCss) {
// css build will test this by using vulcanize. // css build will test this by using vulcanize.
// this inlines the custom-style after the consumption point, and changes the timing for custom property shim // this inlines the custom-style after the consumption point, and changes the timing for custom property shim
// Force an update style for this weird corner case in the tests // Force an update style for this weird corner case in the tests

18
test/unit/styling-cross-scope-apply.html
View File

@ -462,21 +462,21 @@ suite('scoped-styling-apply', function() {
}); });
test('variable mixins calculated correctly and inherit', function() { test('variable mixins calculated correctly and inherit', function() {
if (!window.ScopingShim || ScopingShim.nativeCss) { if (!window.ShadyCSS || ShadyCSS.nativeCss) {
this.skip(); this.skip();
} }
var suffix = ''; var suffix = '';
if (stylesBuilt) { if (stylesBuilt) {
suffix = ApplyShim._separator + 'border'; suffix = window.ShadyCSS.ApplyShim._separator + 'border';
} }
var e = styled; var e = styled;
var info = ScopingShim._styleInfoForNode(e); var info = ShadyCSS.ScopingShim._styleInfoForNode(e);
assert.property(info.styleProperties, '--mixin1' + suffix); assert.property(info.styleProperties, '--mixin1' + suffix);
assert.property(info.styleProperties, '--mixin2' + suffix); assert.property(info.styleProperties, '--mixin2' + suffix);
assert.property(info.styleProperties, '--mixin3' + suffix); assert.property(info.styleProperties, '--mixin3' + suffix);
assert.property(info.styleProperties, '--mixin4' + suffix); assert.property(info.styleProperties, '--mixin4' + suffix);
e = styled.$.child; e = styled.$.child;
info = ScopingShim._styleInfoForNode(e); info = ShadyCSS.ScopingShim._styleInfoForNode(e);
assert.property(info.styleProperties, '--mixin1' + suffix); assert.property(info.styleProperties, '--mixin1' + suffix);
assert.property(info.styleProperties, '--mixin2' + suffix); assert.property(info.styleProperties, '--mixin2' + suffix);
assert.property(info.styleProperties, '--mixin3' + suffix); assert.property(info.styleProperties, '--mixin3' + suffix);
@ -498,13 +498,13 @@ suite('scoped-styling-apply', function() {
var url = 'http://www.google.com/icon.png'; var url = 'http://www.google.com/icon.png';
var e = styled.$.child; var e = styled.$.child;
var actual, unescaped; var actual, unescaped;
if (window.ScopingShim && ScopingShim.nativeCssApply) { if (window.ShadyCSS && ShadyCSS.nativeCssApply) {
actual = getComputedStyle(e).getPropertyValue('--mixin2'); actual = getComputedStyle(e).getPropertyValue('--mixin2');
// if strings aren't used in the url, getPropertyValue will escape the string, which breaks assert.include // if strings aren't used in the url, getPropertyValue will escape the string, which breaks assert.include
unescaped = actual.replace(/\\/g, ''); unescaped = actual.replace(/\\/g, '');
assert.include(unescaped, url); assert.include(unescaped, url);
} else if (!window.ScopingShim || ScopingShim.nativeCss) { } else if (!window.ShadyCSS || ShadyCSS.nativeCss) {
var propertyName = '--mixin2' + ApplyShim._separator + 'background'; var propertyName = '--mixin2' + window.ShadyCSS.ApplyShim._separator + 'background';
actual = getComputedStyle(e).getPropertyValue(propertyName); actual = getComputedStyle(e).getPropertyValue(propertyName);
// if strings aren't used in the url, getPropertyValue will escape the string, which breaks assert.include // if strings aren't used in the url, getPropertyValue will escape the string, which breaks assert.include
unescaped = actual.replace(/\\/g, ''); unescaped = actual.replace(/\\/g, '');
@ -512,9 +512,9 @@ suite('scoped-styling-apply', function() {
} else { } else {
var propName = '--mixin2'; var propName = '--mixin2';
if (stylesBuilt) { if (stylesBuilt) {
propName = propName + ApplyShim._separator + 'background'; propName = propName + window.ShadyCSS.ApplyShim._separator + 'background';
} }
var info = ScopingShim._styleInfoForNode(e); var info = ShadyCSS.ScopingShim._styleInfoForNode(e);
assert.include(info.styleProperties[propName], url); assert.include(info.styleProperties[propName], url);
assert.include(info.customStyle.textContent, url); assert.include(info.customStyle.textContent, url);
} }

12
test/unit/styling-cross-scope-var.html
View File

@ -838,7 +838,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('invalid variables not parsed', function() { test('invalid variables not parsed', function() {
if (!window.ScopingShim || ScopingShim.nativeCss) { if (!window.ShadyCSS || ShadyCSS.nativeCss) {
this.skip(); this.skip();
} }
assert.notProperty(styled.__styleInfo.styleProperties, 'x--invalid'); assert.notProperty(styled.__styleInfo.styleProperties, 'x--invalid');
@ -893,13 +893,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
styled.$.child.classList.add('special'); styled.$.child.classList.add('special');
var l = document.querySelectorAll('style').length; var l = document.querySelectorAll('style').length;
styled.updateStyles(); styled.updateStyles();
if (styled.shadyRoot && window.ScopingShim && !ScopingShim.nativeCss) { if (styled.shadyRoot && window.ShadyCSS && !ShadyCSS.nativeCss) {
assert.equal(document.querySelectorAll('style').length, l+4); assert.equal(document.querySelectorAll('style').length, l+4);
} }
assertComputed(styled.$.child.$.me, '12px'); assertComputed(styled.$.child.$.me, '12px');
styled.$.child.classList.remove('special'); styled.$.child.classList.remove('special');
styled.updateStyles(); styled.updateStyles();
if (styled.shadyRoot && window.ScopingShim && !ScopingShim.nativeCss) { if (styled.shadyRoot && window.ShadyCSS && !ShadyCSS.nativeCss) {
assert.equal(document.querySelectorAll('style').length, l); assert.equal(document.querySelectorAll('style').length, l);
} }
assertComputed(styled.$.child.$.me, '2px'); assertComputed(styled.$.child.$.me, '2px');
@ -1024,7 +1024,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// late bound property does *not* resolve using inherited value // late bound property does *not* resolve using inherited value
var o3 = styled.$.overrides3; var o3 = styled.$.overrides3;
if (window.ScopingShim && !ScopingShim.nativeCss) { if (window.ShadyCSS && !ShadyCSS.nativeCss) {
assert.equal(o3.__styleInfo.styleProperties['--late'], '', 'property should not be late bound'); assert.equal(o3.__styleInfo.styleProperties['--late'], '', 'property should not be late bound');
} }
assertStylePropertyValue(o3.$.late, '--fillin', '16px'); assertStylePropertyValue(o3.$.late, '--fillin', '16px');
@ -1079,12 +1079,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}); });
test('producing a var that consumes results in static and not dynamic stylesheet', function() { test('producing a var that consumes results in static and not dynamic stylesheet', function() {
if (!window.ScopingShim || ScopingShim.nativeCss) { if (!window.ShadyCSS || ShadyCSS.nativeCss) {
this.skip(); this.skip();
} }
var d = document.createElement('x-var-produce-via-consume'); var d = document.createElement('x-var-produce-via-consume');
document.body.appendChild(d); document.body.appendChild(d);
var styleRoot = (!window.ScopingShim || ScopingShim.nativeShadow) ? d.shadowRoot : document.head; var styleRoot = (!window.ShadyCSS || ShadyCSS.nativeShadow) ? d.shadowRoot : document.head;
var staticStyle = styleRoot.querySelector('style[scope=x-var-produce-via-consume]'); var staticStyle = styleRoot.querySelector('style[scope=x-var-produce-via-consume]');
assert.ok(staticStyle); assert.ok(staticStyle);
assert.match(staticStyle.textContent, /display/, 'static style does not contain style content'); assert.match(staticStyle.textContent, /display/, 'static style does not contain style content');