honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(CssProcessor): add support for CssTransformers 

Closes #860
This commit is contained in:
Victor Berchet 2015-03-03 11:32:19 +01:00 committed by Misko Hevery
parent 9982520a23
commit 03793d0714
15 changed files with 71 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
modules/angular2/src/core/application.js vendored
View File

@ -99,7 +99,7 @@ function _injectorBindings(appComponentType): List<Binding> {
UrlResolver,
StyleUrlResolver,
StyleInliner,
CssProcessor,
bind(CssProcessor).toFactory(() => new CssProcessor(null), []),
];
}

27
modules/angular2/src/core/compiler/css_processor.js vendored
View File

@ -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 <style> tags during the compilation.
* Processes the <style> tags during the compilation:
* - Apply any given transformers,
* - Apply the shadow DOM strategy style step.
*/
export class CssProcessor {
_transformers: List<CssTransformer>;
constructor(transformers: List<CssTransformer>) {
this._transformers = transformers;
}
/**
* Returns a compile step to be added to the compiler pipeline.
@ -24,22 +32,35 @@ export class CssProcessor {
getCompileStep(cmpMetadata: DirectiveMetadata, shadowDomStrategy: ShadowDomStrategy,
templateUrl: string) {
var strategyStep = shadowDomStrategy.getStyleCompileStep(cmpMetadata, templateUrl);
return new _CssProcessorStep(strategyStep);
return new _CssProcessorStep(strategyStep, this._transformers);
}
}
export class CssTransformer {
transform(styleElement) {};
}
class _CssProcessorStep extends CompileStep {
_strategyStep: CompileStep;
_transformers: List<CssTransformer>;
constructor(strategyStep: CompileStep) {
constructor(strategyStep: CompileStep, transformers: List<CssTransformer>) {
super();
this._strategyStep = strategyStep;
this._transformers = transformers;
}
process(parent:CompileElement, current:CompileElement, control:CompileControl) {
if (DOM.tagName(current.element) == 'STYLE') {
current.ignoreBindings = true;
if (isPresent(this._transformers)) {
var styleEl = current.element;
for (var i = 0; i < this._transformers.length; i++) {
this._transformers[i].transform(styleEl);
}
}
if (isPresent(this._strategyStep)) {
this._strategyStep.process(parent, current, control);
}

2
modules/angular2/test/core/compiler/compiler_common_tests.js vendored
View File

@ -302,7 +302,7 @@ class TestableCompiler extends Compiler {
templateResolver,
cmpUrlMapper,
urlResolver,
new CssProcessor());
new CssProcessor(null));
this.steps = steps;
}

36
modules/angular2/test/core/compiler/css_processor_spec.js vendored
View File

@ -1,5 +1,5 @@
import {describe, it, expect, beforeEach, ddescribe, iit, xit, el} from 'angular2/test_lib';
import {CssProcessor} from 'angular2/src/core/compiler/css_processor';
import {CssProcessor, CssTransformer} from 'angular2/src/core/compiler/css_processor';
import {ShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
@ -8,6 +8,8 @@ import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_elemen
import {CompileStep} from 'angular2/src/core/compiler/pipeline/compile_step';
import {CompileControl} from 'angular2/src/core/compiler/pipeline/compile_control';
import {DOM} from 'angular2/src/dom/dom_adapter';
import {Component} from 'angular2/src/core/annotations/annotations';
import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata';
@ -28,7 +30,7 @@ export function main() {
it('it should set ignoreBindings to true for style elements', () => {
var strategy = new FakeShadowDomStrategy(null);
var cssProcessor = new CssProcessor();
var cssProcessor = new CssProcessor(null);
var pipeline = createPipeline(cssProcessor, strategy, 'http://base');
var results = pipeline.process(el('<div><style></style></div>'));
@ -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('<div><style></style></div>'));
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('<div><style></style></div>'));
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 {}

2
modules/angular2/test/core/compiler/integration_spec.js vendored
View File

@ -42,7 +42,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
}

2
modules/angular2/test/core/compiler/shadow_dom/shadow_dom_emulation_integration_spec.js vendored
View File

@ -60,7 +60,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
});

2
modules/angular2/test/directives/foreach_spec.js vendored
View File

@ -38,7 +38,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
});

2
modules/angular2/test/directives/if_spec.js vendored
View File

@ -38,7 +38,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
});

2
modules/angular2/test/directives/non_bindable_spec.js vendored
View File

@ -36,7 +36,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
});

2
modules/angular2/test/directives/switch_spec.js vendored
View File

@ -33,7 +33,7 @@ export function main() {
tplResolver,
new ComponentUrlMapper(),
urlResolver,
new CssProcessor()
new CssProcessor(null)
);
});

4
modules/angular2/test/forms/integration_spec.js vendored
View File

@ -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({

2
modules/benchmarks/src/compiler/compiler_benchmark.js
View File

@ -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);

2
modules/benchmarks/src/naive_infinite_scroll/index.js
View File

@ -282,7 +282,7 @@ export function setupReflectorForAngular() {
});
reflector.registerType(CssProcessor, {
"factory": () => new CssProcessor(),
"factory": () => new CssProcessor(null),
"parameters": [],
"annotations": []
});

2
modules/benchmarks/src/tree/tree_benchmark.js
View File

@ -172,7 +172,7 @@ function setupReflector() {
});
reflector.registerType(CssProcessor, {
"factory": () => new CssProcessor(),
"factory": () => new CssProcessor(null),
"parameters": [],
"annotations": []
});

2
modules/examples/src/hello_world/index_static.js
View File

@ -151,7 +151,7 @@ function setup() {
});
reflector.registerType(CssProcessor, {
"factory": () => new CssProcessor(),
"factory": () => new CssProcessor(null),
"parameters": [],
"annotations": []
});