diff --git a/modules/angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy.ts b/modules/angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy.ts index 155b705be5..840b2543cf 100644 --- a/modules/angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy.ts +++ b/modules/angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy.ts @@ -46,16 +46,21 @@ export class EmulatedScopedShadowDomStrategy extends EmulatedUnscopedShadowDomSt .then((css) => { css = shimCssForComponent(css, hostComponentId); DOM.setText(styleEl, css); + this._moveToStyleHost(styleEl); }); } else { var css = shimCssForComponent(inlinedCss, hostComponentId); DOM.setText(styleEl, css); - DOM.remove(styleEl); - insertStyleElement(this.styleHost, styleEl); + this._moveToStyleHost(styleEl); return null; } } + _moveToStyleHost(styleEl) { + DOM.remove(styleEl); + insertStyleElement(this.styleHost, styleEl); + } + processElement(hostComponentId: string, elementComponentId: string, element) { // Shim the element as a child of the compiled component if (isPresent(hostComponentId)) { diff --git a/modules/angular2/test/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy_spec.ts b/modules/angular2/test/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy_spec.ts index 6cbcdcdabf..f73c944775 100644 --- a/modules/angular2/test/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy_spec.ts +++ b/modules/angular2/test/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy_spec.ts @@ -97,6 +97,20 @@ export function main() { expect(DOM.getText(styleElement)).not.toEqual(DOM.getText(styleElement2)); }); + it('should move the style element to the style host when @imports are present', inject([AsyncTestCompleter], (async) => { + xhr.reply('http://base/one.css', '.one {}'); + + var compileElement = el('
'); + var styleElement = DOM.firstChild(compileElement); + var stylePromise = strategy.processStyleElement('someComponent', 'http://base', styleElement); + + stylePromise.then((_) => { + expect(compileElement).toHaveText(''); + expect(styleHost).toHaveText('.one[_ngcontent-0] {\n\n}'); + async.done(); + }); + })); + it('should move the style element to the style host', () => { var compileElement = el('
'); var styleElement = DOM.firstChild(compileElement);