Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[2.x] Allow adding type="custom" to avoid deprecation warning. Fixes #5017 #5018

Closed
wants to merge 4 commits into from
Closed

[2.x] Allow adding type="custom" to avoid deprecation warning. Fixes #5017 #5018

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
fb522f6
Allow adding type="custom" to avoid deprecation warning. Fixes #5017
kevinpschaaf Jan 5, 2018
5e185d5
Merge branch 'master' into 5017-kschaaf-custom-style
Jan 30, 2018
d26bb05
Add accomodation for HTMLImports polyfill.
Jan 30, 2018
c10629f
Update types
Jan 30, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 12 additions & 4 deletions lib/elements/custom-style.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@
(function() {
'use strict';

const attr = 'include';
const INCLUDE = 'include';
const TYPE = 'type';

const CustomStyleInterface = window.ShadyCSS.CustomStyleInterface;

Expand Down Expand Up @@ -86,9 +87,9 @@
return null;
}
this._style = style;
const include = style.getAttribute(attr);
const include = style.getAttribute(INCLUDE);
if (include) {
style.removeAttribute(attr);
style.removeAttribute(INCLUDE);
style.textContent = Polymer.StyleGather.cssFromModules(include) + style.textContent;
}
/*
Expand All @@ -101,7 +102,14 @@
The ordering of `<custom-style>` should stay the same as when loaded by HTML Imports, but there may be odd
cases of ordering w.r.t the main document styles.
*/
if (this.ownerDocument !== window.document) {
const owner = window.HTMLImports && HTMLImports.importForElement ?
HTMLImports.importForElement(this) || document : this.ownerDocument;
if (owner !== window.document) {
// Allow users to add `type="custom"` to <style> tags to avoid deprecation warning
const type = style.getAttribute(TYPE);
if (type == 'custom') {
style.removeAttribute(TYPE);
}
window.document.head.appendChild(this);
}
return this._style;
Expand Down
4 changes: 2 additions & 2 deletions test/unit/custom-style-import.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,9 @@

<link rel="import" href="sub/style-import.html">

<custom-style>
<custom-style id="type-was-custom">
<style is="custom-style" include="shared-style style-import
style-import2">
style-import2" type="custom">
html {

--import-mixin: {
Expand Down
6 changes: 6 additions & 0 deletions test/unit/custom-style.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -365,6 +365,12 @@
assertComputed(m, '4px');
});

test('imported custom-style style with type="custom" has type removed', function() {
const customStyle = document.head.querySelector('custom-style#type-was-custom');
const style = customStyle.querySelector('style');
assert.isFalse(style.hasAttribute('type'));
});

test('dynamic custom-styles apply', function() {
var dynamic = document.querySelector('.dynamic');
assertComputed(dynamic, '0px');
Expand Down