fix(ShimShadowCss): preserve attribute on style elements
This commit is contained in:
parent
edb797e191
commit
9250cd6a78
|
@ -5,7 +5,7 @@ import {CompileControl} from './compile_control';
|
||||||
import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata';
|
import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata';
|
||||||
import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
|
import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
|
||||||
|
|
||||||
import {DOM, Element} from 'angular2/src/facade/dom';
|
import {DOM, Element, StyleElement} from 'angular2/src/facade/dom';
|
||||||
import {isPresent, isBlank, Type} from 'angular2/src/facade/lang';
|
import {isPresent, isBlank, Type} from 'angular2/src/facade/lang';
|
||||||
|
|
||||||
export class ShimShadowCss extends CompileStep {
|
export class ShimShadowCss extends CompileStep {
|
||||||
|
@ -27,23 +27,24 @@ export class ShimShadowCss extends CompileStep {
|
||||||
if (DOM.tagName(current.element) == 'STYLE') {
|
if (DOM.tagName(current.element) == 'STYLE') {
|
||||||
current.ignoreBindings = true;
|
current.ignoreBindings = true;
|
||||||
if (this._strategy.extractStyles()) {
|
if (this._strategy.extractStyles()) {
|
||||||
DOM.remove(current.element);
|
var styleEl = current.element;
|
||||||
var css = DOM.getText(current.element);
|
DOM.remove(styleEl);
|
||||||
|
var css = DOM.getText(styleEl);
|
||||||
var shimComponent = this._strategy.getShimComponent(this._component);
|
var shimComponent = this._strategy.getShimComponent(this._component);
|
||||||
css = shimComponent.shimCssText(css);
|
css = shimComponent.shimCssText(css);
|
||||||
this._insertStyle(this._styleHost, css);
|
DOM.setText(styleEl, css);
|
||||||
|
this._insertStyle(this._styleHost, styleEl);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_insertStyle(el: Element, css: string) {
|
_insertStyle(host: Element, style: StyleElement) {
|
||||||
var style = DOM.createStyleElement(css);
|
|
||||||
if (isBlank(this._lastInsertedStyle)) {
|
if (isBlank(this._lastInsertedStyle)) {
|
||||||
var firstChild = DOM.firstChild(el);
|
var firstChild = DOM.firstChild(host);
|
||||||
if (isPresent(firstChild)) {
|
if (isPresent(firstChild)) {
|
||||||
DOM.insertBefore(firstChild, style);
|
DOM.insertBefore(firstChild, style);
|
||||||
} else {
|
} else {
|
||||||
DOM.appendChild(el, style);
|
DOM.appendChild(host, style);
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
DOM.insertAfter(this._lastInsertedStyle, style);
|
DOM.insertAfter(this._lastInsertedStyle, style);
|
||||||
|
|
|
@ -9,6 +9,7 @@ import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata';
|
||||||
import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
|
import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
|
||||||
|
|
||||||
import {Type} from 'angular2/src/facade/lang';
|
import {Type} from 'angular2/src/facade/lang';
|
||||||
|
import {DOM} from 'angular2/src/facade/dom';
|
||||||
|
|
||||||
export function main() {
|
export function main() {
|
||||||
describe('ShimShadowCss', () => {
|
describe('ShimShadowCss', () => {
|
||||||
|
@ -53,6 +54,15 @@ export function main() {
|
||||||
expect(host).toHaveText('/* shim */.s{}original content');
|
expect(host).toHaveText('/* shim */.s{}original content');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should preserve attributes on moved style', () => {
|
||||||
|
var host = el('<div></div>');
|
||||||
|
var pipeline = createPipeline(new FakeStrategy(true), host);
|
||||||
|
var template = el('<div><style media="print">.s{}</style></div>');
|
||||||
|
pipeline.process(template);
|
||||||
|
var styleEl = DOM.firstChild(host);
|
||||||
|
expect(DOM.getAttribute(styleEl, 'media')).toEqual('print');
|
||||||
|
});
|
||||||
|
|
||||||
it('should move the styles to the host in the original order', () => {
|
it('should move the styles to the host in the original order', () => {
|
||||||
var host = el('<div></div>');
|
var host = el('<div></div>');
|
||||||
var pipeline = createPipeline(new FakeStrategy(true), host);
|
var pipeline = createPipeline(new FakeStrategy(true), host);
|
||||||
|
@ -60,6 +70,7 @@ export function main() {
|
||||||
pipeline.process(template);
|
pipeline.process(template);
|
||||||
expect(host).toHaveText('/* shim */.s1{}/* shim */.s2{}');
|
expect(host).toHaveText('/* shim */.s1{}/* shim */.s2{}');
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue