refactor(compiler): cleanup and preparation for integration

- Rename `DirectiveMetadata` into `CompileDirectiveMetadata`, merge
  with `NormalizedDirectiveMetadata` and remove `ChangeDetectionMetadata`
- Store change detector factories not as array but
  directly at the `CompiledTemplate` or the embedded template
  to make instantiation easier later on
- Already analyze variable values and map them
  to `Directive.exportAs`
- Keep the directive sort order as specified in the
  `@View()` annotation
- Allow to clear the runtime cache in `StyleCompiler`
  and `TemplateCompiler`
- Ignore `script` elements to match the semantics of the
  current compiler
- Make all components dynamically loadable and remove
  the previously introduced property `@Component#dynamicLoadable`
  for now until we find a better option to configure this
- Don’t allow to specify bindings in `@View#directives` and `@View#pipes` as this was never supported by the transformer (see below for the breaking change)

BREAKING CHANGE:
- don't support DI bindings in `@View#directives` and `@View@pipes` any more in preparation of integrating the new compiler. Use `@Directive#bindings` to reexport directives under a different token instead.

Part of #3605
Closes #4314
This commit is contained in:
Tobias Bosch
2015-09-18 10:33:23 -07:00
parent eb7839e0ec
commit cc0c30484f
37 changed files with 1480 additions and 1167 deletions

View File

