refactor(compiler): use the new compiler everywhere

Closes #3605

BREAKING CHANGE:
- we don't mark an element as bound any more if it only contains text bindings
  E.g. <div>{{hello}}</div>
  This changes the indices when using `DebugElement.componentViewChildren` / `DebugElement.children`.
- `@Directive.compileChildren` was removed,
  `ng-non-bindable` is now builtin and not a directive any more
- angular no more adds the `ng-binding` class to elements with bindings
- directives are now ordered as they are listed in the View.directives regarding change detection.
  Previously they had an undefined order.
- the `Renderer` interface has new methods `createProtoView` and `registerComponentTemplate`. See `DomRenderer` for default implementations.
- reprojection with `ng-content` is now all or nothing per `ng-content` element
- angular2 transformer can't be used in tests that modify directive metadata.
  Use `angular2/src/transform/inliner_for_test` transformer instead.
This commit is contained in:
Tobias Bosch
2015-10-01 10:07:49 -07:00
parent 30ca0434a2
commit 76247b7097
124 changed files with 2013 additions and 3451 deletions
+67 -1
View File
@@ -1,9 +1,75 @@
import {CONST_EXPR} from "angular2/src/core/facade/lang";
import {OpaqueToken} from "angular2/src/core/di";
import {RenderElementRef, RenderViewRef} from "angular2/src/core/render/api";
import {
RenderElementRef,
RenderViewRef,
RenderTemplateCmd,
RenderTextCmd,
RenderNgContentCmd,
RenderBeginElementCmd,
RenderBeginComponentCmd,
RenderEmbeddedTemplateCmd,
RenderCommandVisitor
} from "angular2/src/core/render/api";
export const ON_WEB_WORKER = CONST_EXPR(new OpaqueToken('WebWorker.onWebWorker'));
export class WebWorkerElementRef implements RenderElementRef {
constructor(public renderView: RenderViewRef, public renderBoundElementIndex: number) {}
}
export class WebWorkerTemplateCmd implements RenderTemplateCmd {
visit(visitor: RenderCommandVisitor, context: any): any { return null; }
}
export class WebWorkerTextCmd implements RenderTextCmd {
constructor(public isBound: boolean, public ngContentIndex: number, public value: string) {}
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitText(this, context);
}
}
export class WebWorkerNgContentCmd implements RenderNgContentCmd {
constructor(public ngContentIndex: number) {}
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitNgContent(this, context);
}
}
export class WebWorkerBeginElementCmd implements RenderBeginElementCmd {
constructor(public isBound: boolean, public ngContentIndex: number, public name: string,
public attrNameAndValues: string[], public eventTargetAndNames: string[]) {}
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitBeginElement(this, context);
}
}
export class WebWorkerEndElementCmd implements RenderTemplateCmd {
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitEndElement(context);
}
}
export class WebWorkerBeginComponentCmd implements RenderBeginComponentCmd {
constructor(public isBound: boolean, public ngContentIndex: number, public name: string,
public attrNameAndValues: string[], public eventTargetAndNames: string[],
public nativeShadow: boolean, public templateId: number) {}
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitBeginComponent(this, context);
}
}
export class WebWorkerEndComponentCmd implements RenderTemplateCmd {
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitEndComponent(context);
}
}
export class WebWorkerEmbeddedTemplateCmd implements RenderEmbeddedTemplateCmd {
constructor(public isBound: boolean, public ngContentIndex: number, public name: string,
public attrNameAndValues: string[], public eventTargetAndNames: string[],
public isMerged: boolean, public children: RenderTemplateCmd[]) {}
visit(visitor: RenderCommandVisitor, context: any): any {
return visitor.visitEmbeddedTemplate(this, context);
}
}
@@ -3,7 +3,6 @@
* You should not use these channels in your application code.
*/
export const SETUP_CHANNEL = "ng-WebWorkerSetup";
export const RENDER_COMPILER_CHANNEL = "ng-RenderCompiler";
export const RENDERER_CHANNEL = "ng-Renderer";
export const XHR_CHANNEL = "ng-XHR";
export const EVENT_CHANNEL = "ng-events";
@@ -12,41 +12,33 @@ export class RenderProtoViewRefStore {
constructor(@Inject(ON_WEB_WORKER) onWebworker) { this._onWebworker = onWebworker; }
storeRenderProtoViewRef(ref: RenderProtoViewRef): number {
if (this._lookupByProtoView.has(ref)) {
return this._lookupByProtoView.get(ref);
} else {
this._lookupByIndex.set(this._nextIndex, ref);
this._lookupByProtoView.set(ref, this._nextIndex);
return this._nextIndex++;
}
allocate(): RenderProtoViewRef {
var index = this._nextIndex++;
var result = new WebWorkerRenderProtoViewRef(index);
this.store(result, index);
return result;
}
retreiveRenderProtoViewRef(index: number): RenderProtoViewRef {
return this._lookupByIndex.get(index);
store(ref: RenderProtoViewRef, index: number): void {
this._lookupByProtoView.set(ref, index);
this._lookupByIndex.set(index, ref);
}
deserialize(index: number): RenderProtoViewRef {
if (index == null) {
return null;
}
if (this._onWebworker) {
return new WebWorkerRenderProtoViewRef(index);
} else {
return this.retreiveRenderProtoViewRef(index);
}
return this._lookupByIndex.get(index);
}
serialize(ref: RenderProtoViewRef): number {
if (ref == null) {
return null;
}
if (this._onWebworker) {
return (<WebWorkerRenderProtoViewRef>ref).refNumber;
} else {
return this.storeRenderProtoViewRef(ref);
return this._lookupByProtoView.get(ref);
}
}
}
@@ -29,9 +29,26 @@ import {
RenderElementRef,
ViewType,
ViewEncapsulation,
PropertyBindingType
PropertyBindingType,
RenderTemplateCmd,
RenderCommandVisitor,
RenderTextCmd,
RenderNgContentCmd,
RenderBeginElementCmd,
RenderBeginComponentCmd,
RenderEmbeddedTemplateCmd
} from "angular2/src/core/render/api";
import {WebWorkerElementRef} from 'angular2/src/web_workers/shared/api';
import {
WebWorkerElementRef,
WebWorkerTemplateCmd,
WebWorkerTextCmd,
WebWorkerNgContentCmd,
WebWorkerBeginElementCmd,
WebWorkerEndElementCmd,
WebWorkerBeginComponentCmd,
WebWorkerEndComponentCmd,
WebWorkerEmbeddedTemplateCmd
} from 'angular2/src/web_workers/shared/api';
import {AST, ASTWithSource} from 'angular2/src/core/change_detection/change_detection';
import {Parser} from "angular2/src/core/change_detection/parser/parser";
import {Injectable} from "angular2/src/core/di";
@@ -109,6 +126,8 @@ export class Serializer {
return this._serializeElementPropertyBinding(obj);
} else if (type == EventBinding) {
return this._serializeEventBinding(obj);
} else if (type == WebWorkerTemplateCmd) {
return serializeTemplateCmd(obj);
} else {
throw new BaseException("No serializer for " + type.toString());
}
@@ -153,6 +172,8 @@ export class Serializer {
return this._deserializeEventBinding(map);
} else if (type == ElementPropertyBinding) {
return this._deserializeElementPropertyBinding(map);
} else if (type == WebWorkerTemplateCmd) {
return deserializeTemplateCmd(map);
} else {
throw new BaseException("No deserializer for " + type.toString());
}
@@ -406,3 +427,82 @@ export class Serializer {
});
}
}
function serializeTemplateCmd(cmd: RenderTemplateCmd): Object {
return cmd.visit(RENDER_TEMPLATE_CMD_SERIALIZER, null);
}
function deserializeTemplateCmd(data: StringMap<string, any>): RenderTemplateCmd {
return RENDER_TEMPLATE_CMD_DESERIALIZERS[data['deserializerIndex']](data);
}
class RenderTemplateCmdSerializer implements RenderCommandVisitor {
visitText(cmd: RenderTextCmd, context: any): any {
return {
'deserializerIndex': 0,
'isBound': cmd.isBound,
'ngContentIndex': cmd.ngContentIndex,
'value': cmd.value
};
}
visitNgContent(cmd: RenderNgContentCmd, context: any): any {
return {'deserializerIndex': 1, 'ngContentIndex': cmd.ngContentIndex};
}
visitBeginElement(cmd: RenderBeginElementCmd, context: any): any {
return {
'deserializerIndex': 2,
'isBound': cmd.isBound,
'ngContentIndex': cmd.ngContentIndex,
'name': cmd.name,
'attrNameAndValues': cmd.attrNameAndValues,
'eventTargetAndNames': cmd.eventTargetAndNames
};
}
visitEndElement(context: any): any { return {'deserializerIndex': 3}; }
visitBeginComponent(cmd: RenderBeginComponentCmd, context: any): any {
return {
'deserializerIndex': 4,
'isBound': cmd.isBound,
'ngContentIndex': cmd.ngContentIndex,
'name': cmd.name,
'attrNameAndValues': cmd.attrNameAndValues,
'eventTargetAndNames': cmd.eventTargetAndNames,
'nativeShadow': cmd.nativeShadow,
'templateId': cmd.templateId
};
}
visitEndComponent(context: any): any { return {'deserializerIndex': 5}; }
visitEmbeddedTemplate(cmd: RenderEmbeddedTemplateCmd, context: any): any {
var children = cmd.children.map(child => child.visit(this, null));
return {
'deserializerIndex': 6,
'isBound': cmd.isBound,
'ngContentIndex': cmd.ngContentIndex,
'name': cmd.name,
'attrNameAndValues': cmd.attrNameAndValues,
'eventTargetAndNames': cmd.eventTargetAndNames,
'isMerged': cmd.isMerged,
'children': children
};
}
}
var RENDER_TEMPLATE_CMD_SERIALIZER = new RenderTemplateCmdSerializer();
var RENDER_TEMPLATE_CMD_DESERIALIZERS = [
(data: StringMap<string, any>) =>
new WebWorkerTextCmd(data['isBound'], data['ngContentIndex'], data['value']),
(data: StringMap<string, any>) => new WebWorkerNgContentCmd(data['ngContentIndex']),
(data: StringMap<string, any>) =>
new WebWorkerBeginElementCmd(data['isBound'], data['ngContentIndex'], data['name'],
data['attrNameAndValues'], data['eventTargetAndNames']),
(data: StringMap<string, any>) => new WebWorkerEndElementCmd(),
(data: StringMap<string, any>) => new WebWorkerBeginComponentCmd(
data['isBound'], data['ngContentIndex'], data['name'], data['attrNameAndValues'],
data['eventTargetAndNames'], data['nativeShadow'], data['templateId']),
(data: StringMap<string, any>) => new WebWorkerEndComponentCmd(),
(data: StringMap<string, any>) => new WebWorkerEmbeddedTemplateCmd(
data['isBound'], data['ngContentIndex'], data['name'], data['attrNameAndValues'],
data['eventTargetAndNames'], data['isMerged'],
(<any[]>data['children']).map(childData => deserializeTemplateCmd(childData))),
];