From ba869683edca9ed8206c50bfaeb6dcf42dc035b4 Mon Sep 17 00:00:00 2001 From: Victor Berchet Date: Mon, 2 Mar 2015 15:02:48 +0100 Subject: [PATCH 1/2] refactor(Compiler): make shadow DOM stragegy support more flexible --- modules/angular2/src/core/application.js | 2 + .../angular2/src/core/compiler/compiler.js | 9 +- .../src/core/compiler/css_processor.js | 48 ++++ .../core/compiler/pipeline/default_steps.js | 16 +- .../src/core/compiler/pipeline/resolve_css.js | 47 ---- .../core/compiler/pipeline/shim_shadow_dom.js | 35 --- .../src/core/compiler/shadow_dom_strategy.js | 256 +++++++++++++----- modules/angular2/src/core/compiler/view.js | 2 +- .../core/compiler/compiler_common_tests.js | 4 +- .../test/core/compiler/css_processor_spec.js | 82 ++++++ .../test/core/compiler/integration_spec.js | 4 +- .../compiler/pipeline/resolve_css_spec.js | 137 ---------- .../compiler/pipeline/shim_shadow_dom_spec.js | 88 ------ .../shadow_dom_emulation_integration_spec.js | 4 +- .../core/compiler/shadow_dom_strategy_spec.js | 202 +++++++++----- .../angular2/test/directives/foreach_spec.js | 5 +- modules/angular2/test/directives/if_spec.js | 5 +- .../test/directives/non_bindable_spec.js | 6 +- .../angular2/test/directives/switch_spec.js | 5 +- .../angular2/test/forms/integration_spec.js | 4 +- .../src/compiler/compiler_benchmark.js | 5 +- .../src/naive_infinite_scroll/index.js | 13 +- modules/benchmarks/src/tree/tree_benchmark.js | 13 +- .../examples/src/hello_world/index_static.js | 13 +- 24 files changed, 532 insertions(+), 473 deletions(-) create mode 100644 modules/angular2/src/core/compiler/css_processor.js delete mode 100644 modules/angular2/src/core/compiler/pipeline/resolve_css.js delete mode 100644 modules/angular2/src/core/compiler/pipeline/shim_shadow_dom.js create mode 100644 modules/angular2/test/core/compiler/css_processor_spec.js delete mode 100644 modules/angular2/test/core/compiler/pipeline/resolve_css_spec.js delete mode 100644 modules/angular2/test/core/compiler/pipeline/shim_shadow_dom_spec.js diff --git a/modules/angular2/src/core/application.js b/modules/angular2/src/core/application.js index 49467422f42b..61b479d12bcf 100644 --- a/modules/angular2/src/core/application.js +++ b/modules/angular2/src/core/application.js @@ -24,6 +24,7 @@ import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mappe import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; var _rootInjector: Injector; @@ -98,6 +99,7 @@ function _injectorBindings(appComponentType): List { UrlResolver, StyleUrlResolver, StyleInliner, + CssProcessor, ]; } diff --git a/modules/angular2/src/core/compiler/compiler.js b/modules/angular2/src/core/compiler/compiler.js index 09a046f6c780..30a86171cc00 100644 --- a/modules/angular2/src/core/compiler/compiler.js +++ b/modules/angular2/src/core/compiler/compiler.js @@ -17,7 +17,7 @@ import {ShadowDomStrategy} from './shadow_dom_strategy'; import {CompileStep} from './pipeline/compile_step'; import {ComponentUrlMapper} from './component_url_mapper'; import {UrlResolver} from './url_resolver'; - +import {CssProcessor} from './css_processor'; /** * Cache that stores the ProtoView of the template of a component. @@ -61,6 +61,7 @@ export class Compiler { _componentUrlMapper: ComponentUrlMapper; _urlResolver: UrlResolver; _appUrl: string; + _cssProcessor: CssProcessor; constructor(changeDetection:ChangeDetection, templateLoader:TemplateLoader, @@ -70,7 +71,8 @@ export class Compiler { shadowDomStrategy: ShadowDomStrategy, templateResolver: TemplateResolver, componentUrlMapper: ComponentUrlMapper, - urlResolver: UrlResolver) { + urlResolver: UrlResolver, + cssProcessor: CssProcessor) { this._changeDetection = changeDetection; this._reader = reader; this._parser = parser; @@ -87,6 +89,7 @@ export class Compiler { this._componentUrlMapper = componentUrlMapper; this._urlResolver = urlResolver; this._appUrl = urlResolver.resolve(null, './'); + this._cssProcessor = cssProcessor; } createSteps(component:Type, template: Template):List { @@ -102,7 +105,7 @@ export class Compiler { var templateUrl = this._templateLoader.getTemplateUrl(template); return createDefaultSteps(this._changeDetection, this._parser, cmpMetadata, dirMetadata, - this._shadowDomStrategy, templateUrl); + this._shadowDomStrategy, templateUrl, this._cssProcessor); } compile(component: Type):Promise { diff --git a/modules/angular2/src/core/compiler/css_processor.js b/modules/angular2/src/core/compiler/css_processor.js new file mode 100644 index 000000000000..149b64804a45 --- /dev/null +++ b/modules/angular2/src/core/compiler/css_processor.js @@ -0,0 +1,48 @@ +import {DOM} from 'angular2/src/dom/dom_adapter'; + +import {isPresent} from 'angular2/src/facade/lang'; + +import {CompileStep} from './pipeline/compile_step'; +import {CompileElement} from './pipeline/compile_element'; +import {CompileControl} from './pipeline/compile_control'; + +import {ShadowDomStrategy} from './shadow_dom_strategy'; +import {DirectiveMetadata} from './directive_metadata'; + +/** + * Processes the ')); + + expect(results[0].ignoreBindings).toBe(false); + expect(results[1].ignoreBindings).toBe(true); + }); + + it('should execute the strategy step for style elements', () => { + var processedEls = []; + var compileStep = new MockStep((parent, current, control) => { + ListWrapper.push(processedEls, current.element); + }); + var strategy = new FakeShadowDomStrategy(compileStep); + + var cssProcessor = new CssProcessor(); + var pipeline = createPipeline(cssProcessor, strategy, 'http://base'); + var results = pipeline.process(el('
')); + + expect(processedEls.length).toEqual(1); + expect(processedEls[0]).toBe(results[1].element); + }); + }); + }); +} + +class FakeShadowDomStrategy extends ShadowDomStrategy { + _compileStep: CompileStep; + + constructor(compileStep: CompileStep) { + super(); + this._compileStep = compileStep; + } + + getStyleCompileStep(cmpMetadata: DirectiveMetadata, templateUrl: string): CompileStep { + return this._compileStep; + } +} + +class MockStep extends CompileStep { + processClosure:Function; + constructor(process) { + super(); + this.processClosure = process; + } + process(parent:CompileElement, current:CompileElement, control:CompileControl) { + this.processClosure(parent, current, control); + } +} + +class SomeComponent {} diff --git a/modules/angular2/test/core/compiler/integration_spec.js b/modules/angular2/test/core/compiler/integration_spec.js index 97caf7592a1c..b6130bdd9f13 100644 --- a/modules/angular2/test/core/compiler/integration_spec.js +++ b/modules/angular2/test/core/compiler/integration_spec.js @@ -17,6 +17,7 @@ import {BindingPropagationConfig} from 'angular2/src/core/compiler/binding_propa import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {Decorator, Component, Viewport} from 'angular2/src/core/annotations/annotations'; import {Template} from 'angular2/src/core/annotations/template'; @@ -40,7 +41,8 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver + urlResolver, + new CssProcessor() ); } diff --git a/modules/angular2/test/core/compiler/pipeline/resolve_css_spec.js b/modules/angular2/test/core/compiler/pipeline/resolve_css_spec.js deleted file mode 100644 index 2d1dafe6f639..000000000000 --- a/modules/angular2/test/core/compiler/pipeline/resolve_css_spec.js +++ /dev/null @@ -1,137 +0,0 @@ -import { - describe, - beforeEach, - expect, - it, - iit, - ddescribe, - el, - SpyObject, - proxy, -} from 'angular2/test_lib'; - -import {CompilePipeline} from 'angular2/src/core/compiler/pipeline/compile_pipeline'; -import {ResolveCss} from 'angular2/src/core/compiler/pipeline/resolve_css'; -import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_element'; -import {CompileStep} from 'angular2/src/core/compiler/pipeline/compile_step'; -import {CompileControl} from 'angular2/src/core/compiler/pipeline/compile_control'; - -import {Component} from 'angular2/src/core/annotations/annotations'; -import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata'; -import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy'; -import {ProtoView} from 'angular2/src/core/compiler/view'; - -import {IMPLEMENTS, Type, stringify} from 'angular2/src/facade/lang'; -import {DOM} from 'angular2/src/dom/dom_adapter'; -import {PromiseWrapper} from 'angular2/src/facade/async'; - -export function main() { - describe('ResolveCss', () => { - function createPipeline(strategy:ShadowDomStrategy) { - var annotation = new Component({selector: 'selector'}); - var meta = new DirectiveMetadata(SomeComponent, annotation); - var resolveCss = new ResolveCss(meta, strategy, 'http://base'); - return new CompilePipeline([ - new MockStep((parent, current, control) => { - current.inheritedProtoView = new ProtoView(null, null, null); - }), - resolveCss - ]); - } - - it('it should set ignoreBindings to true for style elements', () => { - var strategy = new DummyStrategy(); - strategy.spy('transformStyleText').andCallFake((a, b, c) => '.css {}'); - strategy.spy('handleStyleElement'); - - var pipeline = createPipeline(strategy); - var results = pipeline.process(el('
')); - expect(results[0].ignoreBindings).toBe(false); - expect(results[1].ignoreBindings).toBe(true); - }); - - it('should delegate the handling of style elements to the strategy', () => { - var strategy = new DummyStrategy(); - strategy.spy('transformStyleText').andCallFake((a, b, c) => '.css {}'); - strategy.spy('handleStyleElement'); - - var pipeline = createPipeline(strategy); - var template = el('
'); - var styleEl = el(''); - DOM.appendChild(template, styleEl); - - pipeline.process(template); - - expect(strategy.spy('handleStyleElement')).toHaveBeenCalledWith(styleEl); - }); - - it('should handle css transformed synchronously', () => { - var strategy = new DummyStrategy(); - strategy.spy('transformStyleText').andCallFake((css, url, cmp) => { - return `${css}, ${url}, ${stringify(cmp)}`; - }); - strategy.spy('handleStyleElement'); - - var pipeline = createPipeline(strategy); - var template = el('
'); - var styleEl = el(''); - DOM.appendChild(template, styleEl); - - var results = pipeline.process(template); - expect(styleEl).toHaveText('/*css*/, http://base, SomeComponent'); - expect(results[0].inheritedProtoView.stylePromises.length).toBe(0); - }); - - it('should handle css transformed asynchronously', (done) => { - var completer = PromiseWrapper.completer(); - var strategy = new DummyStrategy(); - var futureCss; - strategy.spy('transformStyleText').andCallFake((css, url, cmp) => { - futureCss = `${css}, ${url}, ${stringify(cmp)}`; - return completer.promise; - }); - strategy.spy('handleStyleElement'); - - var pipeline = createPipeline(strategy); - var template = el('
'); - var styleEl = el(''); - DOM.appendChild(template, styleEl); - - var results = pipeline.process(template); - - // The css should be empty before the style promise is resolved - expect(styleEl).toHaveText(''); - expect(results[0].inheritedProtoView.stylePromises[0]).toBe(completer.promise); - - completer.resolve(futureCss); - - // TODO(vicb): refactor once we have better support for async tests - completer.promise.then((_) => { - expect(styleEl).toHaveText('/*css*/, http://base, SomeComponent'); - done(); - }); - }); - }); -} - -@proxy -@IMPLEMENTS(ShadowDomStrategy) -class DummyStrategy extends SpyObject { - noSuchMethod(m) { - return super.noSuchMethod(m) - } -} - -class SomeComponent {} - -class MockStep extends CompileStep { - processClosure:Function; - constructor(process) { - super(); - this.processClosure = process; - } - process(parent:CompileElement, current:CompileElement, control:CompileControl) { - this.processClosure(parent, current, control); - } -} - diff --git a/modules/angular2/test/core/compiler/pipeline/shim_shadow_dom_spec.js b/modules/angular2/test/core/compiler/pipeline/shim_shadow_dom_spec.js deleted file mode 100644 index f1cfe489a4b8..000000000000 --- a/modules/angular2/test/core/compiler/pipeline/shim_shadow_dom_spec.js +++ /dev/null @@ -1,88 +0,0 @@ -import {describe, beforeEach, expect, it, iit, ddescribe, el} from 'angular2/test_lib'; - -import {CompilePipeline} from 'angular2/src/core/compiler/pipeline/compile_pipeline'; -import {ShimShadowDom} from 'angular2/src/core/compiler/pipeline/shim_shadow_dom'; -import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_element'; -import {CompileStep} from 'angular2/src/core/compiler/pipeline/compile_step'; -import {CompileControl} from 'angular2/src/core/compiler/pipeline/compile_control'; - -import {Component} from 'angular2/src/core/annotations/annotations'; -import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata'; -import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy'; - -import {Type, isBlank, stringify} from 'angular2/src/facade/lang'; -import {DOM} from 'angular2/src/dom/dom_adapter'; - -export function main() { - describe('ShimShadowDom', () => { - function createPipeline(ignoreBindings: boolean) { - var annotation = new Component({selector: 'selector'}); - var meta = new DirectiveMetadata(SomeComponent, annotation); - var shimShadowDom = new ShimShadowDom(meta, new FakeStrategy()); - - return new CompilePipeline([ - new MockStep((parent, current, control) => { - current.ignoreBindings = ignoreBindings; - }), - new MockStep((parent, current, control) => { - var el = current.element; - if (DOM.hasClass(el, 'host')) { - current.componentDirective = new DirectiveMetadata(SomeComponent, null); - } - }), - shimShadowDom - ]); - } - - it('should add the content attribute to content element', () => { - var pipeline = createPipeline(false); - var results = pipeline.process(el('
')); - expect(DOM.getAttribute(results[0].element, 'SomeComponent-content')).toEqual(''); - expect(isBlank(DOM.getAttribute(results[0].element, 'SomeComponent-host'))).toBeTruthy(); - }); - - it('should add both the content and host attributes to host element', () => { - var pipeline = createPipeline(false); - var results = pipeline.process(el('
')); - expect(DOM.getAttribute(results[0].element, 'SomeComponent-content')).toEqual(''); - expect(DOM.getAttribute(results[0].element, 'SomeComponent-host')).toEqual(''); - }); - - it('should do nothing when ignoreBindings is true', () => { - var pipeline = createPipeline(true); - var results = pipeline.process(el('
')); - expect(isBlank(DOM.getAttribute(results[0].element, 'SomeComponent-content'))).toBeTruthy(); - expect(isBlank(DOM.getAttribute(results[0].element, 'SomeComponent-host'))).toBeTruthy(); - }); - }); -} - -class FakeStrategy extends ShadowDomStrategy { - constructor() { - super(); - } - - shimContentElement(component: Type, element) { - var attrName = stringify(component) + '-content'; - DOM.setAttribute(element, attrName, ''); - } - - shimHostElement(component: Type, element) { - var attrName = stringify(component) + '-host'; - DOM.setAttribute(element, attrName, ''); - } -} - -class MockStep extends CompileStep { - processClosure:Function; - constructor(process) { - super(); - this.processClosure = process; - } - process(parent:CompileElement, current:CompileElement, control:CompileControl) { - this.processClosure(parent, current, control); - } -} - -class SomeComponent {} - diff --git a/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js b/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js index f6bb8ff52d6b..b938db683444 100644 --- a/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js +++ b/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js @@ -21,6 +21,7 @@ import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mappe import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {MockTemplateResolver} from 'angular2/src/mock/template_resolver_mock'; @@ -58,7 +59,8 @@ export function main() { strategy, tplResolver, new ComponentUrlMapper(), - urlResolver + urlResolver, + new CssProcessor() ); }); diff --git a/modules/angular2/test/core/compiler/shadow_dom_strategy_spec.js b/modules/angular2/test/core/compiler/shadow_dom_strategy_spec.js index 3895905d6d41..65e8620cb258 100644 --- a/modules/angular2/test/core/compiler/shadow_dom_strategy_spec.js +++ b/modules/angular2/test/core/compiler/shadow_dom_strategy_spec.js @@ -10,6 +10,10 @@ import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; import {ProtoView} from 'angular2/src/core/compiler/view'; +import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata'; + +import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_element'; + import {XHR} from 'angular2/src/core/compiler/xhr/xhr'; import {isPresent, isBlank} from 'angular2/src/facade/lang'; @@ -41,16 +45,24 @@ export function main() { expect(shadowRoot).toHaveText('view'); }); + it('should should not transform template elements', () => { + expect(strategy.getTemplateCompileStep(null)).toBe(null); + }); + it('should rewrite style urls', () => { - var css = '.foo {background-image: url("img.jpg");}'; - expect(strategy.transformStyleText(css, 'http://base', null)) - .toEqual(".foo {background-image: url('http://base/img.jpg');}"); + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElement = DOM.createStyleElement('.one {background-image: url("img.jpg");}'); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText(".one {background-image: url('http://base/img.jpg');}"); }); it('should not inline import rules', () => { - var css = '@import "other.css";'; - expect(strategy.transformStyleText(css, 'http://base', null)) - .toEqual("@import 'http://base/other.css';"); + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElement = DOM.createStyleElement('@import "other.css";'); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText("@import 'http://base/other.css';"); }); }); @@ -81,65 +93,113 @@ export function main() { }); it('should rewrite style urls', () => { - var css = '.foo {background-image: url("img.jpg");}'; - expect(strategy.transformStyleText(css, 'http://base', SomeComponent)) - .toEqual(".foo[_ngcontent-0] {\nbackground-image: url(http://base/img.jpg);\n}"); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText(".foo[_ngcontent-0] {\n" + + "background-image: url(http://base/img.jpg);\n" + + "}"); }); - it('should scope style', () => { - var css = '.foo {} :host {}'; - expect(strategy.transformStyleText(css, 'http://base', SomeComponent)) - .toEqual(".foo[_ngcontent-0] {\n\n}\n\n[_nghost-0] {\n\n}"); + it('should scope styles', () => { + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText(".foo[_ngcontent-0] {\n\n}\n\n[_nghost-0] {\n\n}"); }); it('should inline @import rules', (done) => { xhr.reply('http://base/one.css', '.one {}'); - var css = '@import "one.css";'; - var promise = strategy.transformStyleText(css, 'http://base', SomeComponent); - expect(promise).toBePromise(); - promise.then((css) => { - expect(css).toEqual('.one[_ngcontent-0] {\n\n}'); + + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var parentElement = new CompileElement(template); + var compileElement = new CompileElement(styleElement); + var parentpv = new ProtoView(null, null, null); + parentElement.inheritedProtoView = parentpv; + step.process(parentElement, compileElement, null); + + expect(parentpv.stylePromises.length).toEqual(1); + expect(parentpv.stylePromises[0]).toBePromise(); + + expect(styleElement).toHaveText(''); + parentpv.stylePromises[0].then((_) => { + expect(styleElement).toHaveText('.one[_ngcontent-0] {\n\n}'); done(); }); }); it('should return the same style given the same component', () => { - var css = '.foo {} :host {}'; - expect(strategy.transformStyleText(css, 'http://base', SomeComponent)) - .toEqual(".foo[_ngcontent-0] {\n\n}\n\n[_nghost-0] {\n\n}"); - expect(strategy.transformStyleText(css, 'http://base', SomeComponent)) - .toEqual(".foo[_ngcontent-0] {\n\n}\n\n[_nghost-0] {\n\n}"); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + + var template2 = el('
'); + var step2 = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement2 = DOM.firstChild(template2); + var compileElement2 = new CompileElement(styleElement2); + step2.process(null, compileElement2, null); + + expect(DOM.getText(styleElement)).toEqual(DOM.getText(styleElement2)); }); it('should return different styles given different components', () => { - var css = '.foo {} :host {}'; - expect(strategy.transformStyleText(css, 'http://base', SomeComponent)) - .toEqual(".foo[_ngcontent-0] {\n\n}\n\n[_nghost-0] {\n\n}"); - expect(strategy.transformStyleText(css, 'http://base', SomeOtherComponent)) - .toEqual(".foo[_ngcontent-1] {\n\n}\n\n[_nghost-1] {\n\n}"); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + + var template2 = el('
'); + var cmpMetadata2 = new DirectiveMetadata(SomeOtherComponent, null); + var step2 = strategy.getStyleCompileStep(cmpMetadata2, 'http://base'); + var styleElement2 = DOM.firstChild(template2); + var compileElement2 = new CompileElement(styleElement2); + step2.process(null, compileElement2, null); + + expect(DOM.getText(styleElement)).not.toEqual(DOM.getText(styleElement2)); }); it('should move the style element to the style host', () => { - var originalHost = el('
'); - var styleEl = el(''); - DOM.appendChild(originalHost, styleEl); - expect(originalHost).toHaveText('/*css*/'); - - strategy.handleStyleElement(styleEl); - expect(originalHost).toHaveText(''); - expect(styleHost).toHaveText('/*css*/'); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getStyleCompileStep(cmpMetadata, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(template).toHaveText(''); + expect(styleHost).toHaveText('.one[_ngcontent-0] {\n\n}'); }); it('should add an attribute to the content elements', () => { - var elt = el('
'); - strategy.shimContentElement(SomeComponent, elt); - expect(DOM.getAttribute(elt, '_ngcontent-0')).toEqual(''); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getTemplateCompileStep(cmpMetadata); + var compileElement = new CompileElement(template); + step.process(null, compileElement, null); + expect(DOM.getAttribute(template, '_ngcontent-0')).toEqual(''); }); it('should add an attribute to the host elements', () => { - var elt = el('
'); - strategy.shimHostElement(SomeComponent, elt); - expect(DOM.getAttribute(elt, '_nghost-0')).toEqual(''); + var template = el('
'); + var cmpMetadata = new DirectiveMetadata(SomeComponent, null); + var step = strategy.getTemplateCompileStep(cmpMetadata); + var compileElement = new CompileElement(template); + compileElement.componentDirective = new DirectiveMetadata(SomeOtherComponent, null); + step.process(null, compileElement, null); + expect(DOM.getAttribute(template, '_nghost-1')).toEqual(''); }); }); @@ -168,43 +228,45 @@ export function main() { }); it('should rewrite style urls', () => { - var css = '.foo {background-image: url("img.jpg");}'; - expect(strategy.transformStyleText(css, 'http://base', null)) - .toEqual(".foo {background-image: url('http://base/img.jpg');}"); + var template = el('
') + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText(".one {background-image: url('http://base/img.jpg');}"); }); it('should not inline import rules', () => { - var css = '@import "other.css";'; - expect(strategy.transformStyleText(css, 'http://base', null)) - .toEqual("@import 'http://base/other.css';"); + var template = el('
') + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleElement).toHaveText("@import 'http://base/other.css';"); }); it('should move the style element to the style host', () => { - var originalHost = el('
'); - var styleEl = el(''); - DOM.appendChild(originalHost, styleEl); - expect(originalHost).toHaveText('/*css*/'); - - strategy.handleStyleElement(styleEl); - expect(originalHost).toHaveText(''); - expect(styleHost).toHaveText('/*css*/'); + var template = el('
') + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElement = DOM.firstChild(template); + var compileElement = new CompileElement(styleElement); + step.process(null, compileElement, null); + expect(styleHost).toHaveText("/*css*/"); }); it('should insert the same style only once in the style host', () => { - var originalHost = el('
'); - var styleEl1 = el(''); - var styleEl2 = el(''); - var styleEl1bis = el(''); - - DOM.appendChild(originalHost, styleEl1); - DOM.appendChild(originalHost, styleEl2); - DOM.appendChild(originalHost, styleEl1bis); - - strategy.handleStyleElement(styleEl1); - strategy.handleStyleElement(styleEl2); - strategy.handleStyleElement(styleEl1bis); - expect(originalHost).toHaveText(''); - expect(styleHost).toHaveText('/*css 1*//*css 2*/'); + var template = el('
' + + '
') + var step = strategy.getStyleCompileStep(null, 'http://base'); + var styleElements = DOM.childNodes(template); + var compileElement = new CompileElement(styleElements[0]); + step.process(null, compileElement, null); + compileElement = new CompileElement(styleElements[0]); + step.process(null, compileElement, null); + compileElement = new CompileElement(styleElements[0]); + step.process(null, compileElement, null); + + expect(styleHost).toHaveText("/*css1*//*css2*/"); }); }); } diff --git a/modules/angular2/test/directives/foreach_spec.js b/modules/angular2/test/directives/foreach_spec.js index 18e678707b42..5a2281a98cbd 100644 --- a/modules/angular2/test/directives/foreach_spec.js +++ b/modules/angular2/test/directives/foreach_spec.js @@ -13,6 +13,7 @@ import {TemplateLoader} from 'angular2/src/core/compiler/template_loader'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {Template} from 'angular2/src/core/annotations/template'; import {Decorator, Component, Viewport} from 'angular2/src/core/annotations/annotations'; @@ -36,7 +37,9 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver); + urlResolver, + new CssProcessor() + ); }); function createView(pv) { diff --git a/modules/angular2/test/directives/if_spec.js b/modules/angular2/test/directives/if_spec.js index 0992f247c0c4..404b7c443783 100644 --- a/modules/angular2/test/directives/if_spec.js +++ b/modules/angular2/test/directives/if_spec.js @@ -12,6 +12,7 @@ import {TemplateLoader} from 'angular2/src/core/compiler/template_loader'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {Component} from 'angular2/src/core/annotations/annotations'; import {Template} from 'angular2/src/core/annotations/template'; @@ -36,7 +37,9 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver); + urlResolver, + new CssProcessor() + ); }); function createView(pv) { diff --git a/modules/angular2/test/directives/non_bindable_spec.js b/modules/angular2/test/directives/non_bindable_spec.js index 66e2f1508e0f..ca6182283ea7 100644 --- a/modules/angular2/test/directives/non_bindable_spec.js +++ b/modules/angular2/test/directives/non_bindable_spec.js @@ -9,6 +9,8 @@ import {NativeShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_str import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; + import {Decorator, Component} from 'angular2/src/core/annotations/annotations'; import {Template} from 'angular2/src/core/annotations/template'; @@ -33,7 +35,9 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver); + urlResolver, + new CssProcessor() + ); }); function createView(pv) { diff --git a/modules/angular2/test/directives/switch_spec.js b/modules/angular2/test/directives/switch_spec.js index 9d8e93e15f92..69cefebef906 100644 --- a/modules/angular2/test/directives/switch_spec.js +++ b/modules/angular2/test/directives/switch_spec.js @@ -9,6 +9,7 @@ import {NativeShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_str import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {Component} from 'angular2/src/core/annotations/annotations'; import {Template} from 'angular2/src/core/annotations/template'; @@ -31,7 +32,9 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver); + urlResolver, + new CssProcessor() + ); }); function createView(pv) { diff --git a/modules/angular2/test/forms/integration_spec.js b/modules/angular2/test/forms/integration_spec.js index 745be3c2e280..f7ddb68b1db4 100644 --- a/modules/angular2/test/forms/integration_spec.js +++ b/modules/angular2/test/forms/integration_spec.js @@ -9,6 +9,7 @@ import {TemplateLoader} from 'angular2/src/core/compiler/template_loader'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {MockTemplateResolver} from 'angular2/src/mock/template_resolver_mock'; @@ -37,7 +38,8 @@ export function main() { new NativeShadowDomStrategy(new StyleUrlResolver(urlResolver)), tplResolver, new ComponentUrlMapper(), - urlResolver + urlResolver, + new CssProcessor() ); tplResolver.setTemplate(componentType, new Template({ diff --git a/modules/benchmarks/src/compiler/compiler_benchmark.js b/modules/benchmarks/src/compiler/compiler_benchmark.js index 805396310da8..6cda00922bd8 100644 --- a/modules/benchmarks/src/compiler/compiler_benchmark.js +++ b/modules/benchmarks/src/compiler/compiler_benchmark.js @@ -19,6 +19,7 @@ import {TemplateResolver} from 'angular2/src/core/compiler/template_resolver'; import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {reflector} from 'angular2/src/reflection/reflection'; import {getIntParameter, bindAction} from 'angular2/src/test_lib/benchmark_util'; @@ -100,7 +101,9 @@ export function main() { new NativeShadowDomStrategy(styleUrlResolver), templateResolver, new ComponentUrlMapper(), - urlResolver); + urlResolver, + new CssProcessor() + ); var templateNoBindings = createTemplateHtml('templateNoBindings', count); var templateWithBindings = createTemplateHtml('templateWithBindings', count); diff --git a/modules/benchmarks/src/naive_infinite_scroll/index.js b/modules/benchmarks/src/naive_infinite_scroll/index.js index 1bf7c058bb1d..623a690811f3 100644 --- a/modules/benchmarks/src/naive_infinite_scroll/index.js +++ b/modules/benchmarks/src/naive_infinite_scroll/index.js @@ -21,6 +21,7 @@ import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {If, Foreach} from 'angular2/directives'; import {App, setupReflectorForApp} from './app'; @@ -180,12 +181,12 @@ export function setupReflectorForAngular() { reflector.registerType(Compiler, { "factory": (changeDetection, templateLoader, reader, parser, compilerCache, shadowDomStrategy, - tplResolver, cmpUrlMapper, urlResolver) => + tplResolver, cmpUrlMapper, urlResolver, cssProcessor) => new Compiler(changeDetection, templateLoader, reader, parser, compilerCache, shadowDomStrategy, - tplResolver, cmpUrlMapper, urlResolver), + tplResolver, cmpUrlMapper, urlResolver, cssProcessor), "parameters": [[ChangeDetection], [TemplateLoader], [DirectiveMetadataReader], [Parser], [CompilerCache], [ShadowDomStrategy], [TemplateResolver], [ComponentUrlMapper], - [UrlResolver]], + [UrlResolver], [CssProcessor]], "annotations": [] }); @@ -279,4 +280,10 @@ export function setupReflectorForAngular() { "parameters": [[XHR], [StyleUrlResolver], [UrlResolver]], "annotations": [] }); + + reflector.registerType(CssProcessor, { + "factory": () => new CssProcessor(), + "parameters": [], + "annotations": [] + }); } diff --git a/modules/benchmarks/src/tree/tree_benchmark.js b/modules/benchmarks/src/tree/tree_benchmark.js index 8dc8afd4f9ad..cd0de5f438f3 100644 --- a/modules/benchmarks/src/tree/tree_benchmark.js +++ b/modules/benchmarks/src/tree/tree_benchmark.js @@ -14,6 +14,7 @@ import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {reflector} from 'angular2/src/reflection/reflection'; import {DOM} from 'angular2/src/dom/dom_adapter'; @@ -69,12 +70,12 @@ function setupReflector() { reflector.registerType(Compiler, { 'factory': (cd, templateLoader, reader, parser, compilerCache, strategy, tplResolver, - cmpUrlMapper, urlResolver) => + cmpUrlMapper, urlResolver, cssProcessor) => new Compiler(cd, templateLoader, reader, parser, compilerCache, strategy, tplResolver, - cmpUrlMapper, urlResolver), + cmpUrlMapper, urlResolver, cssProcessor), 'parameters': [[ChangeDetection], [TemplateLoader], [DirectiveMetadataReader], [Parser], [CompilerCache], [ShadowDomStrategy], [TemplateResolver], - [ComponentUrlMapper], [UrlResolver]], + [ComponentUrlMapper], [UrlResolver], [CssProcessor]], 'annotations': [] }); @@ -170,6 +171,12 @@ function setupReflector() { "annotations": [] }); + reflector.registerType(CssProcessor, { + "factory": () => new CssProcessor(), + "parameters": [], + "annotations": [] + }); + reflector.registerGetters({ 'value': (a) => a.value, 'left': (a) => a.left, diff --git a/modules/examples/src/hello_world/index_static.js b/modules/examples/src/hello_world/index_static.js index 95db8c470404..0c978512e44b 100644 --- a/modules/examples/src/hello_world/index_static.js +++ b/modules/examples/src/hello_world/index_static.js @@ -16,6 +16,7 @@ import {UrlResolver} from 'angular2/src/core/compiler/url_resolver'; import {StyleUrlResolver} from 'angular2/src/core/compiler/style_url_resolver'; import {ComponentUrlMapper} from 'angular2/src/core/compiler/component_url_mapper'; import {StyleInliner} from 'angular2/src/core/compiler/style_inliner'; +import {CssProcessor} from 'angular2/src/core/compiler/css_processor'; import {reflector} from 'angular2/src/reflection/reflection'; @@ -49,12 +50,12 @@ function setup() { reflector.registerType(Compiler, { "factory": (changeDetection, templateLoader, reader, parser, compilerCache, shadowDomStrategy, - tplResolver, cmpUrlMapper, urlResolver) => + tplResolver, cmpUrlMapper, urlResolver, cssProcessor) => new Compiler(changeDetection, templateLoader, reader, parser, compilerCache, shadowDomStrategy, - tplResolver, cmpUrlMapper, urlResolver), + tplResolver, cmpUrlMapper, urlResolver, cssProcessor), "parameters": [[ChangeDetection], [TemplateLoader], [DirectiveMetadataReader], [Parser], [CompilerCache], [ShadowDomStrategy], [TemplateResolver], [ComponentUrlMapper], - [UrlResolver]], + [UrlResolver], [CssProcessor]], "annotations": [] }); @@ -149,6 +150,12 @@ function setup() { "annotations": [] }); + reflector.registerType(CssProcessor, { + "factory": () => new CssProcessor(), + "parameters": [], + "annotations": [] + }); + reflector.registerGetters({ "greeting": (a) => a.greeting }); From 48d4568b747631be318018e2990142f7cfffbe3c Mon Sep 17 00:00:00 2001 From: Victor Berchet Date: Tue, 3 Mar 2015 11:32:19 +0100 Subject: [PATCH 2/2] feat(CssProcessor): add support for CssTransformers --- modules/angular2/src/core/application.js | 2 +- .../src/core/compiler/css_processor.js | 27 ++++++++++++-- .../core/compiler/compiler_common_tests.js | 2 +- .../test/core/compiler/css_processor_spec.js | 36 +++++++++++++++++-- .../test/core/compiler/integration_spec.js | 2 +- .../shadow_dom_emulation_integration_spec.js | 2 +- .../angular2/test/directives/foreach_spec.js | 2 +- modules/angular2/test/directives/if_spec.js | 2 +- .../test/directives/non_bindable_spec.js | 2 +- .../angular2/test/directives/switch_spec.js | 2 +- .../angular2/test/forms/integration_spec.js | 4 +-- .../src/compiler/compiler_benchmark.js | 2 +- .../src/naive_infinite_scroll/index.js | 2 +- modules/benchmarks/src/tree/tree_benchmark.js | 2 +- .../examples/src/hello_world/index_static.js | 2 +- 15 files changed, 71 insertions(+), 20 deletions(-) diff --git a/modules/angular2/src/core/application.js b/modules/angular2/src/core/application.js index 61b479d12bcf..2a6e3093598a 100644 --- a/modules/angular2/src/core/application.js +++ b/modules/angular2/src/core/application.js @@ -99,7 +99,7 @@ function _injectorBindings(appComponentType): List { UrlResolver, StyleUrlResolver, StyleInliner, - CssProcessor, + bind(CssProcessor).toFactory(() => new CssProcessor(null), []), ]; } diff --git a/modules/angular2/src/core/compiler/css_processor.js b/modules/angular2/src/core/compiler/css_processor.js index 149b64804a45..82a310e80434 100644 --- a/modules/angular2/src/core/compiler/css_processor.js +++ b/modules/angular2/src/core/compiler/css_processor.js @@ -1,6 +1,7 @@ import {DOM} from 'angular2/src/dom/dom_adapter'; import {isPresent} from 'angular2/src/facade/lang'; +import {List} from 'angular2/src/facade/collection'; import {CompileStep} from './pipeline/compile_step'; import {CompileElement} from './pipeline/compile_element'; @@ -10,9 +11,16 @@ import {ShadowDomStrategy} from './shadow_dom_strategy'; import {DirectiveMetadata} from './directive_metadata'; /** - * Processes the ')); @@ -44,13 +46,26 @@ export function main() { }); var strategy = new FakeShadowDomStrategy(compileStep); - var cssProcessor = new CssProcessor(); + var cssProcessor = new CssProcessor(null); var pipeline = createPipeline(cssProcessor, strategy, 'http://base'); var results = pipeline.process(el('
')); expect(processedEls.length).toEqual(1); expect(processedEls[0]).toBe(results[1].element); }); + + it('should apply the given transformers', () => { + var strategy = new FakeShadowDomStrategy(null); + var cssProcessor = new CssProcessor([ + new FakeCssTransformer('/*transformer1 */'), + new FakeCssTransformer('/*transformer2 */'), + ]); + + var pipeline = createPipeline(cssProcessor, strategy, 'http://base'); + var results = pipeline.process(el('
')); + + expect(results[1].element).toHaveText('/*transformer1 *//*transformer2 */'); + }); }); }); } @@ -79,4 +94,19 @@ class MockStep extends CompileStep { } } +class FakeCssTransformer extends CssTransformer { + _css: string; + + constructor(css: string) { + super(); + this._css = css; + } + + transform(styleEl) { + var cssText = DOM.getText(styleEl); + cssText += this._css; + DOM.setText(styleEl, cssText); + } +} + class SomeComponent {} diff --git a/modules/angular2/test/core/compiler/integration_spec.js b/modules/angular2/test/core/compiler/integration_spec.js index b6130bdd9f13..586bc2702aa9 100644 --- a/modules/angular2/test/core/compiler/integration_spec.js +++ b/modules/angular2/test/core/compiler/integration_spec.js @@ -42,7 +42,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); } diff --git a/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js b/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js index b938db683444..4aef3545855d 100644 --- a/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js +++ b/modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js @@ -60,7 +60,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); }); diff --git a/modules/angular2/test/directives/foreach_spec.js b/modules/angular2/test/directives/foreach_spec.js index 5a2281a98cbd..4d37c660d3b0 100644 --- a/modules/angular2/test/directives/foreach_spec.js +++ b/modules/angular2/test/directives/foreach_spec.js @@ -38,7 +38,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); }); diff --git a/modules/angular2/test/directives/if_spec.js b/modules/angular2/test/directives/if_spec.js index 404b7c443783..8c56515c283e 100644 --- a/modules/angular2/test/directives/if_spec.js +++ b/modules/angular2/test/directives/if_spec.js @@ -38,7 +38,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); }); diff --git a/modules/angular2/test/directives/non_bindable_spec.js b/modules/angular2/test/directives/non_bindable_spec.js index ca6182283ea7..f42ccf0184d4 100644 --- a/modules/angular2/test/directives/non_bindable_spec.js +++ b/modules/angular2/test/directives/non_bindable_spec.js @@ -36,7 +36,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); }); diff --git a/modules/angular2/test/directives/switch_spec.js b/modules/angular2/test/directives/switch_spec.js index 69cefebef906..e83a621f3cf3 100644 --- a/modules/angular2/test/directives/switch_spec.js +++ b/modules/angular2/test/directives/switch_spec.js @@ -33,7 +33,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); }); diff --git a/modules/angular2/test/forms/integration_spec.js b/modules/angular2/test/forms/integration_spec.js index f7ddb68b1db4..e5245963bd0c 100644 --- a/modules/angular2/test/forms/integration_spec.js +++ b/modules/angular2/test/forms/integration_spec.js @@ -39,7 +39,7 @@ export function main() { tplResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); tplResolver.setTemplate(componentType, new Template({ @@ -220,7 +220,7 @@ export function main() { }); }); }); - + describe("nested forms", () => { it("should init DOM with the given form object", (done) => { var form = new ControlGroup({ diff --git a/modules/benchmarks/src/compiler/compiler_benchmark.js b/modules/benchmarks/src/compiler/compiler_benchmark.js index 6cda00922bd8..280b57cf87d1 100644 --- a/modules/benchmarks/src/compiler/compiler_benchmark.js +++ b/modules/benchmarks/src/compiler/compiler_benchmark.js @@ -102,7 +102,7 @@ export function main() { templateResolver, new ComponentUrlMapper(), urlResolver, - new CssProcessor() + new CssProcessor(null) ); var templateNoBindings = createTemplateHtml('templateNoBindings', count); var templateWithBindings = createTemplateHtml('templateWithBindings', count); diff --git a/modules/benchmarks/src/naive_infinite_scroll/index.js b/modules/benchmarks/src/naive_infinite_scroll/index.js index 623a690811f3..9f9913990021 100644 --- a/modules/benchmarks/src/naive_infinite_scroll/index.js +++ b/modules/benchmarks/src/naive_infinite_scroll/index.js @@ -282,7 +282,7 @@ export function setupReflectorForAngular() { }); reflector.registerType(CssProcessor, { - "factory": () => new CssProcessor(), + "factory": () => new CssProcessor(null), "parameters": [], "annotations": [] }); diff --git a/modules/benchmarks/src/tree/tree_benchmark.js b/modules/benchmarks/src/tree/tree_benchmark.js index cd0de5f438f3..3f7aaf0c4889 100644 --- a/modules/benchmarks/src/tree/tree_benchmark.js +++ b/modules/benchmarks/src/tree/tree_benchmark.js @@ -172,7 +172,7 @@ function setupReflector() { }); reflector.registerType(CssProcessor, { - "factory": () => new CssProcessor(), + "factory": () => new CssProcessor(null), "parameters": [], "annotations": [] }); diff --git a/modules/examples/src/hello_world/index_static.js b/modules/examples/src/hello_world/index_static.js index 0c978512e44b..f2c2a22ab3ba 100644 --- a/modules/examples/src/hello_world/index_static.js +++ b/modules/examples/src/hello_world/index_static.js @@ -151,7 +151,7 @@ function setup() { }); reflector.registerType(CssProcessor, { - "factory": () => new CssProcessor(), + "factory": () => new CssProcessor(null), "parameters": [], "annotations": [] });