Remove usage on customStyle and update usage on

getComputedStyleValue to support polymer 2

Bug: Issue 11329
Change-Id: I0100aae6f1bc5197c8ff42c42b4fc8e7f7e4ed8c
This commit is contained in:
Tao Zhou
2019-08-20 13:43:28 +02:00
parent 3c6f23028c
commit 14b1382b2f
5 changed files with 30 additions and 10 deletions

View File

@@ -1666,8 +1666,7 @@
_computeShowRelatedToggle() {
// Make sure the max height has been applied, since there is now content
// to populate.
// TODO update to polymer 2.x syntax
if (!this.getComputedStyleValue('--relation-chain-max-height')) {
if (!util.getComputedStyleValue('--relation-chain-max-height', this)) {
this._updateRelatedChangeMaxHeight();
}
// Prevents showMore from showing when click on related change, since the

View File

@@ -92,9 +92,7 @@ limitations under the License.
});
getCustomCssValue = cssParam => {
// TODO: Update to be compatible with 2.x when we upgrade from
// 1.x to 2.x.
return element.getComputedStyleValue(cssParam);
return util.getComputedStyleValue(cssParam, element);
};
test('_handleMessageAnchorTap', () => {

View File

@@ -87,14 +87,14 @@ limitations under the License.
element = fixture('basic');
element.prefs = Object.assign({}, MINIMAL_PREFS, {line_wrapping: true});
flushAsynchronousOperations();
assert.equal(element.customStyle['--line-limit'], '80ch');
assert.equal(util.getComputedStyleValue('--line-limit', element), '80ch');
});
test('line limit without line_wrapping', () => {
element = fixture('basic');
element.prefs = Object.assign({}, MINIMAL_PREFS, {line_wrapping: false});
flushAsynchronousOperations();
assert.isNotOk(element.customStyle['--line-limit']);
assert.isNotOk(util.getComputedStyleValue('--line-limit', element));
});
suite('_get{PatchNum|IsParentComment}ByLineAndContent', () => {

View File

@@ -79,15 +79,18 @@ limitations under the License.
test('applies --primary-text-color', () => {
assert.equal(
element.getComputedStyleValue('--primary-text-color'), '#F00BAA');
util.getComputedStyleValue('--primary-text-color', element),
'#F00BAA');
});
test('applies --header-background-color', () => {
assert.equal(element.getComputedStyleValue('--header-background-color'),
assert.equal(
util.getComputedStyleValue('--header-background-color', element),
'#F01BAA');
});
test('applies --footer-background-color', () => {
assert.equal(element.getComputedStyleValue('--footer-background-color'),
assert.equal(
util.getComputedStyleValue('--footer-background-color', element),
'#F02BAA');
});
});

View File

@@ -75,5 +75,25 @@
return wrappedPromise;
};
/**
* Get computed style value.
*
* If ShadyCSS is provided, use ShadyCSS api.
* If `getComputedStyleValue` is provided on the elment, use it.
* Otherwise fallback to native method (in polymer 2).
*
*/
util.getComputedStyleValue = (name, el) => {
let style;
if (window.ShadyCSS) {
style = ShadyCSS.getComputedStyleValue(el, name);
} else if (el.getComputedStyleValue) {
style = el.getComputedStyleValue(name);
} else {
style = getComputedStyle(el).getPropertyValue(name);
}
return style;
};
window.util = util;
})(window);