cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ShadowDomStrategy): always inline import rules

Browse Source 
fixes #1694
This commit is contained in:
Victor Berchet
2015-06-18 10:07:43 +02:00
committed by Yegor Jbanov
parent d575915d7a
commit 1c4d233fe7
9 changed files with 149 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
modules/angular2/src/core/application.ts
View File

@ -108,9 +108,9 @@ function _injectorBindings(appComponentType): List<Type | Binding | List<any>> {
},
[NgZone]),
bind(ShadowDomStrategy)
.toFactory((styleUrlResolver, doc) =>
new EmulatedUnscopedShadowDomStrategy(styleUrlResolver, doc.head),
[StyleUrlResolver, DOCUMENT_TOKEN]),
.toFactory((styleInliner, styleUrlResolver, doc) => new EmulatedUnscopedShadowDomStrategy(
styleInliner, styleUrlResolver, doc.head),
[StyleInliner, StyleUrlResolver, DOCUMENT_TOKEN]),
DomRenderer,
DefaultDomCompiler,
bind(Renderer).toAlias(DomRenderer),

24
modules/angular2/src/render/dom/shadow_dom/emulated_scoped_shadow_dom_strategy.ts
View File

@ -27,8 +27,11 @@ import {
* - see `ShadowCss` for more information and limitations.
*/
export class EmulatedScopedShadowDomStrategy extends EmulatedUnscopedShadowDomStrategy {
constructor(public styleInliner: StyleInliner, styleUrlResolver: StyleUrlResolver, styleHost) {
super(styleUrlResolver, styleHost);
styleInliner: StyleInliner;
constructor(styleInliner: StyleInliner, styleUrlResolver: StyleUrlResolver, styleHost) {
super(styleInliner, styleUrlResolver, styleHost);
this.styleInliner = styleInliner;
}
processStyleElement(hostComponentId: string, templateUrl: string, styleEl): Promise<any> {
@ -37,20 +40,21 @@ export class EmulatedScopedShadowDomStrategy extends EmulatedUnscopedShadowDomSt
cssText = this.styleUrlResolver.resolveUrls(cssText, templateUrl);
var inlinedCss = this.styleInliner.inlineImports(cssText, templateUrl);
var ret = null;
if (isPromise(inlinedCss)) {
DOM.setText(styleEl, '');
return (<Promise<string>>inlinedCss)
.then((css) => {
css = shimCssForComponent(css, hostComponentId);
DOM.setText(styleEl, css);
this._moveToStyleHost(styleEl);
});
ret = (<Promise<string>>inlinedCss)
.then((css) => {
css = shimCssForComponent(css, hostComponentId);
DOM.setText(styleEl, css);
});
} else {
var css = shimCssForComponent(<string>inlinedCss, hostComponentId);
DOM.setText(styleEl, css);
this._moveToStyleHost(styleEl);
return null;
}
this._moveToStyleHost(styleEl);
return ret;
}
_moveToStyleHost(styleEl) {

21
modules/angular2/src/render/dom/shadow_dom/emulated_unscoped_shadow_dom_strategy.ts
View File

@ -1,3 +1,4 @@
import {isPromise} from 'angular2/src/facade/lang';
import {Promise} from 'angular2/src/facade/async';
import {DOM} from 'angular2/src/dom/dom_adapter';
@ -7,6 +8,7 @@ import * as viewModule from '../view/view';
import {LightDom} from './light_dom';
import {ShadowDomStrategy} from './shadow_dom_strategy';
import {StyleUrlResolver} from './style_url_resolver';
import {StyleInliner} from 'angular2/src/render/dom/shadow_dom/style_inliner';
import {insertSharedStyleText} from './util';
/**
@ -19,7 +21,10 @@ import {insertSharedStyleText} from './util';
* - you can **not** use shadow DOM specific selectors in the styles
*/
export class EmulatedUnscopedShadowDomStrategy extends ShadowDomStrategy {
constructor(public styleUrlResolver: StyleUrlResolver, public styleHost) { super(); }
constructor(public styleInliner: StyleInliner, public styleUrlResolver: StyleUrlResolver,
public styleHost) {
super();
}
hasNativeContentElement(): boolean { return false; }
@ -31,11 +36,19 @@ export class EmulatedUnscopedShadowDomStrategy extends ShadowDomStrategy {
processStyleElement(hostComponentId: string, templateUrl: string, styleEl): Promise<any> {
var cssText = DOM.getText(styleEl);
cssText = this.styleUrlResolver.resolveUrls(cssText, templateUrl);
DOM.setText(styleEl, cssText);
DOM.remove(styleEl);
var inlinedCss = this.styleInliner.inlineImports(cssText, templateUrl);
var ret = null;
if (isPromise(inlinedCss)) {
DOM.setText(styleEl, '');
ret = (<Promise<string>>inlinedCss).then(css => { DOM.setText(styleEl, css); });
} else {
DOM.setText(styleEl, <string>inlinedCss);
}
insertSharedStyleText(cssText, this.styleHost, styleEl);
return null;
return ret;
}
}

17
modules/angular2/src/render/dom/shadow_dom/native_shadow_dom_strategy.ts
View File

@ -1,3 +1,4 @@
import {isPromise} from 'angular2/src/facade/lang';
import {Promise} from 'angular2/src/facade/async';
import {Injectable} from 'angular2/di';
@ -5,6 +6,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
import {StyleUrlResolver} from './style_url_resolver';
import {ShadowDomStrategy} from './shadow_dom_strategy';
import {StyleInliner} from 'angular2/src/render/dom/shadow_dom/style_inliner';
/**
* This strategies uses the native Shadow DOM support.
@ -14,14 +16,23 @@ import {ShadowDomStrategy} from './shadow_dom_strategy';
*/
@Injectable()
export class NativeShadowDomStrategy extends ShadowDomStrategy {
constructor(public styleUrlResolver: StyleUrlResolver) { super(); }
constructor(public styleInliner: StyleInliner, public styleUrlResolver: StyleUrlResolver) {
super();
}
prepareShadowRoot(el) { return DOM.createShadowRoot(el); }
processStyleElement(hostComponentId: string, templateUrl: string, styleEl): Promise<any> {
var cssText = DOM.getText(styleEl);
cssText = this.styleUrlResolver.resolveUrls(cssText, templateUrl);
DOM.setText(styleEl, cssText);
return null;
var inlinedCss = this.styleInliner.inlineImports(cssText, templateUrl);
if (isPromise(inlinedCss)) {
return (<Promise<string>>inlinedCss).then(css => { DOM.setText(styleEl, css); });
} else {
DOM.setText(styleEl, <string>inlinedCss);
return null;
}
}
}

6
modules/angular2/src/test_lib/test_injector.ts
View File

@ -85,9 +85,9 @@ function _getAppBindings() {
bind(DOCUMENT_TOKEN)
.toValue(appDoc),
bind(ShadowDomStrategy)
.toFactory((styleUrlResolver, doc) =>
new EmulatedUnscopedShadowDomStrategy(styleUrlResolver, doc.head),
[StyleUrlResolver, DOCUMENT_TOKEN]),
.toFactory((styleInliner, styleUrlResolver, doc) => new EmulatedUnscopedShadowDomStrategy(
styleInliner, styleUrlResolver, doc.head),
[StyleInliner, StyleUrlResolver, DOCUMENT_TOKEN]),
DomRenderer,
DefaultDomCompiler,
bind(Renderer).toAlias(DomRenderer),