@ -14,9 +14,8 @@ import {
} from 'angular2/test_lib';
import {
TypeMetadata,
NormalizedTemplateMetadata,
TemplateMetadata
CompileTypeMetadata,
CompileTemplateMetadata
} from 'angular2/src/compiler/directive_metadata';
import {ViewEncapsulation} from 'angular2/src/core/render/api';
@ -27,27 +26,29 @@ import {TEST_BINDINGS} from './test_bindings';
export function main() {
describe('TemplateNormalizer', () => {
var dirType: TypeMetadata;
var dirType: CompileTypeMetadata;
beforeEachBindings(() => TEST_BINDINGS);
beforeEach(
() => { dirType = new TypeMetadata({moduleId: 'some/module/id', name: 'SomeComp'}); });
beforeEach(() => {
dirType = new CompileTypeMetadata({moduleId: 'some/module/id', name: 'SomeComp'});
});
describe('loadTemplate', () => {
describe('inline template', () => {
it('should store the template',
inject([AsyncTestCompleter, TemplateNormalizer],
(async, normalizer: TemplateNormalizer) => {
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: 'a',
templateUrl: null,
styles: [],
styleUrls: ['test.css']
}))
.then((template: NormalizedTemplateMetadata) => {
.then((template: CompileTemplateMetadata) => {
expect(template.template).toEqual('a');
expect(template.templateUrl).toEqual('some/module/id');
async.done();
});
}));
@ -55,15 +56,15 @@ export function main() {
it('should resolve styles on the annotation against the moduleId',
inject([AsyncTestCompleter, TemplateNormalizer],
(async, normalizer: TemplateNormalizer) => {
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: '',
templateUrl: null,
styles: [],
styleUrls: ['test.css']
}))
.then((template: NormalizedTemplateMetadata) => {
expect(template.styleAbsUrls).toEqual(['some/module/test.css']);
.then((template: CompileTemplateMetadata) => {
expect(template.styleUrls).toEqual(['some/module/test.css']);
async.done();
});
}));
@ -71,15 +72,15 @@ export function main() {
it('should resolve styles in the template against the moduleId',
inject([AsyncTestCompleter, TemplateNormalizer],
(async, normalizer: TemplateNormalizer) => {
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: '<style>@import test.css</style>',
templateUrl: null,
styles: [],
styleUrls: []
}))
.then((template: NormalizedTemplateMetadata) => {
expect(template.styleAbsUrls).toEqual(['some/module/test.css']);
.then((template: CompileTemplateMetadata) => {
expect(template.styleUrls).toEqual(['some/module/test.css']);
async.done();
});
}));
@ -91,15 +92,16 @@ export function main() {
inject([AsyncTestCompleter, TemplateNormalizer, XHR],
(async, normalizer: TemplateNormalizer, xhr: MockXHR) => {
xhr.expect('some/module/sometplurl', 'a');
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: null,
templateUrl: 'sometplurl',
styles: [],
styleUrls: ['test.css']
}))
.then((template: NormalizedTemplateMetadata) => {
.then((template: CompileTemplateMetadata) => {
expect(template.template).toEqual('a');
expect(template.templateUrl).toEqual('some/module/sometplurl');
async.done();
});
xhr.flush();
@ -109,15 +111,15 @@ export function main() {
inject([AsyncTestCompleter, TemplateNormalizer, XHR],
(async, normalizer: TemplateNormalizer, xhr: MockXHR) => {
xhr.expect('some/module/tpl/sometplurl', '');
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: null,
templateUrl: 'tpl/sometplurl',
styles: [],
styleUrls: ['test.css']
}))
.then((template: NormalizedTemplateMetadata) => {
expect(template.styleAbsUrls).toEqual(['some/module/test.css']);
.then((template: CompileTemplateMetadata) => {
expect(template.styleUrls).toEqual(['some/module/test.css']);
async.done();
});
xhr.flush();
@ -127,15 +129,15 @@ export function main() {
inject([AsyncTestCompleter, TemplateNormalizer, XHR],
(async, normalizer: TemplateNormalizer, xhr: MockXHR) => {
xhr.expect('some/module/tpl/sometplurl', '<style>@import test.css</style>');
normalizer.normalizeTemplate(dirType, new TemplateMetadata({
normalizer.normalizeTemplate(dirType, new CompileTemplateMetadata({
encapsulation: null,
template: null,
templateUrl: 'tpl/sometplurl',
styles: [],
styleUrls: []
}))
.then((template: NormalizedTemplateMetadata) => {
expect(template.styleAbsUrls).toEqual(['some/module/tpl/test.css']);
.then((template: CompileTemplateMetadata) => {
expect(template.styleUrls).toEqual(['some/module/tpl/test.css']);
async.done();
});
xhr.flush();
@ -151,8 +153,8 @@ export function main() {
var viewEncapsulation = ViewEncapsulation.Native;
var template = normalizer.normalizeLoadedTemplate(
dirType,
new TemplateMetadata({encapsulation: viewEncapsulation, styles: [], styleUrls: []}),
dirType, new CompileTemplateMetadata(
{encapsulation: viewEncapsulation, styles: [], styleUrls: []}),
'', 'some/module/');
expect(template.encapsulation).toBe(viewEncapsulation);
}));
@ -160,88 +162,90 @@ export function main() {
it('should keep the template as html',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}), 'a',
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}), 'a',
'some/module/');
expect(template.template).toEqual('a')
}));
it('should collect and keep ngContent',
it('should collect ngContent',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<ng-content select="a"></ng-content>', 'some/module/');
expect(template.ngContentSelectors).toEqual(['a']);
expect(template.template).toEqual('<ng-content select="a"></ng-content>');
}));
it('should normalize ngContent wildcard selector',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<ng-content></ng-content><ng-content select></ng-content><ng-content select="*"></ng-content>',
'some/module/');
expect(template.ngContentSelectors).toEqual(['*', '*', '*']);
}));
it('should collect and remove top level styles in the template',
it('should collect top level styles in the template',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<style>a</style>', 'some/module/');
expect(template.styles).toEqual(['a']);
expect(template.template).toEqual('');
}));
it('should collect and remove styles inside in elements',
it('should collect styles inside in elements',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<div><style>a</style></div>', 'some/module/');
expect(template.styles).toEqual(['a']);
expect(template.template).toEqual('<div></div>');
}));
it('should collect and remove styleUrls in the template',
it('should collect styleUrls in the template',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<link rel="stylesheet" href="aUrl">', 'some/module/');
expect(template.styleAbsUrls).toEqual(['some/module/aUrl']);
expect(template.template).toEqual('');
expect(template.styleUrls).toEqual(['some/module/aUrl']);
}));
it('should collect and remove styleUrls in elements',
it('should collect styleUrls in elements',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<div><link rel="stylesheet" href="aUrl"></div>', 'some/module/');
expect(template.styleAbsUrls).toEqual(['some/module/aUrl']);
expect(template.template).toEqual('<div></div>');
expect(template.styleUrls).toEqual(['some/module/aUrl']);
}));
it('should keep link elements with non stylesheet rel attribute',
it('should ignore link elements with non stylesheet rel attribute',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<link href="b" rel="a"></link>', 'some/module/');
expect(template.styleAbsUrls).toEqual([]);
expect(template.template).toEqual('<link href="b" rel="a"></link>');
expect(template.styleUrls).toEqual([]);
}));
it('should extract @import style urls into styleAbsUrl',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata(
dirType, new CompileTemplateMetadata(
{encapsulation: null, styles: ['@import "test.css";'], styleUrls: []}),
'', 'some/module/id');
expect(template.styles).toEqual(['']);
expect(template.styleAbsUrls).toEqual(['some/module/test.css']);
expect(template.styleUrls).toEqual(['some/module/test.css']);
}));
it('should resolve relative urls in inline styles',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new TemplateMetadata({
dirType, new CompileTemplateMetadata({
encapsulation: null,
styles: ['.foo{background-image: url(\'double.jpg\');'],
styleUrls: []
@ -254,15 +258,32 @@ export function main() {
it('should resolve relative style urls in styleUrls',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType,
new TemplateMetadata({encapsulation: null, styles: [], styleUrls: ['test.css']}), '',
'some/module/id');
dirType, new CompileTemplateMetadata(
{encapsulation: null, styles: [], styleUrls: ['test.css']}),
'', 'some/module/id');
expect(template.styles).toEqual([]);
expect(template.styleAbsUrls).toEqual(['some/module/test.css']);
expect(template.styleUrls).toEqual(['some/module/test.css']);
}));
it('should normalize ViewEncapsulation.Emulated to ViewEncapsulation.None if there are no stlyes nor stylesheets',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType, new CompileTemplateMetadata(
{encapsulation: ViewEncapsulation.Emulated, styles: [], styleUrls: []}),
'', 'some/module/id');
expect(template.encapsulation).toEqual(ViewEncapsulation.None);
}));
it('should ignore elements with ng-non-bindable attribute and their children',
inject([TemplateNormalizer], (normalizer: TemplateNormalizer) => {
var template = normalizer.normalizeLoadedTemplate(
dirType,
new CompileTemplateMetadata({encapsulation: null, styles: [], styleUrls: []}),
'<div ng-non-bindable><ng-content select="a"></ng-content></div><ng-content ng-non-bindable select="b"></ng-content>',
'some/module/');
expect(template.ngContentSelectors).toEqual([]);
}));
});
});
}