perf(ivy): move attributes array into component def (#32798)

Currently Ivy stores the element attributes into an array above the component def and passes it into the relevant instructions, however the problem is that upon minification the array will get a unique name which won't compress very well. These changes move the attributes array into the component def and pass in the index into the instructions instead.

Before:
```
const _c0 = ['foo', 'bar'];

SomeComp.ngComponentDef = defineComponent({
  template: function() {
    element(0, 'div', _c0);
  }
});
```

After:
```
SomeComp.ngComponentDef = defineComponent({
  consts: [['foo', 'bar']],
  template: function() {
    element(0, 'div', 0);
  }
});
```

A couple of cases that this PR doesn't handle:
* Template references are still in a separate array.
* i18n attributes are still in a separate array.

PR Close #32798
This commit is contained in:
crisbeto 2019-09-23 20:08:51 +02:00 committed by Alex Rickabaugh
parent b2b917d2d8
commit d5b87d32b0
52 changed files with 912 additions and 885 deletions

View File

@ -24,7 +24,7 @@ export class TreeFunction {
static ngComponentDef = ɵɵdefineComponent({
type: TreeFunction,
selectors: [['tree']],
consts: 5,
decls: 5,
vars: 1,
template: function(rf: ɵRenderFlags, ctx: TreeFunction) {
// bit of a hack

View File

@ -189,7 +189,7 @@ runInEachFileSystem(() => {
const addDefinitionsSpy = testFormatter.addDefinitions as jasmine.Spy;
expect(addDefinitionsSpy.calls.first().args[2])
.toEqual(`A.ngFactoryDef = function A_Factory(t) { return new (t || A)(); };
A.ngComponentDef = ɵngcc0.ɵɵdefineComponent({ type: A, selectors: [["a"]], consts: 1, vars: 1, template: function A_Template(rf, ctx) { if (rf & 1) {
A.ngComponentDef = ɵngcc0.ɵɵdefineComponent({ type: A, selectors: [["a"]], decls: 1, vars: 1, template: function A_Template(rf, ctx) { if (rf & 1) {
ɵngcc0.ɵɵtext(0);
} if (rf & 2) {
ɵngcc0.ɵɵtextInterpolate(ctx.person.name);

View File

@ -48,15 +48,14 @@ describe('compiler compliance', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c1$ = ["title", "Hello", ${AttributeMarker.Classes}, "my-app"];
const $c2$ = ["cx", "20", "cy", "30", "r", "50"];
consts: [["title", "Hello", ${AttributeMarker.Classes}, "my-app"], ["cx", "20", "cy", "30", "r", "50"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $c1$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵnamespaceSVG();
$r3$.ɵɵelementStart(1, "svg");
$r3$.ɵɵelement(2, "circle", $c2$);
$r3$.ɵɵelement(2, "circle", 1);
$r3$.ɵɵelementEnd();
$r3$.ɵɵnamespaceHTML();
$r3$.ɵɵelementStart(3, "p");
@ -98,11 +97,11 @@ describe('compiler compliance', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c1$ = ["title", "Hello", ${AttributeMarker.Classes}, "my-app"];
consts: [["title", "Hello", ${AttributeMarker.Classes}, "my-app"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $c1$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵnamespaceMathML();
$r3$.ɵɵelementStart(1, "math");
$r3$.ɵɵelement(2, "infinity");
@ -146,11 +145,11 @@ describe('compiler compliance', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c1$ = ["title", "Hello", ${AttributeMarker.Classes}, "my-app"];
consts: [["title", "Hello", ${AttributeMarker.Classes}, "my-app"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $c1$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵtext(1, "Hello ");
$r3$.ɵɵelementStart(2, "b");
$r3$.ɵɵtext(3, "World");
@ -170,7 +169,7 @@ describe('compiler compliance', () => {
// TODO(https://github.com/angular/angular/issues/24426): We need to support the parser actually
// building the proper attributes based off of xmlns attributes.
xit('should support namspaced attributes', () => {
xit('should support namespaced attributes', () => {
const files = {
app: {
'spec.ts': `
@ -194,11 +193,11 @@ describe('compiler compliance', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $e0_attrs$ = ["class", "my-app", 0, "http://someuri/foo", "foo:bar", "baz", "title", "Hello", 0, "http://someuri/foo", "foo:qux", "quacks"];
consts: [["class", "my-app", 0, "http://someuri/foo", "foo:bar", "baz", "title", "Hello", 0, "http://someuri/foo", "foo:qux", "quacks"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $e0_attrs$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵtext(1, "Hello ");
$r3$.ɵɵelementStart(2, "b");
$r3$.ɵɵtext(3, "World");
@ -308,11 +307,11 @@ describe('compiler compliance', () => {
const factory =
'MyComponent.ngFactoryDef = function MyComponent_Factory(t) { return new (t || MyComponent)(); }';
const template = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "id"];
consts: [[${AttributeMarker.Bindings}, "id"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("id", ctx.id);
@ -365,7 +364,7 @@ describe('compiler compliance', () => {
const template = `
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
$r3$.ɵɵpipe(1,"pipe");
}
if (rf & 2) {
@ -479,7 +478,7 @@ describe('compiler compliance', () => {
'MyComponent.ngFactoryDef = function MyComponent_Factory(t) { return new (t || MyComponent)(); }';
const template = `
MyComponent.ngComponentDef = i0.ɵɵdefineComponent({type:MyComponent,selectors:[["my-component"]],
consts: 1,
decls: 1,
vars: 2,
template: function MyComponent_Template(rf,ctx){
if (rf & 1) {
@ -501,6 +500,45 @@ describe('compiler compliance', () => {
expectEmit(result.source, template, 'Incorrect template');
});
it('should de-duplicate attribute arrays', () => {
const files = {
app: {
'spec.ts': `
import {Component, NgModule} from '@angular/core';
@Component({
selector: 'my-component',
template: \`
<div title="hi"></div>
<span title="hi"></span>
\`
})
export class MyComponent {
}
@NgModule({declarations: [MyComponent]})
export class MyModule {}
`
}
};
const template = `
consts: [["title", "hi"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", 0);
$r3$.ɵɵelement(1, "span", 0);
}
}
`;
const result = compile(files, angularFiles);
expectEmit(result.source, template, 'Incorrect template');
});
});
describe('components & directives', () => {
@ -530,7 +568,7 @@ describe('compiler compliance', () => {
ChildComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: ChildComponent,
selectors: [["child"]],
consts: 1,
decls: 1,
vars: 0,
template: function ChildComponent_Template(rf, ctx) {
if (rf & 1) {
@ -556,16 +594,16 @@ describe('compiler compliance', () => {
// MyComponent definition should be:
const MyComponentDefinition = `
const $c1$ = ["some-directive", ""];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 2,
decls: 2,
vars: 0,
consts: [["some-directive", ""]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "child", $c1$);
$r3$.ɵɵelement(0, "child", 0);
$r3$.ɵɵtext(1, "!");
}
},
@ -658,7 +696,7 @@ describe('compiler compliance', () => {
EmptyOutletComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: EmptyOutletComponent,
selectors: [["ng-component"]],
consts: 1,
decls: 1,
vars: 0,
template: function EmptyOutletComponent_Template(rf, ctx) {
if (rf & 1) {
@ -707,7 +745,7 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 0,
decls: 0,
vars: 0,
template: function MyComponent_Template(rf, ctx) {},
encapsulation: 2
@ -761,7 +799,6 @@ describe('compiler compliance', () => {
const MyComponentDefinition = `
const $c1$ = ["foo", ""];
const $c2$ = [${AttributeMarker.Template}, "if"];
function MyComponent_li_2_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "li");
@ -779,12 +816,13 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 3,
decls: 3,
vars: 0,
consts: [[${AttributeMarker.Template}, "if"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "ul", null, $c1$);
$r3$.ɵɵtemplate(2, MyComponent_li_2_Template, 2, 2, "li", $c2$);
$r3$.ɵɵtemplate(2, MyComponent_li_2_Template, 2, 2, "li", 0);
$r3$.ɵɵelementEnd();
}
},
@ -840,17 +878,17 @@ describe('compiler compliance', () => {
};
const MyAppDeclaration = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "names"];
const $e0_ff$ = function ($v$) { return ["Nancy", $v$]; };
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 1,
decls: 1,
vars: 3,
consts: [[${AttributeMarker.Bindings}, "names"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "my-comp", $e0_attrs$);
$r3$.ɵɵelement(0, "my-comp", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("names", $r3$.ɵɵpureFunction1(1, $e0_ff$, ctx.customName));
@ -919,7 +957,6 @@ describe('compiler compliance', () => {
};
const MyAppDefinition = `
const $e0_attr$ = [${AttributeMarker.Bindings}, "names"];
const $e0_ff$ = function ($v0$, $v1$, $v2$, $v3$, $v4$, $v5$, $v6$, $v7$, $v8$) {
return ["start-", $v0$, $v1$, $v2$, $v3$, $v4$, "-middle-", $v5$, $v6$, $v7$, $v8$, "-end"];
}
@ -927,11 +964,12 @@ describe('compiler compliance', () => {
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 1,
decls: 1,
vars: 11,
consts: [[${AttributeMarker.Bindings}, "names"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "my-comp", $e0_attr$);
$r3$.ɵɵelement(0, "my-comp", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("names",
@ -983,17 +1021,17 @@ describe('compiler compliance', () => {
};
const MyAppDefinition = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "config"];
const $e0_ff$ = function ($v$) { return {"duration": 500, animation: $v$}; };
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 1,
decls: 1,
vars: 3,
consts: [[${AttributeMarker.Bindings}, "config"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "object-comp", $e0_attrs$);
$r3$.ɵɵelement(0, "object-comp", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("config", $r3$.ɵɵpureFunction1(1, $e0_ff$, ctx.name));
@ -1047,7 +1085,6 @@ describe('compiler compliance', () => {
};
const MyAppDefinition = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "config"];
const $c0$ = {opacity: 0, duration: 0};
const $e0_ff$ = function ($v$) { return {opacity: 1, duration: $v$}; };
const $e0_ff_1$ = function ($v$) { return [$c0$, $v$]; };
@ -1056,11 +1093,12 @@ describe('compiler compliance', () => {
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 1,
decls: 1,
vars: 8,
consts: [[${AttributeMarker.Bindings}, "config"]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "nested-comp", $e0_attrs$);
$r3$.ɵɵelement(0, "nested-comp", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty(
@ -1117,7 +1155,7 @@ describe('compiler compliance', () => {
type: SimpleComponent,
selectors: [["simple"]],
ngContentSelectors: $c0$,
consts: 2,
decls: 2,
vars: 0,
template: function SimpleComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1131,23 +1169,22 @@ describe('compiler compliance', () => {
});`;
const ComplexComponentDefinition = `
const $c3$ = ["id","first"];
const $c4$ = ["id","second"];
const $c1$ = [[["span", "title", "tofirst"]], [["span", "title", "tosecond"]]];
ComplexComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: ComplexComponent,
selectors: [["complex"]],
ngContentSelectors: _c4,
consts: 4,
ngContentSelectors: $c2$,
decls: 4,
vars: 0,
consts: [["id","first"], ["id","second"]],
template: function ComplexComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵprojectionDef($c1$);
$r3$.ɵɵelementStart(0, "div", $c3$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵprojection(1);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(2, "div", $c4$);
$r3$.ɵɵelementStart(2, "div", 1);
$r3$.ɵɵprojection(3, 1);
$r3$.ɵɵelementEnd();
}
@ -1194,7 +1231,7 @@ describe('compiler compliance', () => {
type: Cmp,
selectors: [["ng-component"]],
ngContentSelectors: $c1$,
consts: 3,
decls: 3,
vars: 0,
template: function Cmp_Template(rf, ctx) {
if (rf & 1) {
@ -1239,18 +1276,14 @@ describe('compiler compliance', () => {
}
};
const output = `
const $_c0$ = ["id", "second", ${AttributeMarker.Template}, "ngIf"];
const $_c1$ = ["id", "third", ${AttributeMarker.Template}, "ngIf"];
const $_c2$ = ["id", "second"];
function Cmp_div_0_Template(rf, ctx) { if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c2$);
$r3$.ɵɵelementStart(0, "div", 2);
$r3$.ɵɵprojection(1);
$r3$.ɵɵelementEnd();
} }
const $_c3$ = ["id", "third"];
function Cmp_div_1_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c3$);
$r3$.ɵɵelementStart(0, "div", 3);
$r3$.ɵɵtext(1, " No ng-content, no instructions generated. ");
$r3$.ɵɵelementEnd();
}
@ -1263,11 +1296,12 @@ describe('compiler compliance', () => {
}
const $_c4$ = [[["span", "title", "tofirst"]], "*"];
consts: [["id", "second", ${AttributeMarker.Template}, "ngIf"], ["id", "third", ${AttributeMarker.Template}, "ngIf"], ["id", "second"], ["id", "third"]],
template: function Cmp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵprojectionDef($_c4$);
$r3$.ɵɵtemplate(0, Cmp_div_0_Template, 2, 0, "div", $_c0$);
$r3$.ɵɵtemplate(1, Cmp_div_1_Template, 2, 0, "div", $_c1$);
$r3$.ɵɵtemplate(0, Cmp_div_0_Template, 2, 0, "div", 0);
$r3$.ɵɵtemplate(1, Cmp_div_1_Template, 2, 0, "div", 1);
$r3$.ɵɵtemplate(2, Cmp_ng_template_2_Template, 2, 0, "ng-template");
}
if (rf & 2) {
@ -1376,17 +1410,17 @@ describe('compiler compliance', () => {
const SimpleComponentDefinition = `
const $_c0$ = [[["", "title", ""]]];
const $_c1$ = ["[title]"];
const $_c2$ = ["ngProjectAs", "[title]", 5, ["", "title", ""]];
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 2,
decls: 2,
vars: 0,
consts: [["ngProjectAs", "[title]", 5, ["", "title", ""]]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "simple");
$r3$.ɵɵelement(1, "h1", $_c2$);
$r3$.ɵɵelement(1, "h1", 0);
$r3$.ɵɵelementEnd();
}
},
@ -1428,17 +1462,17 @@ describe('compiler compliance', () => {
const SimpleComponentDefinition = `
const $_c0$ = [[["", "title", ""]]];
const $_c1$ = ["[title]"];
const $_c2$ = ["ngProjectAs", "[title],[header]", 5, ["", "title", ""]];
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 2,
decls: 2,
vars: 0,
consts: [["ngProjectAs", "[title],[header]", 5, ["", "title", ""]]],
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "simple");
$r3$.ɵɵelement(1, "h1", $_c2$);
$r3$.ɵɵelement(1, "h1", 0);
$r3$.ɵɵelementEnd();
}
},
@ -1491,7 +1525,6 @@ describe('compiler compliance', () => {
};
const ViewQueryComponentDefinition = `
const $e0_attrs$ = ["someDir",""];
ViewQueryComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: ViewQueryComponent,
@ -1507,11 +1540,12 @@ describe('compiler compliance', () => {
$r3$.ɵɵqueryRefresh(($tmp$ = $r3$.ɵɵloadQuery())) && (ctx.someDirs = $tmp$);
}
},
consts: 1,
decls: 1,
vars: 0,
consts: [["someDir",""]],
template: function ViewQueryComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
}
},
directives: function () { return [SomeDirective]; },
@ -1601,7 +1635,6 @@ describe('compiler compliance', () => {
const ViewQueryComponentDefinition = `
const $refs$ = ["foo"];
const $e0_attrs$ = ["someDir",""];
ViewQueryComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: ViewQueryComponent,
@ -1617,11 +1650,12 @@ describe('compiler compliance', () => {
$r3$.ɵɵqueryRefresh(($tmp$ = $r3$.ɵɵloadQuery())) && (ctx.foo = $tmp$.first);
}
},
consts: 1,
decls: 1,
vars: 0,
consts: [["someDir",""]],
template: function ViewQueryComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
}
},
directives: function () { return [SomeDirective]; },
@ -1744,7 +1778,7 @@ describe('compiler compliance', () => {
}
},
ngContentSelectors: _c0,
consts: 2,
decls: 2,
vars: 0,
template: function ContentQueryComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1863,7 +1897,7 @@ describe('compiler compliance', () => {
}
},
ngContentSelectors: $_c1$,
consts: 2,
decls: 2,
vars: 0,
template: function ContentQueryComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2014,7 +2048,7 @@ describe('compiler compliance', () => {
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 7,
decls: 7,
vars: 20,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
@ -2081,7 +2115,7 @@ describe('compiler compliance', () => {
MyApp.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyApp,
selectors: [["my-app"]],
consts: 6,
decls: 6,
vars: 27,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
@ -2204,7 +2238,7 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 3,
decls: 3,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2261,7 +2295,6 @@ describe('compiler compliance', () => {
const MyComponentDefinition = `
const $c1$ = ["foo", ""];
const $c2$ = [${AttributeMarker.Template}, "if"];
const $c3$ = ["baz", ""];
const $c4$ = ["bar", ""];
function MyComponent_div_3_span_2_Template(rf, ctx) {
@ -2284,7 +2317,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1);
$r3$.ɵɵtemplate(2, MyComponent_div_3_span_2_Template, 2, 3, "span", $c2$);
$r3$.ɵɵtemplate(2, MyComponent_div_3_span_2_Template, 2, 3, "span", 0);
$r3$.ɵɵelement(3, "span", null, $c4$);
$r3$.ɵɵelementEnd();
}
@ -2300,13 +2333,14 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 6,
decls: 6,
vars: 1,
consts: [[${AttributeMarker.Template}, "if"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", null, $c1$);
$r3$.ɵɵtext(2);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 5, 2, "div", $c2$);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 5, 2, "div", 0);
$r3$.ɵɵelement(4, "div", null, $c3$);
}
if (rf & 2) {
@ -2349,9 +2383,7 @@ describe('compiler compliance', () => {
};
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $c1$ = ["foo", ""];
const $c2$ = [${AttributeMarker.Template}, "ngIf"];
function MyComponent_div_0_span_3_Template(rf, ctx) {
if (rf & 1) {
@ -2371,7 +2403,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵelement(1, "div", null, $c1$);
$i0$.ɵɵtemplate(3, MyComponent_div_0_span_3_Template, 2, 2, "span", $c2$);
$i0$.ɵɵtemplate(3, MyComponent_div_0_span_3_Template, 2, 2, "span", 1);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -2382,9 +2414,10 @@ describe('compiler compliance', () => {
}
// ...
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.Template}, "ngIf"]],
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 1, "div", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 1, "div", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngForOf", ctx.items);
@ -2447,7 +2480,7 @@ describe('compiler compliance', () => {
selectors: [["lifecycle-comp"]],
inputs: {nameMin: ["name", "nameMin"]},
features: [$r3$.ɵɵNgOnChangesFeature()],
consts: 0,
decls: 0,
vars: 0,
template: function LifecycleComp_Template(rf, ctx) {},
encapsulation: 2
@ -2457,12 +2490,13 @@ describe('compiler compliance', () => {
SimpleLayout.ngComponentDef = $r3$.ɵɵdefineComponent({
type: SimpleLayout,
selectors: [["simple-layout"]],
consts: 2,
decls: 2,
vars: 2,
consts: [[3, "name"]],
template: function SimpleLayout_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "lifecycle-comp", $e0_attrs$);
$r3$.ɵɵelement(1, "lifecycle-comp", $e1_attrs$);
$r3$.ɵɵelement(0, "lifecycle-comp", 0);
$r3$.ɵɵelement(1, "lifecycle-comp", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("name", ctx.name1);
@ -2576,7 +2610,6 @@ describe('compiler compliance', () => {
};`;
const MyComponentDefinition = `
const $t1_attrs$ = [${AttributeMarker.Template}, "for", "forOf"];
function MyComponent__svg_g_1_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵnamespaceSVG();
@ -2589,13 +2622,14 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 2,
decls: 2,
vars: 1,
consts: [[${AttributeMarker.Template}, "for", "forOf"]],
template: function MyComponent_Template(rf, ctx){
if (rf & 1) {
$r3$.ɵɵnamespaceSVG();
$r3$.ɵɵelementStart(0,"svg");
$r3$.ɵɵtemplate(1, MyComponent__svg_g_1_Template, 2, 0, "g", $t1_attrs$);
$r3$.ɵɵtemplate(1, MyComponent__svg_g_1_Template, 2, 0, "g", 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
@ -2658,7 +2692,6 @@ describe('compiler compliance', () => {
`;
const MyComponentDefinition = `
const $t1_attrs$ = [${AttributeMarker.Template}, "for", "forOf"];
function MyComponent_li_1_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "li");
@ -2675,12 +2708,13 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 2,
decls: 2,
vars: 1,
consts: [[${AttributeMarker.Template}, "for", "forOf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "ul");
$r3$.ɵɵtemplate(1, MyComponent_li_1_Template, 2, 1, "li", $t1_attrs$);
$r3$.ɵɵtemplate(1, MyComponent_li_1_Template, 2, 1, "li", 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
@ -2740,7 +2774,6 @@ describe('compiler compliance', () => {
};
const MyComponentDefinition = `
const $t4_attrs$ = [${AttributeMarker.Template}, "for", "forOf"];
function MyComponent_li_1_li_4_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "li");
@ -2762,7 +2795,7 @@ describe('compiler compliance', () => {
$r3$.ɵɵtext(2);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(3, "ul");
$r3$.ɵɵtemplate(4, MyComponent_li_1_li_4_Template, 2, 2, "li", $t4_attrs$);
$r3$.ɵɵtemplate(4, MyComponent_li_1_li_4_Template, 2, 2, "li", 0);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementEnd();
}
@ -2779,12 +2812,13 @@ describe('compiler compliance', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 2,
decls: 2,
vars: 1,
consts: [[${AttributeMarker.Template}, "for", "forOf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "ul");
$r3$.ɵɵtemplate(1, MyComponent_li_1_Template, 5, 2, "li", $c1$);
$r3$.ɵɵtemplate(1, MyComponent_li_1_Template, 5, 2, "li", 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {

View File

@ -74,11 +74,11 @@ describe('compiler compliance: bindings', () => {
};
const template = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "title"];
consts: [[${AttributeMarker.Bindings}, "title"]],
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵɵelement(0, "a", $e0_attrs$);
$i0$.ɵɵelement(0, "a", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("title", $ctx$.title);
@ -108,11 +108,11 @@ describe('compiler compliance: bindings', () => {
};
const template = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "title"];
consts: [[${AttributeMarker.Bindings}, "title"]],
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵɵelement(0, "a", $e0_attrs$);
$i0$.ɵɵelement(0, "a", 0);
}
if (rf & 2) {
$i0$.ɵɵpropertyInterpolate1("title", "Hello ", $ctx$.name, "");
@ -162,13 +162,13 @@ describe('compiler compliance: bindings', () => {
};
const template = `
const $c0$ = [${AttributeMarker.Bindings}, "for"];
consts: [[${AttributeMarker.Bindings}, "for"]]
// ...
function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelement(0, "label", _c0);
$i0$.ɵɵelement(0, "label", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("for", ctx.forValue);
@ -640,7 +640,7 @@ describe('compiler compliance: bindings', () => {
};
const template = `
const $e0_attrs$ = ["target", "_blank", "aria-label", "link", ${AttributeMarker.Bindings}, "title", "id", "customEvent"];
consts: [["target", "_blank", "aria-label", "link", ${AttributeMarker.Bindings}, "title", "id", "customEvent"]],
`;
const result = compile(files, angularFiles);
@ -725,7 +725,7 @@ describe('compiler compliance: bindings', () => {
$r3$.ɵɵhostProperty("id", $r3$.ɵɵpureFunction1(1, $ff$, ctx.id));
}
},
consts: 0,
decls: 0,
vars: 0,
template: function HostBindingComp_Template(rf, ctx) {},
encapsulation: 2
@ -1251,12 +1251,12 @@ describe('compiler compliance: bindings', () => {
`);
const template = `
const $_c0$ = ["id", "my-id"];
const $_c1$ = ["myRef", ""];
consts: [["id", "my-id"]],
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵɵelementStart(0, "b", $_c0$, $_c1$);
$i0$.ɵɵelementStart(0, "b", 0, $_c1$);
$i0$.ɵɵdisableBindings();
$i0$.ɵɵelementStart(2, "i");
$i0$.ɵɵtext(3, "Hello {{ name }}!");
@ -1284,13 +1284,13 @@ describe('compiler compliance: bindings', () => {
`);
const template = `
const $_c0$ = ["value", "one", "#myInput", ""];
consts: [["value", "one", "#myInput", ""]],
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵdisableBindings();
$i0$.ɵɵelement(1, "input", $_c0$);
$i0$.ɵɵelement(1, "input", 0);
$i0$.ɵɵtext(2, " {{ myInput.value }} ");
$i0$.ɵɵenableBindings();
$i0$.ɵɵelementEnd();
@ -1308,13 +1308,13 @@ describe('compiler compliance: bindings', () => {
`);
const template = `
const $_c0$ = ["[id]", "my-id", "(click)", "onclick"];
consts: [["[id]", "my-id", "(click)", "onclick"]],
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵdisableBindings();
$i0$.ɵɵelement(1, "div", $_c0$);
$i0$.ɵɵelement(1, "div", 0);
$i0$.ɵɵenableBindings();
$i0$.ɵɵelementEnd();
}

View File

@ -41,7 +41,7 @@ describe('compiler compliance: directives', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 1,
decls: 1,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -91,7 +91,7 @@ describe('compiler compliance: directives', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 1,
decls: 1,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -118,43 +118,42 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Input, NgModule} from '@angular/core';
import {Component, Directive, Input, NgModule} from '@angular/core';
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Component({selector: 'my-component', template: '<div [someDirective]="true"></div>'})
export class MyComponent {}
@Component({selector: 'my-component', template: '<div [someDirective]="true"></div>'})
export class MyComponent {}
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
}
};
// MyComponent definition should be:
const MyComponentDefinition = `
const _c0 = [${AttributeMarker.Bindings}, "someDirective"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", _c0);
}
if (rf & 2) {
$r3$.ɵɵproperty("someDirective", true);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [[${AttributeMarker.Bindings}, "someDirective"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("someDirective", true);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
const result = compile(files, angularFiles);
const source = result.source;
@ -191,7 +190,6 @@ describe('compiler compliance: directives', () => {
const MyComponentDefinition = `
const $_c0$ = ["directiveA", ""];
function MyComponent_ng_template_0_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtext(0, "Some content");
@ -200,9 +198,10 @@ describe('compiler compliance: directives', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [["directiveA", ""]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 1, 0, "ng-template", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 1, 0, "ng-template", 0);
}
},
@ -244,11 +243,9 @@ describe('compiler compliance: directives', () => {
const MyComponentDefinition = `
const $_c0$ = ["directiveA", "", ${AttributeMarker.Template}, "ngIf"];
const $_c1$ = ["directiveA", ""];
function MyComponent_ng_container_0_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementContainerStart(0, $_c1$);
$r3$.ɵɵelementContainerStart(0, 1);
$r3$.ɵɵtext(1, "Some content");
$r3$.ɵɵelementContainerEnd();
}
@ -256,9 +253,10 @@ describe('compiler compliance: directives', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [["directiveA", "", ${AttributeMarker.Template}, "ngIf"], ["directiveA", ""]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_ng_container_0_Template, 2, 0, "ng-container", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_ng_container_0_Template, 2, 0, "ng-container", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngIf", ctx.showing);
@ -279,43 +277,42 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Input, NgModule} from '@angular/core';
import {Component, Directive, Input, NgModule} from '@angular/core';
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Component({selector: 'my-component', template: '<ng-template [someDirective]="true"></ng-template>'})
export class MyComponent {}
@Component({selector: 'my-component', template: '<ng-template [someDirective]="true"></ng-template>'})
export class MyComponent {}
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
}
};
// MyComponent definition should be:
const MyComponentDefinition = `
const $c0_a0$ = [${AttributeMarker.Bindings}, "someDirective"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 0, 0, "ng-template", $c0_a0$);
}
if (rf & 2) {
$r3$.ɵɵproperty("someDirective", true);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [[${AttributeMarker.Bindings}, "someDirective"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 0, 0, "ng-template", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("someDirective", true);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
const result = compile(files, angularFiles);
const source = result.source;
@ -328,39 +325,38 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Input, NgModule} from '@angular/core';
import {Component, Directive, Input, NgModule} from '@angular/core';
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Input() someDirective;
}
@Component({selector: 'my-component', template: '<div *someDirective></div>'})
export class MyComponent {}
@Component({selector: 'my-component', template: '<div *someDirective></div>'})
export class MyComponent {}
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
}
};
// MyComponent definition should be:
const MyComponentDefinition = `
const $c0_a0$ = [${AttributeMarker.Template}, "someDirective"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", $c0_a0$);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [[${AttributeMarker.Template}, "someDirective"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", 0);
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
const result = compile(files, angularFiles);
const source = result.source;
@ -374,44 +370,43 @@ describe('compiler compliance: directives', () => {
const files = {
app: {
'spec.ts': `
import {Component, Directive, Output, EventEmitter, NgModule} from '@angular/core';
import {Component, Directive, Output, EventEmitter, NgModule} from '@angular/core';
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Output() someDirective = new EventEmitter();
}
@Directive({selector: '[someDirective]'})
export class SomeDirective {
@Output() someDirective = new EventEmitter();
}
@Component({selector: 'my-component', template: '<div (someDirective)="noop()"></div>'})
export class MyComponent {
noop() {}
}
@Component({selector: 'my-component', template: '<div (someDirective)="noop()"></div>'})
export class MyComponent {
noop() {}
}
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
@NgModule({declarations: [SomeDirective, MyComponent]})
export class MyModule{}
`
}
};
// MyComponent definition should be:
const MyComponentDefinition = `
const $c0_a0$ = [${AttributeMarker.Bindings}, "someDirective"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $c0_a0$);
$r3$.ɵɵlistener("someDirective", function MyComponent_Template_div_someDirective_0_listener($event) { return ctx.noop(); });
$r3$.ɵɵelementEnd();
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: [[${AttributeMarker.Bindings}, "someDirective"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵlistener("someDirective", function MyComponent_Template_div_someDirective_0_listener($event) { return ctx.noop(); });
$r3$.ɵɵelementEnd();
}
},
directives: [SomeDirective],
encapsulation: 2
});
`;
const result = compile(files, angularFiles);
const source = result.source;

View File

@ -196,7 +196,6 @@ describe('i18n support in the template compiler', () => {
else {
$I18N_0$ = $localize \`:meaningA|descA@@idA:Content A\`;
}
const $_c2$ = [${AttributeMarker.I18n}, "title"];
var $I18N_3$;
if (ngI18nClosureMode) {
/**
@ -269,32 +268,33 @@ describe('i18n support in the template compiler', () => {
}
const $_c25$ = ["title", $I18N_23$];
consts: [[${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18n(1, $I18N_0$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(2, "div", $_c2$);
$r3$.ɵɵelementStart(2, "div", 0);
$r3$.ɵɵi18nAttributes(3, $_c5$);
$r3$.ɵɵtext(4, "Content B");
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(5, "div", $_c6$);
$r3$.ɵɵelementStart(5, "div", 0);
$r3$.ɵɵi18nAttributes(6, $_c9$);
$r3$.ɵɵtext(7, "Content C");
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(8, "div", $_c10$);
$r3$.ɵɵelementStart(8, "div", 0);
$r3$.ɵɵi18nAttributes(9, $_c13$);
$r3$.ɵɵtext(10, "Content D");
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(11, "div", $_c14$);
$r3$.ɵɵelementStart(11, "div", 0);
$r3$.ɵɵi18nAttributes(12, $_c17$);
$r3$.ɵɵtext(13, "Content E");
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(14, "div", $_c18$);
$r3$.ɵɵelementStart(14, "div", 0);
$r3$.ɵɵi18nAttributes(15, $_c21$);
$r3$.ɵɵtext(16, "Content F");
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(17, "div", $_c22$);
$r3$.ɵɵelementStart(17, "div", 0);
$r3$.ɵɵi18nAttributes(18, $_c25$);
$r3$.ɵɵtext(19, "Content G");
$r3$.ɵɵelementEnd();
@ -311,11 +311,11 @@ describe('i18n support in the template compiler', () => {
`;
const output = `
const $_c0$ = ["id", "static", "title", ""];
consts: [["id", "static", "title", ""]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $_c0$);
$r3$.ɵɵelement(0, "div", 0);
}
}
`;
@ -332,11 +332,11 @@ describe('i18n support in the template compiler', () => {
`;
const output = `
const $_c0$ = [3, "title"];
consts: [[3, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $_c0$);
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("title", ctx.title);
@ -354,7 +354,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = ["id", "static", ${AttributeMarker.I18n}, "title"];
var $I18N_1$;
if (ngI18nClosureMode) {
/**
@ -369,9 +368,10 @@ describe('i18n support in the template compiler', () => {
}
const $_c1$ = ["title", $I18N_1$];
consts: [["id", "static", ${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵi18nAttributes(1, $_c1$);
$r3$.ɵɵelementEnd();
}
@ -395,7 +395,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = ["id", "dynamic-1", ${AttributeMarker.I18n}, "aria-roledescription", "title", "aria-label"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_5526535577705876535$$APP_SPEC_TS_1$ = goog.getMsg("static text");
@ -439,7 +438,6 @@ describe('i18n support in the template compiler', () => {
"title", $I18N_2$,
"aria-label", $I18N_3$
];
const $_c2$ = ["id", "dynamic-2", ${AttributeMarker.I18n}, "title", "aria-roledescription"];
var $I18N_6$;
if (ngI18nClosureMode) {
/**
@ -473,15 +471,16 @@ describe('i18n support in the template compiler', () => {
"aria-roledescription", $I18N_7$
];
consts: 5,
decls: 5,
vars: 8,
consts: [["id", "dynamic-1", ${AttributeMarker.I18n}, "aria-roledescription", "title", "aria-label"], ["id", "dynamic-2", ${AttributeMarker.I18n}, "title", "aria-roledescription"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵpipe(1, "uppercase");
$r3$.ɵɵi18nAttributes(2, $_c1$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(3, "div", $_c2$);
$r3$.ɵɵelementStart(3, "div", 1);
$r3$.ɵɵi18nAttributes(4, $_c3$);
$r3$.ɵɵelementEnd();
}
@ -503,7 +502,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.I18n}, "title"];
var $I18N_1$;
if (ngI18nClosureMode) {
/**
@ -521,9 +519,10 @@ describe('i18n support in the template compiler', () => {
}
const $_c3$ = ["title", $I18N_1$];
consts: [[${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵpipe(1, "uppercase");
$r3$.ɵɵi18nAttributes(2, $_c3$);
$r3$.ɵɵelementEnd();
@ -545,8 +544,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $_c1$ = [${AttributeMarker.I18n}, "title"];
var $I18N_1$;
if (ngI18nClosureMode) {
/**
@ -566,7 +563,7 @@ describe('i18n support in the template compiler', () => {
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵelementStart(1, "div", $_c1$);
$r3$.ɵɵelementStart(1, "div", 1);
$r3$.ɵɵpipe(2, "uppercase");
$r3$.ɵɵi18nAttributes(3, $_c2$);
$r3$.ɵɵelementEnd();
@ -579,11 +576,12 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 1,
decls: 1,
vars: 1,
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 3, "div", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 3, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngForOf", ctx.items);
@ -600,7 +598,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.I18n}, "title"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_3462388422673575127$$APP_SPEC_TS_2$ = goog.getMsg("{$interpolation} title", {
@ -614,11 +611,12 @@ describe('i18n support in the template compiler', () => {
}
const $_c3$ = ["title", $I18N_1$];
consts: 2,
decls: 2,
vars: 1,
consts: [[${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵi18nAttributes(1, $_c3$);
$r3$.ɵɵelementEnd();
}
@ -648,10 +646,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [
"id", "dynamic-1",
${AttributeMarker.I18n}, "aria-roledescription", "title", "aria-label"
];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_5526535577705876535$$APP_SPEC_TS_1$ = goog.getMsg("static text");
@ -695,7 +689,6 @@ describe('i18n support in the template compiler', () => {
"title", $I18N_2$,
"aria-label", $I18N_3$
];
const $_c2$ = ["id", "dynamic-2", ${AttributeMarker.I18n}, "title", "aria-roledescription"];
var $I18N_6$;
if (ngI18nClosureMode) {
/**
@ -729,15 +722,19 @@ describe('i18n support in the template compiler', () => {
"aria-roledescription", $I18N_7$
];
consts: 5,
decls: 5,
vars: 8,
consts: [[
"id", "dynamic-1",
${AttributeMarker.I18n}, "aria-roledescription", "title", "aria-label"
], ["id", "dynamic-2", ${AttributeMarker.I18n}, "title", "aria-roledescription"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵpipe(1, "uppercase");
$r3$.ɵɵi18nAttributes(2, $_c1$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(3, "div", $_c2$);
$r3$.ɵɵelementStart(3, "div", 1);
$r3$.ɵɵi18nAttributes(4, $_c3$);
$r3$.ɵɵelementEnd();
}
@ -761,8 +758,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $_c1$ = [${AttributeMarker.I18n}, "title"];
var $I18N_2$;
if (ngI18nClosureMode) {
/**
@ -782,7 +777,7 @@ describe('i18n support in the template compiler', () => {
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵelementStart(1, "div", $_c1$);
$r3$.ɵɵelementStart(1, "div", 1);
$r3$.ɵɵpipe(2, "uppercase");
$r3$.ɵɵi18nAttributes(3, $_c4$);
$r3$.ɵɵelementEnd();
@ -795,11 +790,12 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 1,
decls: 1,
vars: 1,
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 3, "div", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 4, 3, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngForOf", ctx.items);
@ -816,7 +812,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.I18n}, "title"];
var $I18N_0$;
if (ngI18nClosureMode) {
/**
@ -839,9 +834,10 @@ describe('i18n support in the template compiler', () => {
$I18N_2$ = $localize \`Some content\`;
}
consts: [[${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵi18nAttributes(1, $_c1$);
$r3$.ɵɵi18n(2, $I18N_2$);
$r3$.ɵɵelementEnd();
@ -1033,7 +1029,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD1\uFFFD"}:PH_B: \`;
}
consts: 2,
decls: 2,
vars: 2,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1170,7 +1166,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD0\uFFFD"}:INTERPOLATION:\`;
}
consts: 7,
decls: 7,
vars: 5,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1258,7 +1254,7 @@ describe('i18n support in the template compiler', () => {
}
$I18N_1$ = $r3$.ɵɵi18nPostprocess($I18N_1$);
consts: 9,
decls: 9,
vars: 5,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1307,7 +1303,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c1$ = [${AttributeMarker.I18n}, "title"];
var $I18N_2$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_4782264005467235841$$APP_SPEC_TS_3$ = goog.getMsg("Span title {$interpolation} and {$interpolation_1}", {
@ -1365,13 +1360,14 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD/#7\uFFFD"}:CLOSE_TAG_SPAN:\`;
}
consts: 9,
decls: 9,
vars: 7,
consts: [[${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵelementStart(2, "span", $_c1$);
$r3$.ɵɵelementStart(2, "span", 0);
$r3$.ɵɵi18nAttributes(3, $_c4$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵi18nEnd();
@ -1379,7 +1375,7 @@ describe('i18n support in the template compiler', () => {
$r3$.ɵɵelementStart(4, "div");
$r3$.ɵɵi18nStart(5, $I18N_6$);
$r3$.ɵɵpipe(6, "uppercase");
$r3$.ɵɵelementStart(7, "span", $_c1$);
$r3$.ɵɵelementStart(7, "span", 0);
$r3$.ɵɵi18nAttributes(8, $_c9$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵi18nEnd();
@ -1417,7 +1413,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Template}, "ngIf"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_7679414751795588050$$APP_SPEC_TS__1$ = goog.getMsg(" Some other content {$interpolation} {$startTagDiv} More nested levels with bindings {$interpolation_1} {$closeTagDiv}", {
@ -1454,13 +1449,14 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 1,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵtext(1, " Some content ");
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 4, "div", $_c0$);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 4, "div", 0);
$r3$.ɵɵelementEnd();
}
if (rf & 2) {
@ -1481,15 +1477,11 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = ["src", "logo.png"];
const $_c1$ = ["src", "logo.png", ${AttributeMarker.Template}, "ngIf"];
const $_c2$ = ["src", "logo.png", ${AttributeMarker.Bindings}, "title", ${AttributeMarker.Template}, "ngIf"];
function MyComponent_img_1_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "img", $_c0$);
$r3$.ɵɵelement(0, "img", 0);
}
}
const $_c3$ = ["src", "logo.png", ${AttributeMarker.I18n}, "title"];
var $I18N_2$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_2367729185105559721$$APP_SPEC_TS__2$ = goog.getMsg("App logo #{$interpolation}", {
@ -1504,7 +1496,7 @@ describe('i18n support in the template compiler', () => {
const $_c4$ = ["title", $I18N_2$];
function MyComponent_img_2_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "img", $_c3$);
$r3$.ɵɵelementStart(0, "img", 3);
$r3$.ɵɵi18nAttributes(1, $_c4$);
$r3$.ɵɵelementEnd();
}
@ -1515,13 +1507,14 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 2,
consts: [["src", "logo.png"], ["src", "logo.png", ${AttributeMarker.Template}, "ngIf"], ["src", "logo.png", ${AttributeMarker.Bindings}, "title", ${AttributeMarker.Template}, "ngIf"], ["src", "logo.png", ${AttributeMarker.I18n}, "title"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "img", $_c0$);
$r3$.ɵɵtemplate(1, MyComponent_img_1_Template, 1, 0, "img", $_c1$);
$r3$.ɵɵtemplate(2, MyComponent_img_2_Template, 2, 1, "img", $_c2$);
$r3$.ɵɵelement(0, "img", 0);
$r3$.ɵɵtemplate(1, MyComponent_img_1_Template, 1, 0, "img", 1);
$r3$.ɵɵtemplate(2, MyComponent_img_2_Template, 2, 1, "img", 2);
}
if (rf & 2) {
$r3$.ɵɵadvance(1);
@ -1561,7 +1554,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Template}, "ngIf"];
function MyComponent_div_2_div_4_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵi18nStart(0, $I18N_0$, 2);
@ -1582,7 +1574,7 @@ describe('i18n support in the template compiler', () => {
$r3$.ɵɵelementStart(1, "div");
$r3$.ɵɵelementStart(2, "div");
$r3$.ɵɵpipe(3, "uppercase");
$r3$.ɵɵtemplate(4, MyComponent_div_2_div_4_Template, 3, 2, "div", $_c1$);
$r3$.ɵɵtemplate(4, MyComponent_div_2_div_4_Template, 3, 2, "div", 0);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementEnd();
$r3$.ɵɵi18nEnd();
@ -1656,14 +1648,15 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 4,
decls: 4,
vars: 2,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 5, "div", $_c1$);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 4, 4, "div", $_c1$);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 5, 5, "div", 0);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 4, 4, "div", 0);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementEnd();
}
@ -1685,7 +1678,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Template}, "ngIf"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_119975189388320493$$APP_SPEC_TS__1$ = goog.getMsg("Some other content {$startTagSpan}{$interpolation}{$closeTagSpan}", {
@ -1717,11 +1709,12 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 1,
decls: 1,
vars: 1,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 3, 1, "div", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 3, 1, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngIf", ctx.visible);
@ -1738,7 +1731,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Bindings}, "click"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_APP_SPEC_TS_2$ = goog.getMsg("Hello");
@ -1748,9 +1740,10 @@ describe('i18n support in the template compiler', () => {
$I18N_1$ = $localize \`Hello\`;
}
consts: [[${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c0$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵlistener("click", function MyComponent_Template_div_click_0_listener($event) { return ctx.onClick(); });
$r3$.ɵɵi18n(1, $I18N_1$);
$r3$.ɵɵelementEnd();
@ -1808,7 +1801,7 @@ describe('i18n support in the template compiler', () => {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
consts: 2,
decls: 2,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1875,7 +1868,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [${AttributeMarker.Classes}, "myClass"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_5295701706185791735$$APP_SPEC_TS_1$ = goog.getMsg("Text #1");
@ -1884,7 +1876,6 @@ describe('i18n support in the template compiler', () => {
else {
$I18N_1$ = $localize \`Text #1\`;
}
const $_c2$ = [${AttributeMarker.Styles}, "padding", "10px"];
var $I18N_3$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_4722270221386399294$$APP_SPEC_TS_3$ = goog.getMsg("Text #2");
@ -1894,14 +1885,15 @@ describe('i18n support in the template compiler', () => {
$I18N_3$ = $localize \`Text #2\`;
}
consts: 4,
decls: 4,
vars: 0,
consts: [[${AttributeMarker.Classes}, "myClass"], [${AttributeMarker.Styles}, "padding", "10px"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "span", $_c0$);
$r3$.ɵɵelementStart(0, "span", 0);
$r3$.ɵɵi18n(1, $I18N_1$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(2, "span", $_c1$);
$r3$.ɵɵelementStart(2, "span", 1);
$r3$.ɵɵi18n(3, $I18N_3$);
$r3$.ɵɵelementEnd();
}
@ -1931,7 +1923,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD0\uFFFD"}:INTERPOLATION:\`;
}
consts: 3,
decls: 3,
vars: 3,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -1978,7 +1970,7 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 1,
decls: 1,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2032,7 +2024,7 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 5,
decls: 5,
vars: 3,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2094,7 +2086,7 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2192,7 +2184,7 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2248,7 +2240,7 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2278,7 +2270,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = ["src", "logo.png", "title", "Logo"];
var $I18N_0$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_4891196282781544695$$APP_SPEC_TS_0$ = goog.getMsg("{$tagImg} is my logo #1 ", {
@ -2304,16 +2295,17 @@ describe('i18n support in the template compiler', () => {
function MyComponent_ng_template_3_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵi18nStart(0, $I18N_2$);
$r3$.ɵɵelement(1, "img", $_c0$);
$r3$.ɵɵelement(1, "img", 0);
$r3$.ɵɵi18nEnd();
}
}
consts: [["src", "logo.png", "title", "Logo"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementContainerStart(0);
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵelement(2, "img", $_c0$);
$r3$.ɵɵelement(2, "img", 0);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementContainerEnd();
$r3$.ɵɵtemplate(3, MyComponent_ng_template_3_Template, 2, 0, "ng-template");
@ -2406,7 +2398,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD/#2\uFFFD"}:CLOSE_TAG_NG_CONTAINER:\`;
}
consts: 3,
decls: 3,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2444,7 +2436,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD/#2\uFFFD"}:CLOSE_TAG_NG_CONTAINER:\`;
}
consts: 4,
decls: 4,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2471,7 +2463,6 @@ describe('i18n support in the template compiler', () => {
`;
const output = String.raw `
const $_c0$ = [4, "ngIf"];
var $I18N_1$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_3308216566145348998$$APP_SPEC_TS___2$ = goog.getMsg("Content A");
@ -2504,12 +2495,13 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 2,
decls: 2,
vars: 2,
consts: [[4, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_0_Template, 1, 0, undefined, $_c0$);
$r3$.ɵɵtemplate(1, MyComponent_ng_container_1_Template, 2, 0, "ng-container", $_c0$);
$r3$.ɵɵtemplate(0, MyComponent_0_Template, 1, 0, undefined, 0);
$r3$.ɵɵtemplate(1, MyComponent_ng_container_1_Template, 2, 0, "ng-container", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngIf", ctx.someFlag);
@ -2582,7 +2574,7 @@ describe('i18n support in the template compiler', () => {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
consts: 2,
decls: 2,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2640,7 +2632,7 @@ describe('i18n support in the template compiler', () => {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
consts: 1,
decls: 1,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2679,9 +2671,6 @@ describe('i18n support in the template compiler', () => {
$I18N_0$ = $r3$.ɵɵi18nPostprocess($I18N_0$, {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
const $_c0$ = ["title", "icu only", ${AttributeMarker.Template}, "ngIf"];
const $_c1$ = ["title", "icu and text", ${AttributeMarker.Template}, "ngIf"];
const $_c2$ = ["title", "icu only"];
var $I18N_3$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_8806993169187953163$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} other {other}}");
@ -2695,7 +2684,7 @@ describe('i18n support in the template compiler', () => {
});
function MyComponent_div_2_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c2$);
$r3$.ɵɵelementStart(0, "div", 2);
$r3$.ɵɵtext(1, " ");
$r3$.ɵɵi18n(2, $I18N_3$);
$r3$.ɵɵtext(3, " ");
@ -2707,7 +2696,6 @@ describe('i18n support in the template compiler', () => {
$r3$.ɵɵi18nApply(2);
}
}
const $_c3$ = ["title", "icu and text"];
var $I18N_5$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_1922743304863699161$$APP_SPEC_TS__5$ = goog.getMsg("{VAR_SELECT, select, 0 {no emails} 1 {one email} other {{INTERPOLATION} emails}}");
@ -2722,7 +2710,7 @@ describe('i18n support in the template compiler', () => {
});
function MyComponent_div_3_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $_c3$);
$r3$.ɵɵelementStart(0, "div", 3);
$r3$.ɵɵtext(1, " You have ");
$r3$.ɵɵi18n(2, $I18N_5$);
$r3$.ɵɵtext(3, ". ");
@ -2735,15 +2723,16 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 4,
decls: 4,
vars: 3,
consts: [["title", "icu only", ${AttributeMarker.Template}, "ngIf"], ["title", "icu and text", ${AttributeMarker.Template}, "ngIf"], ["title", "icu only"], ["title", "icu and text"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18n(1, $I18N_0$);
$r3$.ɵɵelementEnd();
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 4, 1, "div", $_c0$);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 4, 2, "div", $_c1$);
$r3$.ɵɵtemplate(2, MyComponent_div_2_Template, 4, 1, "div", 0);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 4, 2, "div", 1);
}
if (rf & 2) {
$r3$.ɵɵi18nExp(ctx.gender);
@ -2821,7 +2810,6 @@ describe('i18n support in the template compiler', () => {
"START_TAG_DIV": "<div class=\"other\">",
"CLOSE_TAG_DIV": "</div>"
});
const $_c2$ = [1, "other"];
var $I18N_0$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_5791551881115084301$$APP_SPEC_TS_0$ = goog.getMsg(" {$icu} {$startBoldText}Other content{$closeBoldText}{$startTagDiv}{$startItalicText}Another content{$closeItalicText}{$closeTagDiv}", {
@ -2846,14 +2834,15 @@ describe('i18n support in the template compiler', () => {
String.raw `{"\uFFFD/#3\uFFFD"}:CLOSE_TAG_DIV:\`;
}
consts: 5,
decls: 5,
vars: 1,
consts: [[1, "other"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵelement(2, "b");
$r3$.ɵɵelementStart(3, "div", $_c2$);
$r3$.ɵɵelementStart(3, "div", 0);
$r3$.ɵɵelement(4, "i");
$r3$.ɵɵelementEnd();
$r3$.ɵɵi18nEnd();
@ -2888,7 +2877,7 @@ describe('i18n support in the template compiler', () => {
"INTERPOLATION": "\uFFFD1\uFFFD"
});
consts: 2,
decls: 2,
vars: 2,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -2950,7 +2939,7 @@ describe('i18n support in the template compiler', () => {
String.raw `{$I18N_1$}:ICU: $` + String.raw `{$I18N_2$}:ICU_1: \`;
}
consts: 2,
decls: 2,
vars: 2,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -3004,7 +2993,6 @@ describe('i18n support in the template compiler', () => {
$I18N_2$ = $r3$.ɵɵi18nPostprocess($I18N_2$, {
"VAR_SELECT": "\uFFFD1\uFFFD"
});
const $_c3$ = [${AttributeMarker.Template}, "ngIf"];
var $I18N_4$;
if (ngI18nClosureMode) {
const $MSG_APP_SPEC_TS__4$ = goog.getMsg("{VAR_SELECT, select, male {male} female {female} other {other}}");
@ -3052,14 +3040,15 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 4,
decls: 4,
vars: 3,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵelement(2, "div");
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 2, 1, "div", $_c3$);
$r3$.ɵɵtemplate(3, MyComponent_div_3_Template, 2, 1, "div", 0);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementEnd();
}
@ -3111,7 +3100,7 @@ describe('i18n support in the template compiler', () => {
$I18N_0$ = $localize \` $` +
String.raw `{$I18N_1$}:ICU: \`;
}
consts: 2,
decls: 2,
vars: 2,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -3159,7 +3148,7 @@ describe('i18n support in the template compiler', () => {
"INTERPOLATION": "\uFFFD2\uFFFD"
});
consts: 2,
decls: 2,
vars: 3,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -3199,7 +3188,6 @@ describe('i18n support in the template compiler', () => {
$I18N_1$ = $r3$.ɵɵi18nPostprocess($I18N_1$, {
"VAR_SELECT": "\uFFFD0\uFFFD"
});
const $_c2$ = [${AttributeMarker.Template}, "ngIf"];
var $I18N_3$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_7068143081688428291$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} 30 {thirty} other {other}}");
@ -3241,13 +3229,14 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 2,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵtemplate(2, MyComponent_span_2_Template, 2, 1, "span", $_c2$);
$r3$.ɵɵtemplate(2, MyComponent_span_2_Template, 2, 1, "span", 0);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementEnd();
}
@ -3287,16 +3276,15 @@ describe('i18n support in the template compiler', () => {
"INTERPOLATION": "\uFFFD1\uFFFD",
"INTERPOLATION_1": "\uFFFD2\uFFFD"
});
const $_c0$ = [${AttributeMarker.Template}, "ngIf"];
var $I18N_4$;
var $I18N_3$;
if (ngI18nClosureMode) {
const $MSG_EXTERNAL_2310343208266678305$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} 30 {thirty} other {other: {INTERPOLATION}}}");
$I18N_4$ = $MSG_EXTERNAL_2310343208266678305$$APP_SPEC_TS__3$;
$I18N_3$ = $MSG_EXTERNAL_2310343208266678305$$APP_SPEC_TS__3$;
}
else {
$I18N_4$ = $localize \`{VAR_SELECT, select, 10 {ten} 20 {twenty} 30 {thirty} other {other: {INTERPOLATION}}}\`;
}
$I18N_4$ = $r3$.ɵɵi18nPostprocess($I18N_4$, {
$I18N_3$ = $r3$.ɵɵi18nPostprocess($I18N_3$, {
"VAR_SELECT": "\uFFFD0:1\uFFFD",
"INTERPOLATION": "\uFFFD1:1\uFFFD"
});
@ -3306,7 +3294,7 @@ describe('i18n support in the template compiler', () => {
"startTagSpan": "\uFFFD*2:1\uFFFD\uFFFD#1:1\uFFFD",
"closeTagSpan": "\uFFFD/#1:1\uFFFD\uFFFD/*2:1\uFFFD",
"icu": $I18N_1$,
"icu_1": $I18N_4$
"icu_1": $I18N_3$
});
$I18N_0$ = $MSG_EXTERNAL_7186042105600518133$$APP_SPEC_TS_0$;
}
@ -3314,7 +3302,7 @@ describe('i18n support in the template compiler', () => {
$I18N_0$ = $localize \` $` +
String.raw `{I18N_1}:ICU: $` +
String.raw `{"\uFFFD*2:1\uFFFD\uFFFD#1:1\uFFFD"}:START_TAG_SPAN: $` +
String.raw `{I18N_4}:ICU_1: $` +
String.raw `{I18N_3}:ICU_1: $` +
String.raw `{"\uFFFD/#1:1\uFFFD\uFFFD/*2:1\uFFFD"}:CLOSE_TAG_SPAN:\`;
}
function MyComponent_span_2_Template(rf, ctx) {
@ -3330,13 +3318,14 @@ describe('i18n support in the template compiler', () => {
}
}
consts: 3,
decls: 3,
vars: 4,
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵi18nStart(1, $I18N_0$);
$r3$.ɵɵtemplate(2, MyComponent_span_2_Template, 2, 2, "span", $_c2$);
$r3$.ɵɵtemplate(2, MyComponent_span_2_Template, 2, 2, "span", 0);
$r3$.ɵɵi18nEnd();
$r3$.ɵɵelementEnd();
}
@ -3379,7 +3368,7 @@ describe('i18n support in the template compiler', () => {
"PH_WITH_SPACES": "\uFFFD3\uFFFD"
});
consts: 2,
decls: 2,
vars: 4,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {

View File

@ -41,11 +41,11 @@ describe('compiler compliance: listen()', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"];
consts: [[${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "div", $e0_attrs$);
$r3$.ɵɵelementStart(0, "div", 0);
$r3$.ɵɵlistener("click", function MyComponent_Template_div_click_0_listener($event) {
ctx.onClick($event);
return 1 == 2;
@ -87,11 +87,11 @@ describe('compiler compliance: listen()', () => {
};
const template = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"];
consts: [[${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelementStart(0, "my-app", $e0_attrs$);
$r3$.ɵɵelementStart(0, "my-app", 0);
$r3$.ɵɵlistener("click", function MyComponent_Template_my_app_click_0_listener($event) {
return ctx.onClick($event);
});
@ -133,21 +133,18 @@ describe('compiler compliance: listen()', () => {
};
const template = `
const $t0_attrs$ = [${AttributeMarker.Template}, "ngIf"];
const $e_attrs$ = [${AttributeMarker.Bindings}, "click"];
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
const $s$ = $r3$.ɵɵgetCurrentView();
$r3$.ɵɵelementStart(0, "div");
$r3$.ɵɵelementStart(1, "div", $e_attrs$);
$r3$.ɵɵelementStart(1, "div", 1);
$r3$.ɵɵlistener("click", function MyComponent_div_0_Template_div_click_1_listener($event) {
$r3$.ɵɵrestoreView($s$);
const $comp$ = $r3$.ɵɵnextContext();
return $comp$.onClick($comp$.foo);
});
$r3$.ɵɵelementEnd();
$r3$.ɵɵelementStart(2, "button", $e_attrs$);
$r3$.ɵɵelementStart(2, "button", 1);
$r3$.ɵɵlistener("click", function MyComponent_div_0_Template_button_click_2_listener($event) {
$r3$.ɵɵrestoreView($s$);
const $comp2$ = $r3$.ɵɵnextContext();
@ -158,9 +155,10 @@ describe('compiler compliance: listen()', () => {
}
}
// ...
consts: [[${AttributeMarker.Template}, "ngIf"], [${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 3, 0, "div", $c0$);
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 3, 0, "div", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngIf", ctx.showing);
@ -195,18 +193,18 @@ describe('compiler compliance: listen()', () => {
};
const MyComponentDefinition = `
const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"];
const $e2_refs$ = ["user", ""];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 4,
decls: 4,
vars: 0,
consts: [[${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
const $s$ = $r3$.ɵɵgetCurrentView();
$r3$.ɵɵelementStart(0, "button", $e0_attrs$);
$r3$.ɵɵelementStart(0, "button", 0);
$r3$.ɵɵlistener("click", function MyComponent_Template_button_click_0_listener($event) {
$r3$.ɵɵrestoreView($s$);
const $user$ = $r3$.ɵɵreference(3);

View File

@ -148,7 +148,7 @@ describe('compiler compliance: providers', () => {
MyComponent.ngComponentDef = i0.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 1,
decls: 1,
vars: 0,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {

View File

@ -131,7 +131,7 @@ describe('compiler compliance: styling', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors:[["my-component"]],
consts: 0,
decls: 0,
vars: 0,
template: function MyComponent_Template(rf, $ctx$) {
},
@ -170,7 +170,7 @@ describe('compiler compliance: styling', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors:[["my-component"]],
consts: 0,
decls: 0,
vars: 0,
template: function MyComponent_Template(rf, $ctx$) {
},
@ -211,7 +211,7 @@ describe('compiler compliance: styling', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: 3,
decls: 3,
vars: 3,
template: function MyComponent_Template(rf, $ctx$) {
if (rf & 1) {
@ -272,7 +272,7 @@ describe('compiler compliance: styling', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
consts: 1,
decls: 1,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -435,7 +435,7 @@ describe('compiler compliance: styling', () => {
const template = `
consts: 1,
decls: 1,
vars: 2,
template: function MyComponentWithInterpolation_Template(rf, $ctx$) {
if (rf & 1) {
@ -446,7 +446,7 @@ describe('compiler compliance: styling', () => {
}
}
consts: 1,
decls: 1,
vars: 3,
template: function MyComponentWithMuchosInterpolation_Template(rf, $ctx$) {
if (rf & 1) {
@ -457,7 +457,7 @@ describe('compiler compliance: styling', () => {
}
}
consts: 1,
decls: 1,
vars: 1,
template: function MyComponentWithoutInterpolation_Template(rf, $ctx$) {
if (rf & 1) {
@ -501,16 +501,16 @@ describe('compiler compliance: styling', () => {
};
const template = `
const $_c0$ = [${AttributeMarker.Styles}, "opacity", "1"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors:[["my-component"]],
consts: 1,
decls: 1,
vars: 4,
consts: [[${AttributeMarker.Styles}, "opacity", "1"]],
template: function MyComponent_Template(rf, $ctx$) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $_c0$);
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵstyleSanitizer($r3$.ɵɵdefaultStyleSanitizer);
@ -553,7 +553,7 @@ describe('compiler compliance: styling', () => {
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors: [["my-component"]],
consts: 1,
decls: 1,
vars: 1,
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
@ -695,16 +695,16 @@ describe('compiler compliance: styling', () => {
};
const template = `
const $e0_attrs$ = [${AttributeMarker.Classes}, "grape"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors:[["my-component"]],
consts: 1,
decls: 1,
vars: 4,
consts: [[${AttributeMarker.Classes}, "grape"]],
template: function MyComponent_Template(rf, $ctx$) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵclassMap($ctx$.myClassExp);
@ -744,16 +744,16 @@ describe('compiler compliance: styling', () => {
};
const template = `
const $e0_attrs$ = [${AttributeMarker.Classes}, "foo", ${AttributeMarker.Styles}, "width", "100px"];
MyComponent.ngComponentDef = $r3$.ɵɵdefineComponent({
type: MyComponent,
selectors:[["my-component"]],
consts: 1,
decls: 1,
vars: 2,
consts: [[${AttributeMarker.Classes}, "foo", ${AttributeMarker.Styles}, "width", "100px"]],
template: function MyComponent_Template(rf, $ctx$) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $e0_attrs$);
$r3$.ɵɵelement(0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵattribute("class", "round")("style", "height:100px", $r3$.ɵɵsanitizeStyle);
@ -1029,7 +1029,7 @@ describe('compiler compliance: styling', () => {
$r3$.ɵɵclassProp("foo", ctx.myFooClass);
}
},
consts: 0,
decls: 0,
vars: 0,
`;
@ -1089,7 +1089,7 @@ describe('compiler compliance: styling', () => {
$r3$.ɵɵclassProp("foo", ctx.myFooClass);
}
},
consts: 0,
decls: 0,
vars: 0,
`;

View File

@ -50,14 +50,10 @@ describe('compiler compliance: template', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $c1$ = [${AttributeMarker.Bindings}, "title", "click", ${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $c2$ = [${AttributeMarker.Bindings}, "title", "click"];
function MyComponent_ul_0_li_1_div_1_Template(rf, ctx) {
if (rf & 1) {
const $s$ = $i0$.ɵɵgetCurrentView();
$i0$.ɵɵelementStart(0, "div", $c2$);
$i0$.ɵɵelementStart(0, "div", 2);
$i0$.ɵɵlistener("click", function MyComponent_ul_0_li_1_div_1_Template_div_click_0_listener($event){
$i0$.ɵɵrestoreView($s$);
const $inner$ = ctx.$implicit;
@ -84,7 +80,7 @@ describe('compiler compliance: template', () => {
function MyComponent_ul_0_li_1_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "li");
$i0$.ɵɵtemplate(1, MyComponent_ul_0_li_1_div_1_Template, 2, 2, "div", $c1$);
$i0$.ɵɵtemplate(1, MyComponent_ul_0_li_1_div_1_Template, 2, 2, "div", 1);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -97,7 +93,7 @@ describe('compiler compliance: template', () => {
function MyComponent_ul_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "ul");
$i0$.ɵɵtemplate(1, MyComponent_ul_0_li_1_Template, 2, 1, "li", $c0$);
$i0$.ɵɵtemplate(1, MyComponent_ul_0_li_1_Template, 2, 1, "li", 0);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -107,9 +103,10 @@ describe('compiler compliance: template', () => {
}
}
// ...
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.Bindings}, "title", "click", ${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.Bindings}, "title", "click"]],
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_ul_0_Template, 2, 1, "ul", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_ul_0_Template, 2, 1, "ul", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngForOf", ctx.items);
@ -145,13 +142,10 @@ describe('compiler compliance: template', () => {
};
const template = `
const $t0_attrs$ = [${AttributeMarker.Bindings}, "click", ${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $e_attrs$ = [${AttributeMarker.Bindings}, "click"];
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
const $s$ = $r3$.ɵɵgetCurrentView();
$r3$.ɵɵelementStart(0, "div", $e_attrs$);
$r3$.ɵɵelementStart(0, "div", 1);
$r3$.ɵɵlistener("click", function MyComponent_div_0_Template_div_click_0_listener($event) {
$r3$.ɵɵrestoreView($s$);
const $d$ = ctx.$implicit;
@ -163,9 +157,10 @@ describe('compiler compliance: template', () => {
}
}
// ...
consts: [[${AttributeMarker.Bindings}, "click", ${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.Bindings}, "click"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", $t0_attrs$);
$r3$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", 0);
}
if (rf & 2) {
$r3$.ɵɵproperty("ngForOf", ctx._data);
@ -205,7 +200,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
const $_r2$ = i0.ɵɵgetCurrentView();
$r3$.ɵɵelementStart(0, "div", $_c1$);
$r3$.ɵɵelementStart(0, "div", 2);
$r3$.ɵɵlistener("click", function MyComponent_div_0_Template_div_click_0_listener($event) {
i0.ɵɵrestoreView($_r2$);
const $ctx_r1$ = i0.ɵɵnextContext();
@ -217,7 +212,7 @@ describe('compiler compliance: template', () => {
// ...
function MyComponent_div_1_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵɵelement(0, "div", $_c3$);
$r3$.ɵɵelement(0, "div", 3);
} if (rf & 2) {
const $ctx_0$ = i0.ɵɵnextContext();
$r3$.ɵɵproperty("id", $ctx_0$);
@ -252,8 +247,6 @@ describe('compiler compliance: template', () => {
};
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
function MyComponent_span_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "span");
@ -268,9 +261,10 @@ describe('compiler compliance: template', () => {
}
}
// ...
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"]],
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_span_0_Template, 2, 2, "span", _c0);
$i0$.ɵɵtemplate(0, MyComponent_span_0_Template, 2, 2, "span", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngForOf", ctx.items);
@ -306,9 +300,6 @@ describe('compiler compliance: template', () => {
};
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
const $c1$ = [${AttributeMarker.Template}, "ngIf"];
function MyComponent_div_0_span_1_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "span");
@ -327,7 +318,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵtemplate(1, MyComponent_div_0_span_1_Template, 2, 2, "span", $c1$);
$i0$.ɵɵtemplate(1, MyComponent_div_0_span_1_Template, 2, 2, "span", 1);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -338,9 +329,10 @@ describe('compiler compliance: template', () => {
}
// ...
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"], [${AttributeMarker.Template}, "ngIf"]],
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 2, 1, "div", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 2, 1, "div", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngForOf", ctx.items);
@ -379,7 +371,6 @@ describe('compiler compliance: template', () => {
// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngFor", "ngForOf"];
function MyComponent_div_0_div_1_div_1_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
@ -397,7 +388,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_0_div_1_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵtemplate(1, MyComponent_div_0_div_1_div_1_Template, 2, 2, "div", $c0$);
$i0$.ɵɵtemplate(1, MyComponent_div_0_div_1_div_1_Template, 2, 2, "div", 0);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -410,7 +401,7 @@ describe('compiler compliance: template', () => {
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵtemplate(1, MyComponent_div_0_div_1_Template, 2, 1, "div", $c0$);
$i0$.ɵɵtemplate(1, MyComponent_div_0_div_1_Template, 2, 1, "div", 0);
$i0$.ɵɵelementEnd();
}
if (rf & 2) {
@ -420,9 +411,10 @@ describe('compiler compliance: template', () => {
}
}
// ...
consts: [[${AttributeMarker.Template}, "ngFor", "ngForOf"]],
template:function MyComponent_Template(rf, ctx){
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 2, 1, "div", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 2, 1, "div", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("ngForOf", ctx.items);
@ -456,8 +448,6 @@ describe('compiler compliance: template', () => {
};
const template = `
const $c0$ = ["attr", "l", ${AttributeMarker.Bindings}, "boundAttr"];
function MyComponent_ng_template_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵtext(0, " some-content ");
@ -466,9 +456,10 @@ describe('compiler compliance: template', () => {
// ...
consts: [["attr", "l", ${AttributeMarker.Bindings}, "boundAttr"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 1, 0, "ng-template", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 1, 0, "ng-template", 0);
}
if (rf & 2) {
$i0$.ɵɵproperty("boundAttr", ctx.b);
@ -541,15 +532,14 @@ describe('compiler compliance: template', () => {
};
const template = `
const $t0_attrs$ = [${AttributeMarker.Bindings}, "outDirective"];
function MyComponent_ng_template_0_Template(rf, ctx) { }
// ...
consts: [[${AttributeMarker.Bindings}, "outDirective"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 0, 0, "ng-template", $t0_attrs$);
$i0$.ɵɵtemplate(0, MyComponent_ng_template_0_Template, 0, 0, "ng-template", 0);
$i0$.ɵɵlistener("outDirective", function MyComponent_Template_ng_template_outDirective_0_listener($event) { return $event.doSth(); });
}
}`;
@ -746,8 +736,6 @@ describe('compiler compliance: template', () => {
};
const template = `
const $c0$ = [${AttributeMarker.Template}, "ngIf"];
function MyComponent_div_0_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelement(0, "div");
@ -755,10 +743,10 @@ describe('compiler compliance: template', () => {
}
// ...
consts: [[${AttributeMarker.Template}, "ngIf"]],
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", $c0$);
$i0$.ɵɵtemplate(0, MyComponent_div_0_Template, 1, 0, "div", 0);
$i0$.ɵɵpipe(1, "pipe");
} if (rf & 2) {
$i0$.ɵɵproperty("ngIf", $i0$.ɵɵpipeBind1(1, 1, ctx.val));

View File

@ -80,7 +80,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<div id="{{name}}"></div>');
expect(mappings).toContain({
source: '<div id="{{name}}"></div>',
generated: 'i0.ɵɵelement(0, "div", _c0)',
generated: 'i0.ɵɵelement(0, "div", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain({
@ -109,7 +109,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<div [attr]="name"></div>');
expect(mappings).toContain({
source: '<div [attr]="name"></div>',
generated: 'i0.ɵɵelement(0, "div", _c0)',
generated: 'i0.ɵɵelement(0, "div", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain({
@ -124,7 +124,7 @@ runInEachFileSystem((os) => {
expect(mappings).toContain({
source: '<div [attr]="greeting + name"></div>',
generated: 'i0.ɵɵelement(0, "div", _c0)',
generated: 'i0.ɵɵelement(0, "div", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain({
@ -138,7 +138,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<div bind-attr="name"></div>');
expect(mappings).toContain({
source: '<div bind-attr="name"></div>',
generated: 'i0.ɵɵelement(0, "div", _c0)',
generated: 'i0.ɵɵelement(0, "div", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain({
@ -152,7 +152,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<button (click)="doSomething()">Do it</button>');
expect(mappings).toContain({
source: '<button (click)="doSomething()">',
generated: 'i0.ɵɵelementStart(0, "button", _c0)',
generated: 'i0.ɵɵelementStart(0, "button", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain(
@ -168,7 +168,7 @@ runInEachFileSystem((os) => {
`<button (click)="items.push('item' + items.length)">Add Item</button>`);
expect(mappings).toContain({
source: `<button (click)="items.push('item' + items.length)">`,
generated: 'i0.ɵɵelementStart(0, "button", _c0)',
generated: 'i0.ɵɵelementStart(0, "button", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain(
@ -190,7 +190,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<button on-click="doSomething()">Do it</button>');
expect(mappings).toContain({
source: '<button on-click="doSomething()">',
generated: 'i0.ɵɵelementStart(0, "button", _c0)',
generated: 'i0.ɵɵelementStart(0, "button", 0)',
sourceUrl: '../test.ts'
});
expect(mappings).toContain(
@ -205,7 +205,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('Name: <input [(ngModel)]="name">');
expect(mappings).toContain({
source: '<input [(ngModel)]="name">',
generated: 'i0.ɵɵelementStart(1, "input", _c0)',
generated: 'i0.ɵɵelementStart(1, "input", 0)',
sourceUrl: '../test.ts'
});
// TODO: improve mappings here
@ -226,7 +226,7 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('Name: <input bindon-ngModel="name">');
expect(mappings).toContain({
source: '<input bindon-ngModel="name">',
generated: 'i0.ɵɵelementStart(1, "input", _c0)',
generated: 'i0.ɵɵelementStart(1, "input", 0)',
sourceUrl: '../test.ts'
});
// TODO: improve mappings here
@ -424,14 +424,14 @@ runInEachFileSystem((os) => {
const mappings = compileAndMap('<div class=\\"some-class\\">this is a test</div>');
expect(mappings).toContain({
generated: 'i0.ɵɵelementStart(0, "div", _c0)',
generated: 'i0.ɵɵelementStart(0, "div", 0)',
source: '<div class=\\"some-class\\">',
sourceUrl: '../test.ts'
});
const c2Mapping =
mappings.find(mapping => /var _c0 = \[1, "some-class"\];/.test(mapping.generated));
expect(c2Mapping).toBeDefined();
const attrsMapping =
mappings.find(mapping => /consts: \[\[1, "some-class"\]\]/.test(mapping.generated));
expect(attrsMapping).toBeDefined();
});
});

View File

@ -240,12 +240,18 @@ export function compileComponentFromMetadata(
definitionMap.set('ngContentSelectors', ngContentSelectors);
}
// e.g. `consts: 2`
definitionMap.set('consts', o.literal(templateBuilder.getConstCount()));
// e.g. `decls: 2`
definitionMap.set('decls', o.literal(templateBuilder.getConstCount()));
// e.g. `vars: 2`
definitionMap.set('vars', o.literal(templateBuilder.getVarCount()));
// e.g. `consts: [['one', 'two'], ['three', 'four']]
const consts = templateBuilder.getConsts();
if (consts.length > 0) {
definitionMap.set('consts', o.literalArr(consts));
}
definitionMap.set('template', templateFunctionExpression);
// e.g. `directives: [MyDirective]`

View File

@ -165,8 +165,8 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
private templateIndex: number|null, private templateName: string|null,
private directiveMatcher: SelectorMatcher|null, private directives: Set<o.Expression>,
private pipeTypeByName: Map<string, o.Expression>, private pipes: Set<o.Expression>,
private _namespace: o.ExternalReference, private relativeContextFilePath: string,
private i18nUseExternalIds: boolean) {
private _namespace: o.ExternalReference, relativeContextFilePath: string,
private i18nUseExternalIds: boolean, private _constants: o.Expression[] = []) {
this._bindingScope = parentBindingScope.nestedScope(level);
// Turn the relative context file path into an identifier by replacing non-alphanumeric
@ -606,7 +606,7 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
// add attributes for directive and projection matching purposes
attributes.push(...this.prepareNonRenderAttrs(
allOtherInputs, element.outputs, stylingBuilder, [], i18nAttrs, ngProjectAsAttr));
parameters.push(this.toAttrsParam(attributes));
parameters.push(this.addConstants(attributes));
// local refs (ex.: <div #foo #bar="baz">)
parameters.push(this.prepareRefsParameter(element.references));
@ -869,7 +869,7 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
(a: t.TextAttribute) => { attrsExprs.push(asLiteral(a.name), asLiteral(a.value)); });
attrsExprs.push(...this.prepareNonRenderAttrs(
template.inputs, template.outputs, undefined, template.templateAttrs));
parameters.push(this.toAttrsParam(attrsExprs));
parameters.push(this.addConstants(attrsExprs));
// local refs (ex.: <ng-template #foo>)
if (template.references && template.references.length) {
@ -881,7 +881,8 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
const templateVisitor = new TemplateDefinitionBuilder(
this.constantPool, this._bindingScope, this.level + 1, contextName, this.i18n,
templateIndex, templateName, this.directiveMatcher, this.directives, this.pipeTypeByName,
this.pipes, this._namespace, this.fileBasedI18nSuffix, this.i18nUseExternalIds);
this.pipes, this._namespace, this.fileBasedI18nSuffix, this.i18nUseExternalIds,
this._constants);
// Nested templates must not be visited until after their parent templates have completed
// processing, so they are queued here until after the initial pass. Otherwise, we wouldn't
@ -1020,6 +1021,8 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
getVarCount() { return this._pureFunctionSlots; }
getConsts() { return this._constants; }
getNgContentSelectors(): o.Expression|null {
return this._ngContentReservedSlots.length ?
this.constantPool.getConstLiteral(asLiteral(this._ngContentReservedSlots), true) :
@ -1291,10 +1294,21 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
return attrExprs;
}
private toAttrsParam(attrsExprs: o.Expression[]): o.Expression {
return attrsExprs.length > 0 ?
this.constantPool.getConstLiteral(o.literalArr(attrsExprs), true) :
o.TYPED_NULL_EXPR;
private addConstants(constExprs: o.Expression[]): o.LiteralExpr {
if (constExprs.length > 0) {
const literal = o.literalArr(constExprs);
// Try to reuse a literal that's already in the array, if possible.
for (let i = 0; i < this._constants.length; i++) {
if (this._constants[i].isEquivalent(literal)) {
return o.literal(i);
}
}
return o.literal(this._constants.push(literal) - 1);
}
return o.TYPED_NULL_EXPR;
}
private prepareRefsParameter(references: t.Reference[]): o.Expression {

View File

@ -14,7 +14,7 @@ The layout is as such:
| Section | `LView` | `TView.data`
| ---------- | ------------------------------------------------------------ | --------------------------------------------------
| `HEADER` | contextual data | mostly `null`
| `CONSTS` | DOM, pipe, and local ref instances |
| `DECLS` | DOM, pipe, and local ref instances |
| `VARS` | binding values | property names
| `EXPANDO` | host bindings; directive instances; providers; dynamic nodes | host prop names; directive tokens; provider tokens; `null`
@ -25,10 +25,10 @@ The layout is as such:
Mostly information such as parent `LView`, `Sanitizer`, `TView`, and many more bits of information needed for template rendering.
## `CONSTS`
## `DECLS`
`CONSTS` contain the DOM elements, pipe instances, and local refs.
The size of the `CONSTS` section is declared in the property `consts` of the component definition.
`DECLS` contain the DOM elements, pipe instances, and local refs.
The size of the `DECLS` section is declared in the property `decls` of the component definition.
```typescript
@Component({
@ -38,7 +38,7 @@ class MyApp {
static ngComponentDef = ɵɵdefineComponent({
...,
consts: 5,
decls: 5,
template: function(rf: RenderFlags, ctx: MyApp) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div');
@ -89,7 +89,7 @@ class MyApp {
static ngComponentDef = ɵɵdefineComponent({
...,
consts: 2, // Two DOM Elements.
decls: 2, // Two DOM Elements.
vars: 2, // Two bindings.
template: function(rf: RenderFlags, ctx: MyApp) {
if (rf & RenderFlags.Create) {
@ -142,7 +142,7 @@ class MyApp {
static ngComponentDef = ɵɵdefineComponent({
...,
consts: 1,
decls: 1,
template: function(rf: RenderFlags, ctx: MyApp) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'child', ['tooltip', null]);
@ -276,7 +276,7 @@ class MyApp {
static ngComponentDef = ɵɵdefineComponent({
...,
consts: 1,
decls: 1,
template: function(rf: RenderFlags, ctx: MyApp) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'child');

View File

@ -128,7 +128,7 @@ export function renderComponent<T>(
const rootContext = createRootContext(opts.scheduler, opts.playerHandler);
const renderer = rendererFactory.createRenderer(hostRNode, componentDef);
const rootTView = createTView(-1, null, 1, 0, null, null, null, null);
const rootTView = createTView(-1, null, 1, 0, null, null, null, null, null);
const rootView: LView = createLView(
null, rootTView, rootContext, rootFlags, null, null, rendererFactory, renderer, undefined,
opts.injector || null);

View File

@ -161,7 +161,7 @@ export class ComponentFactory<T> extends viewEngine_ComponentFactory<T> {
}
// Create the root view. Uses empty TView and ContentTemplate.
const rootTView = createTView(-1, null, 1, 0, null, null, null, null);
const rootTView = createTView(-1, null, 1, 0, null, null, null, null, null);
const rootLView = createLView(
null, rootTView, rootContext, rootFlags, null, null, rendererFactory, renderer, sanitizer,
rootViewInjector);

View File

@ -18,6 +18,7 @@ import {stringify} from '../util/stringify';
import {EMPTY_ARRAY, EMPTY_OBJ} from './empty';
import {NG_BASE_DEF, NG_COMPONENT_DEF, NG_DIRECTIVE_DEF, NG_FACTORY_DEF, NG_LOCALE_ID_DEF, NG_MODULE_DEF, NG_PIPE_DEF} from './fields';
import {ComponentDef, ComponentDefFeature, ComponentTemplate, ComponentType, ContentQueriesFunction, DirectiveDef, DirectiveDefFeature, DirectiveType, DirectiveTypesOrFactory, FactoryFn, HostBindingsFunction, PipeDef, PipeType, PipeTypesOrFactory, ViewQueriesFunction, ɵɵBaseDef} from './interfaces/definition';
import {TAttributes} from './interfaces/node';
// while SelectorFlags is unused here, it's required so that types don't get resolved lazily
// see: https://github.com/Microsoft/web-build-tools/issues/1050
import {CssSelectorList, SelectorFlags} from './interfaces/projection';
@ -56,7 +57,7 @@ export function ɵɵdefineComponent<T>(componentDefinition: {
* can pre-fill the array and set the binding start index.
*/
// TODO(kara): remove queries from this count
consts: number;
decls: number;
/**
* The number of bindings in this component template (including pure fn bindings).
@ -171,6 +172,9 @@ export function ɵɵdefineComponent<T>(componentDefinition: {
*/
template: ComponentTemplate<T>;
/** Constants for the nodes in the component's view. */
consts?: TAttributes[];
/**
* An array of `ngContent[selector]` values that were found in the template.
*/
@ -248,10 +252,11 @@ export function ɵɵdefineComponent<T>(componentDefinition: {
const def: Mutable<ComponentDef<any>, keyof ComponentDef<any>> = {
type: type,
providersResolver: null,
consts: componentDefinition.consts,
decls: componentDefinition.decls,
vars: componentDefinition.vars,
factory: null,
template: componentDefinition.template || null !,
consts: componentDefinition.consts || null,
ngContentSelectors: componentDefinition.ngContentSelectors,
hostBindings: componentDefinition.hostBindings || null,
contentQueries: componentDefinition.contentQueries || null,

View File

@ -22,7 +22,7 @@ import {DirectiveDef} from '../interfaces/definition';
* type: ComponentWithProviders,
* selectors: [['component-with-providers']],
* factory: () => new ComponentWithProviders(directiveInject(GreeterDE as any)),
* consts: 1,
* decls: 1,
* vars: 1,
* template: function(fs: RenderFlags, ctx: ComponentWithProviders) {
* if (fs & RenderFlags.Create) {

View File

@ -53,10 +53,10 @@ export function ɵɵcontainer(index: number): void {
*
* @param index The index of the container in the data array
* @param templateFn Inline template
* @param consts The number of nodes, local refs, and pipes for this template
* @param decls The number of nodes, local refs, and pipes for this template
* @param vars The number of bindings for this template
* @param tagName The name of the container element, if applicable
* @param attrs The attrs attached to the container, if applicable
* @param constsIndex Index of template in the `consts` array.
* @param localRefs A set of local reference bindings on the element.
* @param localRefExtractor A function which extracts local-refs values from the template.
* Defaults to the current element associated with the local-ref.
@ -64,22 +64,25 @@ export function ɵɵcontainer(index: number): void {
* @codeGenApi
*/
export function ɵɵtemplate(
index: number, templateFn: ComponentTemplate<any>| null, consts: number, vars: number,
tagName?: string | null, attrs?: TAttributes | null, localRefs?: string[] | null,
index: number, templateFn: ComponentTemplate<any>| null, decls: number, vars: number,
tagName?: string | null, constsIndex?: number | null, localRefs?: string[] | null,
localRefExtractor?: LocalRefExtractor) {
const lView = getLView();
const tView = lView[TVIEW];
const tViewConsts = tView.consts;
// TODO: consider a separate node type for templates
const tContainerNode = containerInternal(lView, index, tagName || null, attrs || null);
const tContainerNode = containerInternal(
lView, index, tagName || null,
tViewConsts === null || constsIndex == null ? null : tViewConsts[constsIndex]);
if (tView.firstTemplatePass) {
ngDevMode && ngDevMode.firstTemplatePass++;
resolveDirectives(tView, lView, tContainerNode, localRefs || null);
registerPostOrderHooks(tView, tContainerNode);
const embeddedTView = tContainerNode.tViews = createTView(
-1, templateFn, consts, vars, tView.directiveRegistry, tView.pipeRegistry, null,
tView.schemas);
-1, templateFn, decls, vars, tView.directiveRegistry, tView.pipeRegistry, null,
tView.schemas, tViewConsts);
const embeddedTViewNode = createTNode(tView, null, TNodeType.View, -1, null, null) as TViewNode;
embeddedTViewNode.injectorIndex = tContainerNode.injectorIndex;
embeddedTView.node = embeddedTViewNode;

View File

@ -32,8 +32,7 @@ import {registerInitialStylingOnTNode} from './styling';
*
* @param index Index of the element in the LView array
* @param name Name of the DOM Node
* @param attrs Statically bound set of attributes, classes, and styles to be written into the DOM
* element on creation. Use [AttributeMarker] to denote the meaning of this array.
* @param constsIndex Index of the element in the `consts` array.
* @param localRefs A set of local reference bindings on the element.
*
* Attributes and localRefs are passed as an array of strings where elements with an even index
@ -43,24 +42,25 @@ import {registerInitialStylingOnTNode} from './styling';
* @codeGenApi
*/
export function ɵɵelementStart(
index: number, name: string, attrs?: TAttributes | null, localRefs?: string[] | null): void {
index: number, name: string, constsIndex?: number | null, localRefs?: string[] | null): void {
const lView = getLView();
const tView = lView[TVIEW];
const tViewConsts = tView.consts;
const consts = tViewConsts === null || constsIndex == null ? null : tViewConsts[constsIndex];
ngDevMode && assertEqual(
lView[BINDING_INDEX], tView.bindingStartIndex,
'elements should be created before any bindings ');
'elements should be created before any bindings');
ngDevMode && ngDevMode.rendererCreateElement++;
ngDevMode && assertDataInRange(lView, index + HEADER_OFFSET);
const renderer = lView[RENDERER];
const native = lView[index + HEADER_OFFSET] = elementCreate(name, renderer, getNamespace());
const tNode =
getOrCreateTNode(tView, lView[T_HOST], index, TNodeType.Element, name, attrs || null);
const tNode = getOrCreateTNode(tView, lView[T_HOST], index, TNodeType.Element, name, consts);
if (attrs != null) {
const lastAttrIndex = setUpAttributes(renderer, native, attrs);
if (consts != null) {
const lastAttrIndex = setUpAttributes(renderer, native, consts);
if (tView.firstTemplatePass) {
registerInitialStylingOnTNode(tNode, attrs, lastAttrIndex);
registerInitialStylingOnTNode(tNode, consts, lastAttrIndex);
}
}
@ -146,15 +146,14 @@ export function ɵɵelementEnd(): void {
*
* @param index Index of the element in the data array
* @param name Name of the DOM Node
* @param attrs Statically bound set of attributes, classes, and styles to be written into the DOM
* element on creation. Use [AttributeMarker] to denote the meaning of this array.
* @param constsIndex Index of the element in the `consts` array.
* @param localRefs A set of local reference bindings on the element.
*
* @codeGenApi
*/
export function ɵɵelement(
index: number, name: string, attrs?: TAttributes | null, localRefs?: string[] | null): void {
ɵɵelementStart(index, name, attrs, localRefs);
index: number, name: string, constsIndex?: number | null, localRefs?: string[] | null): void {
ɵɵelementStart(index, name, constsIndex, localRefs);
ɵɵelementEnd();
}

View File

@ -26,7 +26,7 @@ import {registerInitialStylingOnTNode} from './styling';
* The instruction must later be followed by `elementContainerEnd()` call.
*
* @param index Index of the element in the LView array
* @param attrs Set of attributes to be used when matching directives.
* @param constsIndex Index of the container in the `consts` array.
* @param localRefs A set of local reference bindings on the element.
*
* Even if this instruction accepts a set of attributes no actual attribute values are propagated to
@ -36,11 +36,13 @@ import {registerInitialStylingOnTNode} from './styling';
* @codeGenApi
*/
export function ɵɵelementContainerStart(
index: number, attrs?: TAttributes | null, localRefs?: string[] | null): void {
index: number, constsIndex?: number | null, localRefs?: string[] | null): void {
const lView = getLView();
const tView = lView[TVIEW];
const renderer = lView[RENDERER];
const tagName = 'ng-container';
const tViewConsts = tView.consts;
const consts = tViewConsts === null || constsIndex == null ? null : tViewConsts[constsIndex];
ngDevMode && assertEqual(
lView[BINDING_INDEX], tView.bindingStartIndex,
'element containers should be created before any bindings');
@ -50,14 +52,13 @@ export function ɵɵelementContainerStart(
const native = lView[index + HEADER_OFFSET] = renderer.createComment(ngDevMode ? tagName : '');
ngDevMode && assertDataInRange(lView, index - 1);
const tNode = getOrCreateTNode(
tView, lView[T_HOST], index, TNodeType.ElementContainer, tagName, attrs || null);
const tNode =
getOrCreateTNode(tView, lView[T_HOST], index, TNodeType.ElementContainer, tagName, consts);
if (attrs && tView.firstTemplatePass) {
if (consts && tView.firstTemplatePass) {
// While ng-container doesn't necessarily support styling, we use the style context to identify
// and execute directives on the ng-container.
registerInitialStylingOnTNode(tNode, attrs as TAttributes, 0);
registerInitialStylingOnTNode(tNode, consts as TAttributes, 0);
}
appendChild(native, tNode, lView);
@ -113,13 +114,13 @@ export function ɵɵelementContainerEnd(): void {
* and {@link elementContainerEnd}
*
* @param index Index of the element in the LView array
* @param attrs Set of attributes to be used when matching directives.
* @param constsIndex Index of the container in the `consts` array.
* @param localRefs A set of local reference bindings on the element.
*
* @codeGenApi
*/
export function ɵɵelementContainer(
index: number, attrs?: TAttributes | null, localRefs?: string[] | null): void {
ɵɵelementContainerStart(index, attrs, localRefs);
index: number, constsIndex?: number | null, localRefs?: string[] | null): void {
ɵɵelementContainerStart(index, constsIndex, localRefs);
ɵɵelementContainerEnd();
}

View File

@ -28,8 +28,7 @@ import {assignTViewNodeToLView, createLView, createTView, refreshView, renderVie
*
* @codeGenApi
*/
export function ɵɵembeddedViewStart(
viewBlockId: number, consts: number, vars: number): RenderFlags {
export function ɵɵembeddedViewStart(viewBlockId: number, decls: number, vars: number): RenderFlags {
const lView = getLView();
const previousOrParentTNode = getPreviousOrParentTNode();
// The previous node can be a view node if we are processing an inline for loop
@ -47,9 +46,8 @@ export function ɵɵembeddedViewStart(
} else {
// When we create a new LView, we always reset the state of the instructions.
viewToRender = createLView(
lView,
getOrCreateEmbeddedTView(viewBlockId, consts, vars, containerTNode as TContainerNode), null,
LViewFlags.CheckAlways, null, null);
lView, getOrCreateEmbeddedTView(viewBlockId, decls, vars, containerTNode as TContainerNode),
null, LViewFlags.CheckAlways, null, null);
const tParentNode = getIsParent() ? previousOrParentTNode :
previousOrParentTNode && previousOrParentTNode.parent;
@ -75,13 +73,13 @@ export function ɵɵembeddedViewStart(
* it with the same index (since it's in the same template).
*
* @param viewIndex The index of the TView in TNode.tViews
* @param consts The number of nodes, local refs, and pipes in this template
* @param decls The number of nodes, local refs, and pipes in this template
* @param vars The number of bindings and pure function bindings in this template
* @param container The parent container in which to look for the view's static data
* @returns TView
*/
function getOrCreateEmbeddedTView(
viewIndex: number, consts: number, vars: number, parent: TContainerNode): TView {
viewIndex: number, decls: number, vars: number, parent: TContainerNode): TView {
const tView = getLView()[TVIEW];
ngDevMode && assertNodeType(parent, TNodeType.Container);
const containerTViews = parent.tViews as TView[];
@ -89,7 +87,8 @@ function getOrCreateEmbeddedTView(
ngDevMode && assertEqual(Array.isArray(containerTViews), true, 'TViews should be in an array');
if (viewIndex >= containerTViews.length || containerTViews[viewIndex] == null) {
containerTViews[viewIndex] = createTView(
viewIndex, null, consts, vars, tView.directiveRegistry, tView.pipeRegistry, null, null);
viewIndex, null, decls, vars, tView.directiveRegistry, tView.pipeRegistry, null, null,
tView.consts);
}
return containerTViews[viewIndex];
}

View File

@ -14,7 +14,7 @@ import {initNgDevMode} from '../../util/ng_dev_mode';
import {ACTIVE_INDEX, CONTAINER_HEADER_OFFSET, LContainer, MOVED_VIEWS, NATIVE} from '../interfaces/container';
import {DirectiveDefList, PipeDefList, ViewQueriesFunction} from '../interfaces/definition';
import {COMMENT_MARKER, ELEMENT_MARKER, I18nMutateOpCode, I18nMutateOpCodes, I18nUpdateOpCode, I18nUpdateOpCodes, TIcu} from '../interfaces/i18n';
import {PropertyAliases, TContainerNode, TElementNode, TNode as ITNode, TNode, TNodeFlags, TNodeProviderIndexes, TNodeType, TViewNode} from '../interfaces/node';
import {PropertyAliases, TAttributes, TContainerNode, TElementNode, TNode as ITNode, TNode, TNodeFlags, TNodeProviderIndexes, TNodeType, TViewNode} from '../interfaces/node';
import {SelectorFlags} from '../interfaces/projection';
import {TQueries} from '../interfaces/query';
import {RComment, RElement, RNode} from '../interfaces/renderer';
@ -102,6 +102,7 @@ export const TViewConstructor = class TView implements ITView {
public pipeRegistry: PipeDefList|null, //
public firstChild: TNode|null, //
public schemas: SchemaMetadata[]|null, //
public consts: TAttributes[]|null, //
) {}
get template_(): string {

View File

@ -569,8 +569,8 @@ export function saveResolvedLocalsInData(
*/
export function getOrCreateTView(def: ComponentDef<any>): TView {
return def.tView || (def.tView = createTView(
-1, def.template, def.consts, def.vars, def.directiveDefs, def.pipeDefs,
def.viewQuery, def.schemas));
-1, def.template, def.decls, def.vars, def.directiveDefs, def.pipeDefs,
def.viewQuery, def.schemas, def.consts));
}
@ -579,18 +579,20 @@ export function getOrCreateTView(def: ComponentDef<any>): TView {
*
* @param viewIndex The viewBlockId for inline views, or -1 if it's a component/dynamic
* @param templateFn Template function
* @param consts The number of nodes, local refs, and pipes in this template
* @param decls The number of nodes, local refs, and pipes in this template
* @param directives Registry of directives for this view
* @param pipes Registry of pipes for this view
* @param viewQuery View queries for this view
* @param schemas Schemas for this view
* @param consts Constants for this view
*/
export function createTView(
viewIndex: number, templateFn: ComponentTemplate<any>| null, consts: number, vars: number,
viewIndex: number, templateFn: ComponentTemplate<any>| null, decls: number, vars: number,
directives: DirectiveDefListOrFactory | null, pipes: PipeDefListOrFactory | null,
viewQuery: ViewQueriesFunction<any>| null, schemas: SchemaMetadata[] | null): TView {
viewQuery: ViewQueriesFunction<any>| null, schemas: SchemaMetadata[] | null,
consts: TAttributes[] | null): TView {
ngDevMode && ngDevMode.tView++;
const bindingStartIndex = HEADER_OFFSET + consts;
const bindingStartIndex = HEADER_OFFSET + decls;
// This length does not yet contain host bindings from child directives because at this point,
// we don't know which directives are active on this template. As soon as a directive is matched
// that has a host binding, we will update the blueprint with that def's hostVars count.
@ -627,7 +629,7 @@ export function createTView(
typeof pipes === 'function' ? pipes() : pipes, // pipeRegistry: PipeDefList|null,
null, // firstChild: TNode|null,
schemas, // schemas: SchemaMetadata[]|null,
) :
consts) : // consts: TAttributes[]
{
id: viewIndex,
blueprint: blueprint,
@ -656,6 +658,7 @@ export function createTView(
pipeRegistry: typeof pipes === 'function' ? pipes() : pipes,
firstChild: null,
schemas: schemas,
consts: consts,
};
}

View File

@ -9,6 +9,8 @@
import {SchemaMetadata, ViewEncapsulation} from '../../core';
import {ProcessProvidersFunction} from '../../di/interface/provider';
import {Type} from '../../interface/type';
import {TAttributes} from './node';
import {CssSelectorList} from './projection';
import {TView} from './view';
@ -241,6 +243,9 @@ export interface ComponentDef<T> extends DirectiveDef<T> {
*/
readonly template: ComponentTemplate<T>;
/** Constants associated with the component's view. */
readonly consts: TAttributes[]|null;
/**
* An array of `ngContent[selector]` values that were found in the template.
*/
@ -258,7 +263,7 @@ export interface ComponentDef<T> extends DirectiveDef<T> {
* can pre-fill the array and set the binding start index.
*/
// TODO(kara): remove queries from this count
readonly consts: number;
readonly decls: number;
/**
* The number of bindings in this component template (including pure fn bindings).

View File

@ -15,7 +15,7 @@ import {Sanitizer} from '../../sanitization/sanitizer';
import {LContainer} from './container';
import {ComponentDef, ComponentTemplate, DirectiveDef, DirectiveDefList, HostBindingsFunction, PipeDef, PipeDefList, ViewQueriesFunction} from './definition';
import {I18nUpdateOpCodes, TI18n} from './i18n';
import {TElementNode, TNode, TViewNode} from './node';
import {TAttributes, TElementNode, TNode, TViewNode} from './node';
import {PlayerHandler} from './player';
import {LQueries, TQueries} from './query';
import {RElement, Renderer3, RendererFactory3} from './renderer';
@ -387,7 +387,7 @@ export interface TView {
/**
* The index where the "expando" section of `LView` begins. The expando
* section contains injectors, directive instances, and host binding values.
* Unlike the "consts" and "vars" sections of `LView`, the length of this
* Unlike the "decls" and "vars" sections of `LView`, the length of this
* section cannot be calculated at compile-time because directives are matched
* at runtime to preserve locality.
*
@ -561,6 +561,12 @@ export interface TView {
* Set of schemas that declare elements to be allowed inside the view.
*/
schemas: SchemaMetadata[]|null;
/**
* Array of attributes for all of the elements in the view. Used
* for directive matching and attribute bindings.
*/
consts: TAttributes[]|null;
}
export const enum RootContextFlags {Empty = 0b00, DetectChanges = 0b01, FlushPlayers = 0b10}

View File

@ -14,7 +14,7 @@ import {isCreationMode} from './util/view_utils';
/**
* Bindings for pure functions are stored after regular bindings.
*
* |------consts------|---------vars---------| |----- hostVars (dir1) ------|
* |-------decls------|---------vars---------| |----- hostVars (dir1) ------|
* ------------------------------------------------------------------------------------------
* | nodes/refs/pipes | bindings | fn slots | injector | dir1 | host bindings | host slots |
* ------------------------------------------------------------------------------------------

View File

@ -320,66 +320,6 @@
{
"name": "_c1"
},
{
"name": "_c10"
},
{
"name": "_c11"
},
{
"name": "_c12"
},
{
"name": "_c13"
},
{
"name": "_c14"
},
{
"name": "_c15"
},
{
"name": "_c16"
},
{
"name": "_c17"
},
{
"name": "_c18"
},
{
"name": "_c19"
},
{
"name": "_c2"
},
{
"name": "_c20"
},
{
"name": "_c21"
},
{
"name": "_c3"
},
{
"name": "_c4"
},
{
"name": "_c5"
},
{
"name": "_c6"
},
{
"name": "_c7"
},
{
"name": "_c8"
},
{
"name": "_c9"
},
{
"name": "_currentInjector"
},

View File

@ -37,7 +37,7 @@ describe('iv perf test', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [['div']],
consts: 1,
decls: 1,
vars: 0,
template: function Template(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {

View File

@ -29,7 +29,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
consts: 2,
decls: 2,
vars: 1,
template: (rf: RenderFlags, ctx: MyComponent) => {
if (rf & RenderFlags.Create) {
@ -105,7 +105,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
consts: 2,
decls: 2,
vars: 2,
/**
* {{ doCheckCount }} - {{ name }}
@ -143,7 +143,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ManualComponent,
selectors: [['manual-comp']],
consts: 2,
decls: 2,
vars: 2,
/**
* {{ doCheckCount }} - {{ name }}
@ -179,7 +179,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ManualApp,
selectors: [['manual-app']],
consts: 1,
decls: 1,
vars: 1,
/** <manual-comp [name]="name"></manual-comp> */
template: (rf: RenderFlags, ctx: ManualApp) => {
@ -234,7 +234,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ButtonParent,
selectors: [['button-parent']],
consts: 2,
decls: 2,
vars: 1,
/** {{ doCheckCount }} - <manual-comp></manual-comp> */
template: (rf: RenderFlags, ctx: ButtonParent) => {
@ -311,7 +311,7 @@ describe('change detection', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
consts: 1,
decls: 1,
vars: 1,
template: (rf: RenderFlags, ctx: MyComponent) => {
if (rf & RenderFlags.Create) {

View File

@ -24,7 +24,7 @@ describe('ComponentFactory', () => {
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
selectors: [['test', 'foo'], ['bar']],
consts: 0,
decls: 0,
vars: 0,
template: () => undefined,
});
@ -46,7 +46,7 @@ describe('ComponentFactory', () => {
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test', 'foo'], ['bar']],
consts: 0,
decls: 0,
vars: 0,
template: () => undefined,
ngContentSelectors: ['*', 'a', 'b'],
@ -94,7 +94,7 @@ describe('ComponentFactory', () => {
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test']],
consts: 0,
decls: 0,
vars: 0,
template: () => undefined,
});

View File

@ -26,7 +26,7 @@ describe('component', () => {
type: CounterComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['counter']],
consts: 1,
decls: 1,
vars: 1,
template: function(rf: RenderFlags, ctx: CounterComponent) {
if (rf & RenderFlags.Create) {
@ -76,7 +76,7 @@ describe('component', () => {
type: MyComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['my-component']],
consts: 1,
decls: 1,
vars: 1,
template: function(fs: RenderFlags, ctx: MyComponent) {
if (fs & RenderFlags.Create) {
@ -119,7 +119,7 @@ describe('component', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 1,
decls: 1,
vars: 1,
template: (rf: RenderFlags, ctx: Comp) => {
if (rf & RenderFlags.Create) {
@ -178,9 +178,10 @@ it('should not invoke renderer destroy method for embedded views', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 3,
decls: 3,
vars: 1,
directives: [NgIf],
consts: [[AttributeMarker.Template, 'ngIf']],
/**
* <div>Root view</div>
* <div *ngIf="visible">Child view</div>
@ -190,8 +191,7 @@ it('should not invoke renderer destroy method for embedded views', () => {
ɵɵelementStart(0, 'div');
ɵɵtext(1, 'Root view');
ɵɵelementEnd();
ɵɵtemplate(
2, MyComponent_div_Template_2, 2, 0, 'div', [AttributeMarker.Template, 'ngIf']);
ɵɵtemplate(2, MyComponent_div_Template_2, 2, 0, 'div', 0);
}
if (rf & RenderFlags.Update) {
ɵɵadvance(2);
@ -252,7 +252,7 @@ describe('component with a container', () => {
type: WrapperComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['wrapper']],
consts: 1,
decls: 1,
vars: 0,
template: function ChildComponentTemplate(rf: RenderFlags, ctx: {items: string[]}) {
if (rf & RenderFlags.Create) {
@ -329,7 +329,7 @@ describe('recursive components', () => {
type: TreeComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['tree-comp']],
consts: 3,
decls: 3,
vars: 1,
template: (rf: RenderFlags, ctx: TreeComponent) => {
if (rf & RenderFlags.Create) {
@ -395,18 +395,14 @@ describe('recursive components', () => {
type: NgIfTree,
encapsulation: ViewEncapsulation.None,
selectors: [['ng-if-tree']],
consts: 3,
decls: 3,
vars: 3,
consts: [[AttributeMarker.Bindings, 'data', AttributeMarker.Template, 'ngIf']],
template: (rf: RenderFlags, ctx: NgIfTree) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0);
ɵɵtemplate(
1, IfTemplate, 1, 1, 'ng-if-tree',
[AttributeMarker.Bindings, 'data', AttributeMarker.Template, 'ngIf']);
ɵɵtemplate(
2, IfTemplate2, 1, 1, 'ng-if-tree',
[AttributeMarker.Bindings, 'data', AttributeMarker.Template, 'ngIf']);
ɵɵtemplate(1, IfTemplate, 1, 1, 'ng-if-tree', 0);
ɵɵtemplate(2, IfTemplate2, 1, 1, 'ng-if-tree', 0);
}
if (rf & RenderFlags.Update) {
ɵɵtextInterpolate(ctx.data.value);
@ -415,7 +411,6 @@ describe('recursive components', () => {
ɵɵadvance(1);
ɵɵproperty('ngIf', ctx.data.right);
}
},
inputs: {data: 'data'},
});
@ -543,7 +538,7 @@ describe('recursive components', () => {
encapsulation: ViewEncapsulation.None,
selectors: [['test-inputs']],
inputs: {minifiedName: 'unminifiedName'},
consts: 0,
decls: 0,
vars: 0,
template: function(rf: RenderFlags, ctx: TestInputsComponent): void {
// Template not needed for this test

View File

@ -702,7 +702,7 @@ describe('JS control flow', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 0,
decls: 0,
vars: 0,
template: function(rf: RenderFlags, ctx: Comp) {}
});
@ -716,7 +716,7 @@ describe('JS control flow', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 3,
decls: 3,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -772,7 +772,7 @@ describe('JS control flow', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 0,
decls: 0,
vars: 0,
template: function(rf: RenderFlags, ctx: Comp) {}
});
@ -786,7 +786,7 @@ describe('JS control flow', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 3,
decls: 3,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {

View File

@ -66,9 +66,9 @@ describe('di', () => {
/** <div dirA></div> */
const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['dirA', '']);
ɵɵelement(0, 'div', 0);
}
}, 1, 0, [DirA, DirB]);
}, 1, 0, [DirA, DirB], [], undefined, [], [], undefined, [['dirA', '']]);
expect(() => { new ComponentFixture(App); }).not.toThrow();
expect(dirA !.dirB).toEqual(null);
@ -92,13 +92,17 @@ describe('di', () => {
* <div dirA dirC></div>
* </div>
*/
const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['dirB', '']);
ɵɵelement(1, 'div', ['dirA', '', 'dirC', '']);
ɵɵelementEnd();
}
}, 2, 0, [DirA, DirB, DirC]);
const App = createComponent(
'app',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', 0);
ɵɵelement(1, 'div', 1);
ɵɵelementEnd();
}
},
2, 0, [DirA, DirB, DirC], [], undefined, [], [], undefined,
[['dirB', ''], ['dirA', '', 'dirC', '']]);
expect(() => {
(DirA as any)['__NG_ELEMENT_ID__'] = 1;
@ -117,7 +121,7 @@ describe('di', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['my-comp']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: MyComp) {
if (rf & RenderFlags.Create) {
@ -219,8 +223,8 @@ describe('di', () => {
describe('getOrCreateNodeInjector', () => {
it('should handle initial undefined state', () => {
const contentView = createLView(
null, createTView(-1, null, 1, 0, null, null, null, null), null, LViewFlags.CheckAlways,
null, null, {} as any, {} as any);
null, createTView(-1, null, 1, 0, null, null, null, null, null), null,
LViewFlags.CheckAlways, null, null, {} as any, {} as any);
const oldView = selectView(contentView, null);
try {
const parentTNode =

View File

@ -22,16 +22,7 @@ import {ComponentFixture, TemplateFixture} from './render_util';
describe('instructions', () => {
function createAnchor() { ɵɵelement(0, 'a'); }
function createDiv(initialClasses?: string[] | null, initialStyles?: string[] | null) {
const attrs: any[] = [];
if (initialClasses) {
attrs.push(AttributeMarker.Classes, ...initialClasses);
}
if (initialStyles) {
attrs.push(AttributeMarker.Styles, ...initialStyles);
}
ɵɵelement(0, 'div', attrs);
}
function createDiv() { ɵɵelement(0, 'div', 0); }
function createScript() { ɵɵelement(0, 'script'); }
@ -85,8 +76,8 @@ describe('instructions', () => {
describe('element', () => {
it('should create an element with the correct perf counters', () => {
const t = new TemplateFixture(() => {
ɵɵelement(0, 'div', ['id', 'test', 'title', 'Hello']);
}, () => {}, 1);
ɵɵelement(0, 'div', 0);
}, () => {}, 1, 0, null, null, null, undefined, [['id', 'test', 'title', 'Hello']]);
const div = (t.hostElement as HTMLElement).querySelector('div') !;
expect(div.id).toEqual('test');
@ -164,12 +155,13 @@ describe('instructions', () => {
});
describe('styleMap', () => {
function createDivWithStyle() {
ɵɵelement(0, 'div', [AttributeMarker.Styles, 'height', '10px']);
}
const attrs = [[AttributeMarker.Styles, 'height', '10px']];
function createDivWithStyle() { ɵɵelement(0, 'div', 0); }
it('should add style', () => {
const fixture = new TemplateFixture(createDivWithStyle, () => {}, 1);
const fixture = new TemplateFixture(
createDivWithStyle, () => {}, 1, 0, null, null, null, undefined, attrs);
fixture.update(() => { ɵɵstyleMap({'background-color': 'red'}); });
expect(fixture.html).toEqual('<div style="background-color: red; height: 10px;"></div>');
});
@ -213,13 +205,10 @@ describe('instructions', () => {
describe('performance counters', () => {
it('should create tViews only once for each nested level', () => {
const _c0 = [AttributeMarker.Template, 'ngFor', 'ngForOf'];
const _c1 = [AttributeMarker.Template, 'ngFor', 'ngForOf'];
function ToDoAppComponent_NgForOf_Template_0(rf: RenderFlags, ctx0: NgForOfContext<any>) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'ul');
ɵɵtemplate(1, ToDoAppComponent_NgForOf_NgForOf_Template_1, 2, 1, 'li', _c1);
ɵɵtemplate(1, ToDoAppComponent_NgForOf_NgForOf_Template_1, 2, 1, 'li', 0);
ɵɵelementEnd();
}
if (rf & RenderFlags.Update) {
@ -255,11 +244,12 @@ describe('instructions', () => {
static ngComponentDef = ɵɵdefineComponent({
type: NestedLoops,
selectors: [['nested-loops']],
consts: 1,
decls: 1,
vars: 1,
consts: [[AttributeMarker.Template, 'ngFor', 'ngForOf']],
template: function ToDoAppComponent_Template(rf: RenderFlags, ctx: NestedLoops) {
if (rf & RenderFlags.Create) {
ɵɵtemplate(0, ToDoAppComponent_NgForOf_Template_0, 2, 1, 'ul', _c0);
ɵɵtemplate(0, ToDoAppComponent_NgForOf_Template_0, 2, 1, 'ul', 0);
}
if (rf & RenderFlags.Update) {
ɵɵproperty('ngForOf', ctx.rows);
@ -498,6 +488,6 @@ function stripStyleWsCharacters(value: string): string {
}
function createTemplateFixtureWithSanitizer(
buildFn: () => any, consts: number, sanitizer: Sanitizer) {
return new TemplateFixture(buildFn, () => {}, consts, 0, null, null, sanitizer);
buildFn: () => any, decls: number, sanitizer: Sanitizer) {
return new TemplateFixture(buildFn, () => {}, decls, 0, null, null, sanitizer);
}

View File

@ -121,7 +121,7 @@ describe('render3 integration test', () => {
static ngComponentDef = ɵɵdefineComponent({
selectors: [['child']],
type: ChildComponent,
consts: 3,
decls: 3,
vars: 0,
template: function ChildComponentTemplate(
rf: RenderFlags, ctx: {beforeTree: Tree, afterTree: Tree}) {
@ -203,7 +203,7 @@ describe('component styles', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StyledComp,
styles: ['div { color: red; }'],
consts: 1,
decls: 1,
vars: 0,
encapsulation: 100,
selectors: [['foo']],
@ -230,7 +230,7 @@ describe('component animations', () => {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 0,
decls: 0,
vars: 0,
data: {
animation: [
@ -257,7 +257,7 @@ describe('component animations', () => {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 0,
decls: 0,
vars: 0,
data: {
animation: [],
@ -277,12 +277,13 @@ describe('component animations', () => {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 1,
decls: 1,
vars: 1,
selectors: [['foo']],
consts: [[AttributeMarker.Bindings, '@fooAnimation']],
template: (rf: RenderFlags, ctx: AnimComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', [AttributeMarker.Bindings, '@fooAnimation']);
ɵɵelement(0, 'div', 0);
}
if (rf & RenderFlags.Update) {
ɵɵattribute('@fooAnimation', ctx.animationValue);
@ -313,12 +314,13 @@ describe('component animations', () => {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 1,
decls: 1,
vars: 1,
selectors: [['foo']],
consts: [['@fooAnimation', '']],
template: (rf: RenderFlags, ctx: AnimComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['@fooAnimation', '']);
ɵɵelement(0, 'div', 0);
}
}
});
@ -361,7 +363,7 @@ describe('component animations', () => {
// static ngFactoryDef = () => new ParentComp();
// static ngComponentDef = ɵɵdefineComponent({
// type: ParentComp,
// consts: 1,
// decls: 1,
// vars: 1,
// selectors: [['foo']],
// template: (rf: RenderFlags, ctx: ParentComp) => {
@ -392,7 +394,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -424,7 +426,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
consts: 3,
decls: 3,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
if (rf & RenderFlags.Create) {
@ -442,7 +444,7 @@ describe('element discovery', () => {
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
if (rf & RenderFlags.Create) {
@ -475,8 +477,9 @@ describe('element discovery', () => {
type: StructuredComp,
selectors: [['structured-comp']],
directives: [NgIf],
consts: 2,
decls: 2,
vars: 1,
consts: [['ngIf', '']],
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'section');
@ -487,7 +490,7 @@ describe('element discovery', () => {
ɵɵelementEnd();
ɵɵelement(2, 'div');
}
}, 3, 0, 'ng-template', ['ngIf', '']);
}, 3, 0, 'ng-template', 0);
ɵɵelementEnd();
}
if (rf & RenderFlags.Update) {
@ -524,7 +527,7 @@ describe('element discovery', () => {
type: StructuredComp,
selectors: [['structured-comp']],
directives: [NgIf],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -561,7 +564,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -593,7 +596,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -626,7 +629,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -674,7 +677,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ProjectorComp,
selectors: [['projector-comp']],
consts: 4,
decls: 4,
vars: 0,
template: (rf: RenderFlags, ctx: ProjectorComp) => {
if (rf & RenderFlags.Create) {
@ -698,7 +701,7 @@ describe('element discovery', () => {
type: ParentComp,
selectors: [['parent-comp']],
directives: [ProjectorComp],
consts: 5,
decls: 5,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
if (rf & RenderFlags.Create) {
@ -771,7 +774,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
@ -798,7 +801,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
consts: 0,
decls: 0,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {}
});
@ -856,12 +859,13 @@ describe('element discovery', () => {
type: StructuredComp,
selectors: [['structured-comp']],
directives: [MyDir1, MyDir2, MyDir3],
consts: 2,
decls: 2,
vars: 0,
consts: [['my-dir-1', '', 'my-dir-2', ''], ['my-dir-3']],
template: (rf: RenderFlags, ctx: StructuredComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['my-dir-1', '', 'my-dir-2', '']);
ɵɵelement(1, 'div', ['my-dir-3']);
ɵɵelement(0, 'div', 0);
ɵɵelement(1, 'div', 1);
}
}
});
@ -932,7 +936,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
if (rf & RenderFlags.Create) {
@ -948,11 +952,12 @@ describe('element discovery', () => {
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp, MyDir1, MyDir2],
consts: 1,
decls: 1,
vars: 0,
consts: [['my-dir-1', '', 'my-dir-2', '']],
template: (rf: RenderFlags, ctx: ParentComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'child-comp', ['my-dir-1', '', 'my-dir-2', '']);
ɵɵelement(0, 'child-comp', 0);
}
}
});
@ -1009,7 +1014,7 @@ describe('element discovery', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
consts: 3,
decls: 3,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
if (rf & RenderFlags.Create) {
@ -1027,7 +1032,7 @@ describe('element discovery', () => {
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
if (rf & RenderFlags.Create) {
@ -1070,7 +1075,7 @@ describe('sanitization', () => {
static ngComponentDef = ɵɵdefineComponent({
type: SanitizationComp,
selectors: [['sanitize-this']],
consts: 1,
decls: 1,
vars: 1,
template: (rf: RenderFlags, ctx: SanitizationComp) => {
if (rf & RenderFlags.Create) {
@ -1128,11 +1133,12 @@ describe('sanitization', () => {
static ngComponentDef = ɵɵdefineComponent({
type: SimpleComp,
selectors: [['sanitize-this']],
consts: 1,
decls: 1,
vars: 0,
consts: [['unsafeUrlHostBindingDir', '']],
template: (rf: RenderFlags, ctx: SimpleComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'blockquote', ['unsafeUrlHostBindingDir', '']);
ɵɵelement(0, 'blockquote', 0);
}
},
directives: [UnsafeUrlHostBindingDir]

View File

@ -46,7 +46,7 @@ describe('lifecycles', () => {
}, 1);
function createOnInitComponent(
name: string, template: ComponentTemplate<any>, consts: number, vars: number = 0,
name: string, template: ComponentTemplate<any>, decls: number, vars: number = 0,
directives: any[] = []) {
return class Component {
val: string = '';
@ -59,7 +59,7 @@ describe('lifecycles', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [[name]],
consts: consts,
decls: decls,
vars: vars,
inputs: {val: 'val'}, template,
directives: directives

View File

@ -37,7 +37,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
consts: 2,
decls: 2,
vars: 0,
/** <button (click)="onClick()"> Click me </button> */
template: function CompTemplate(rf: RenderFlags, ctx: any) {
@ -70,7 +70,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyCompWithGlobalListeners,
selectors: [['comp']],
consts: 1,
decls: 1,
vars: 0,
template: function CompTemplate(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -138,7 +138,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: PreventDefaultComp,
selectors: [['prevent-default-comp']],
consts: 2,
decls: 2,
vars: 0,
/** <button (click)="onClick($event)">Click</button> */
template: (rf: RenderFlags, ctx: PreventDefaultComp) => {
@ -329,7 +329,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -390,7 +390,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -454,7 +454,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -533,7 +533,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
consts: 1,
decls: 1,
vars: 0,
template: function CompTemplate(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
@ -594,10 +594,10 @@ describe('event listeners', () => {
}
const fixture = new TemplateFixture(() => {
ɵɵelementStart(0, 'button', ['hostListenerDir', '']);
ɵɵelementStart(0, 'button', 0);
ɵɵtext(1, 'Click');
ɵɵelementEnd();
}, () => {}, 2, 0, [HostListenerDir]);
}, () => {}, 2, 0, [HostListenerDir], null, null, undefined, [['hostListenerDir', '']]);
const button = fixture.hostElement.querySelector('button') !;
@ -610,8 +610,8 @@ describe('event listeners', () => {
it('should support global host listeners on directives', () => {
const fixture = new TemplateFixture(() => {
ɵɵelement(0, 'div', ['hostListenerDir', '']);
}, () => {}, 1, 0, [GlobalHostListenerDir]);
ɵɵelement(0, 'div', 0);
}, () => {}, 1, 0, [GlobalHostListenerDir], null, null, undefined, [['hostListenerDir', '']]);
const doc = fixture.hostElement.ownerDocument !;
@ -636,7 +636,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
consts: 2,
decls: 2,
vars: 0,
/** <button (click)="onClick(data.a, data.b)"> Click me </button> */
template: function CompTemplate(rf: RenderFlags, ctx: any) {
@ -917,7 +917,7 @@ describe('event listeners', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 3,
decls: 3,
vars: 0,
template: (rf: RenderFlags, ctx: App) => {
if (rf & RenderFlags.Create) {

View File

@ -26,7 +26,7 @@ describe('outputs', () => {
type: ButtonToggle,
selectors: [['button-toggle']],
template: function(rf: RenderFlags, ctx: any) {},
consts: 0,
decls: 0,
vars: 0,
outputs: {change: 'change', resetStream: 'reset'}
});
@ -80,7 +80,7 @@ describe('outputs', () => {
ɵɵembeddedViewEnd();
} else {
if (ɵɵembeddedViewStart(1, 1, 0)) {
ɵɵelementStart(0, 'div', ['otherDir', '']);
ɵɵelementStart(0, 'div', 0);
{
ɵɵlistener('change', function() { return ctx.onChange(); });
}
@ -95,13 +95,14 @@ describe('outputs', () => {
let counter = 0;
const ctx = {condition: true, onChange: () => counter++, onClick: () => {}};
renderToHtml(Template, ctx, 3, 0, deps);
const attrs = [['otherDir', '']];
renderToHtml(Template, ctx, 3, 0, deps, null, null, false, attrs);
buttonToggle !.change.next();
expect(counter).toEqual(1);
ctx.condition = false;
renderToHtml(Template, ctx, 3, 0, deps);
renderToHtml(Template, ctx, 3, 0, deps, null, null, false, attrs);
expect(counter).toEqual(1);
otherDir !.changeStream.next();

View File

@ -68,7 +68,7 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(-1, testTemplate, 21, 0, null, null, null, null);
const embeddedTView = createTView(-1, testTemplate, 21, 0, null, null, null, null, null);
// initialize global state
resetComponentState();
@ -89,4 +89,4 @@ while (createTime()) {
console.profileEnd();
// report results
elementTextCreate.report();
elementTextCreate.report();

View File

@ -28,47 +28,46 @@ import {createAndRenderLView} from '../setup';
<button (click)="clickListener()" (input)="inputListener()"></button>
</div>
`;
const _c0 = [3, 'click', 'input'];
function testTemplate(rf: RenderFlags, ctx: any) {
if (rf & 1) {
ɵɵelementStart(0, 'div');
ɵɵelementStart(1, 'button', _c0);
ɵɵelementStart(1, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(2, 'button', _c0);
ɵɵelementStart(2, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(3, 'button', _c0);
ɵɵelementStart(3, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(4, 'button', _c0);
ɵɵelementStart(4, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(5, 'button', _c0);
ɵɵelementStart(5, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(6, 'button', _c0);
ɵɵelementStart(6, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(7, 'button', _c0);
ɵɵelementStart(7, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(8, 'button', _c0);
ɵɵelementStart(8, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(9, 'button', _c0);
ɵɵelementStart(9, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
ɵɵelementStart(10, 'button', _c0);
ɵɵelementStart(10, 'button', 0);
ɵɵlistener('click', function clickListener() {});
ɵɵlistener('input', function inputListener() {});
ɵɵelementEnd();
@ -77,7 +76,8 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
const viewTNode = createTNode(null !, null, TNodeType.View, -1, null, null) as TViewNode;
const embeddedTView = createTView(-1, testTemplate, 11, 0, null, null, null, null);
const embeddedTView =
createTView(-1, testTemplate, 11, 0, null, null, null, null, [[3, 'click', 'input']]);
// initialize global state
resetComponentState();
@ -96,4 +96,4 @@ while (createTime()) {
console.profileEnd();
// report results
listenersCreate.report();
listenersCreate.report();

View File

@ -7,7 +7,7 @@
*/
import {addToViewTree, createLContainer, createLView, createTNode, createTView, getOrCreateTNode, renderView} from '../../../src/render3/instructions/shared';
import {ComponentTemplate} from '../../../src/render3/interfaces/definition';
import {TNodeType, TViewNode} from '../../../src/render3/interfaces/node';
import {TAttributes, TNodeType, TViewNode} from '../../../src/render3/interfaces/node';
import {RComment} from '../../../src/render3/interfaces/renderer';
import {LView, LViewFlags, TView} from '../../../src/render3/interfaces/view';
import {insertView} from '../../../src/render3/node_manipulation';
@ -23,10 +23,10 @@ export function createAndRenderLView(
}
export function setupRootViewWithEmbeddedViews(
templateFn: ComponentTemplate<any>| null, consts: number, vars: number, noOfViews: number,
embeddedViewContext: any = {}): LView {
templateFn: ComponentTemplate<any>| null, decls: number, vars: number, noOfViews: number,
embeddedViewContext: any = {}, consts: TAttributes[] | null = null): LView {
// Create a root view with a container
const rootTView = createTView(-1, null, 1, 0, null, null, null, null);
const rootTView = createTView(-1, null, 1, 0, null, null, null, null, consts);
const tContainerNode = getOrCreateTNode(rootTView, null, 0, TNodeType.Container, null, null);
const rootLView = createLView(
null, rootTView, {}, LViewFlags.CheckAlways | LViewFlags.IsRoot, null, null,
@ -38,7 +38,7 @@ export function setupRootViewWithEmbeddedViews(
// create test embedded views
const embeddedTView = createTView(-1, templateFn, consts, vars, null, null, null, null);
const embeddedTView = createTView(-1, templateFn, decls, vars, null, null, null, null, null);
const viewTNode = createTNode(rootTView, null, TNodeType.View, -1, null, null) as TViewNode;
// create embedded views and add them to the container
@ -54,4 +54,4 @@ export function setupRootViewWithEmbeddedViews(
renderView(rootLView, rootTView, null);
return rootLView;
}
}

View File

@ -31,18 +31,17 @@ import {setupRootViewWithEmbeddedViews} from '../setup';
</ng-template>`;
function testTemplate(rf: RenderFlags, ctx: any) {
if (rf & 1) {
ɵɵelementStart(0, 'div', [AttributeMarker.Classes, 'list']);
ɵɵelement(1, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(2, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(3, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(4, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(5, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(6, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(7, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(8, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(9, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelement(
10, 'div', [AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']);
ɵɵelementStart(0, 'div', 0);
ɵɵelement(1, 'div', 1);
ɵɵelement(2, 'div', 1);
ɵɵelement(3, 'div', 1);
ɵɵelement(4, 'div', 1);
ɵɵelement(5, 'div', 1);
ɵɵelement(6, 'div', 1);
ɵɵelement(7, 'div', 1);
ɵɵelement(8, 'div', 1);
ɵɵelement(9, 'div', 1);
ɵɵelement(10, 'div', 1);
ɵɵelementEnd();
}
if (rf & 2) {
@ -80,7 +79,10 @@ function testTemplate(rf: RenderFlags, ctx: any) {
}
const rootLView = setupRootViewWithEmbeddedViews(testTemplate, 11, 10, 1000);
const rootLView = setupRootViewWithEmbeddedViews(testTemplate, 11, 10, 1000, undefined, [
[AttributeMarker.Classes, 'list'],
[AttributeMarker.Classes, 'item', AttributeMarker.Styles, 'width', '50px']
]);
const rootTView = rootLView[TVIEW];
// scenario to benchmark

View File

@ -873,7 +873,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Repeated,
selectors: [['repeated']],
consts: 2,
decls: 2,
vars: 2,
template: function(fs: RenderFlags, ctx: Repeated) {
if (fs & RenderFlags.Create) {
@ -904,7 +904,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ComponentWithProviders,
selectors: [['component-with-providers']],
consts: 2,
decls: 2,
vars: 0,
template: function(fs: RenderFlags, ctx: ComponentWithProviders) {
if (fs & RenderFlags.Create) {
@ -959,7 +959,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Repeated,
selectors: [['repeated']],
consts: 2,
decls: 2,
vars: 2,
template: function(fs: RenderFlags, ctx: Repeated) {
if (fs & RenderFlags.Create) {
@ -993,7 +993,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ComponentWithProviders,
selectors: [['component-with-providers']],
consts: 2,
decls: 2,
vars: 0,
template: function(fs: RenderFlags, ctx: ComponentWithProviders) {
if (fs & RenderFlags.Create) {
@ -1042,7 +1042,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: EmbeddedComponent,
selectors: [['embedded-cmp']],
consts: 1,
decls: 1,
vars: 1,
template: (rf: RenderFlags, cmp: EmbeddedComponent) => {
if (rf & RenderFlags.Create) {
@ -1065,7 +1065,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: HostComponent,
selectors: [['host-cmp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, cmp: HostComponent) => {
if (rf & RenderFlags.Create) {
@ -1089,7 +1089,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComponent,
selectors: [['app-cmp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, cmp: AppComponent) => {
if (rf & RenderFlags.Create) {
@ -1251,7 +1251,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-cmp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, cmp: MyComponent) => {
if (rf & RenderFlags.Create) {
@ -1278,7 +1278,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComponent,
selectors: [['app-cmp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, cmp: AppComponent) => {
if (rf & RenderFlags.Create) {
@ -1343,7 +1343,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: RenderFlags, ctx: MyComponent) => {
if (rf & RenderFlags.Create) {
@ -1370,7 +1370,7 @@ describe('providers', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app-cmp']],
consts: 2,
decls: 2,
vars: 0,
template: (rf: RenderFlags, ctx: App) => {
if (rf & RenderFlags.Create) {
@ -1445,7 +1445,7 @@ function expectProvidersScenario(defs: {
static ngComponentDef = ɵɵdefineComponent({
type: ViewChildComponent,
selectors: [['view-child']],
consts: 1,
decls: 1,
vars: 0,
template: function(fs: RenderFlags, ctx: ViewChildComponent) {
if (fs & RenderFlags.Create) {
@ -1473,7 +1473,7 @@ function expectProvidersScenario(defs: {
static ngComponentDef = ɵɵdefineComponent({
type: ContentChildComponent,
selectors: [['content-child']],
consts: 1,
decls: 1,
vars: 0,
template: function(fs: RenderFlags, ctx: ParentComponent) {
if (fs & RenderFlags.Create) {
@ -1504,7 +1504,7 @@ function expectProvidersScenario(defs: {
static ngComponentDef = ɵɵdefineComponent({
type: ParentComponent,
selectors: [['parent']],
consts: 1,
decls: 1,
vars: 0,
template: function(fs: RenderFlags, ctx: ParentComponent) {
if (fs & RenderFlags.Create) {
@ -1541,7 +1541,7 @@ function expectProvidersScenario(defs: {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 2,
decls: 2,
vars: 0,
template: function(fs: RenderFlags, ctx: App) {
if (fs & RenderFlags.Create) {

View File

@ -23,7 +23,7 @@ describe('object literals', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ObjectComp,
selectors: [['object-comp']],
consts: 0,
decls: 0,
vars: 1,
template: function ObjectComp_Template() {},
inputs: {config: 'config'}

View File

@ -113,7 +113,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', '']);
ɵɵelement(0, 'div', 0);
elToQuery = getNativeByIndex(0, getLView());
}
},
@ -127,7 +127,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -150,7 +151,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['child', '', 'otherChild', '']);
ɵɵelementStart(0, 'div', 0);
{ otherChildInstance = getDirectiveOnNode(0, 1); }
ɵɵelementEnd();
}
@ -165,7 +166,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '', 'otherChild', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -186,7 +188,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', '']);
ɵɵelement(0, 'div', 0);
}
},
1, 0, [Child, OtherChild], [],
@ -199,7 +201,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -249,11 +252,12 @@ describe('query', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 1,
decls: 1,
vars: 0,
consts: [['myDir']],
template: function App_Template(rf: RenderFlags, ctx: App) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['myDir']);
ɵɵelement(0, 'div', 0);
}
},
viewQuery: function(rf: RenderFlags, ctx: App) {
@ -294,11 +298,12 @@ describe('query', () => {
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 1,
decls: 1,
vars: 0,
consts: [['myDir']],
template: function App_Template(rf: RenderFlags, ctx: App) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['myDir']);
ɵɵelement(0, 'div', 0);
}
},
viewQuery: function(rf: RenderFlags, ctx: App) {
@ -837,7 +842,7 @@ describe('query', () => {
static ngComponentDef = ɵɵdefineComponent({
type: Child,
selectors: [['child']],
consts: 0,
decls: 0,
vars: 0,
template: (rf: RenderFlags, ctx: Child) => {},
exportAs: ['child']
@ -890,7 +895,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', ''], ['foo', 'child']);
ɵɵelement(0, 'div', 0, ['foo', 'child']);
}
if (rf & RenderFlags.Update) {
childInstance = getDirectiveOnNode(0);
@ -906,7 +911,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -929,8 +935,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(
0, 'div', ['child1', '', 'child2', ''], ['foo', 'child1', 'bar', 'child2']);
ɵɵelement(0, 'div', 0, ['foo', 'child1', 'bar', 'child2']);
}
if (rf & RenderFlags.Update) {
child1Instance = getDirectiveOnNode(0, 0);
@ -947,7 +952,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child1', '', 'child2', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -971,7 +977,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', ''], ['foo', 'child', 'bar', 'child']);
ɵɵelement(0, 'div', 0, ['foo', 'child', 'bar', 'child']);
}
if (rf & RenderFlags.Update) {
childInstance = getDirectiveOnNode(0);
@ -990,7 +996,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.barQuery = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
@ -1017,7 +1024,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', ''], ['foo', 'child']);
ɵɵelement(0, 'div', 0, ['foo', 'child']);
div = getNativeByIndex(0, getLView());
}
},
@ -1031,7 +1038,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -1053,7 +1061,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', ''], ['foo', '', 'bar', 'child']);
ɵɵelement(0, 'div', 0, ['foo', '', 'bar', 'child']);
div = getNativeByIndex(0, getLView());
}
if (rf & RenderFlags.Update) {
@ -1070,7 +1078,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const cmptInstance = renderComponent(Cmpt);
const qList = (cmptInstance.query as QueryList<any>);
@ -1092,7 +1101,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['foo', '']);
ɵɵelement(0, 'div', 0);
}
},
2, 0, [Child], [],
@ -1105,7 +1114,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['foo', '']]);
const {component} = new ComponentFixture(Cmpt);
const qList = component.query;
@ -1126,7 +1136,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', '']);
ɵɵelement(0, 'div', 0);
}
},
1, 0, [Child, OtherChild], [],
@ -1139,7 +1149,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const {component} = new ComponentFixture(Cmpt);
const qList = component.query;
@ -1160,7 +1171,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', '']);
ɵɵelement(0, 'div', 0);
}
},
1, 0, [Child, OtherChild], [],
@ -1173,7 +1184,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const {component} = new ComponentFixture(Cmpt);
const qList = component.query;
@ -1224,7 +1236,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', ''], ['foo', '']);
ɵɵelement(0, 'div', 0, ['foo', '']);
}
},
2, 0, [Child], [],
@ -1237,7 +1249,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const {component} = new ComponentFixture(Cmpt);
const qList = component.query;
@ -1258,7 +1271,7 @@ describe('query', () => {
'cmpt',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['child', '']);
ɵɵelement(0, 'div', 0);
}
},
1, 0, [Child], [],
@ -1271,7 +1284,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['child', '']]);
const {component} = new ComponentFixture(Cmpt);
const qList = component.query;
@ -1429,8 +1443,7 @@ describe('query', () => {
'app',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵtemplate(
0, AppComponent_Template_1, 1, 0, 'div', [AttributeMarker.Template, 'someDir']);
ɵɵtemplate(0, AppComponent_Template_1, 1, 0, 'div', 0);
ɵɵelement(1, 'div', null, ['foo', '']);
}
},
@ -1444,7 +1457,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.query = tmp as QueryList<any>);
}
});
},
[], [], undefined, [[AttributeMarker.Template, 'someDir']]);
const fixture = new ComponentFixture(AppComponent);
expect(fixture.component.query.length).toBe(1);
@ -1489,13 +1503,17 @@ describe('query', () => {
* <span #foo></span>
* </div>
*/
const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', [AttributeMarker.Bindings, 'with-content']);
{ ɵɵelement(1, 'span', null, ['foo', '']); }
ɵɵelementEnd();
}
}, 3, 0, [WithContentDirective]);
const AppComponent = createComponent(
'app-component',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', 0);
{ ɵɵelement(1, 'span', null, ['foo', '']); }
ɵɵelementEnd();
}
},
3, 0, [WithContentDirective], [], null, [], [], undefined,
[[AttributeMarker.Bindings, 'with-content']]);
const fixture = new ComponentFixture(AppComponent);
expect(withContentInstance !.foos.length)
@ -1520,27 +1538,31 @@ describe('query', () => {
* </div>
* % }
*/
const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵcontainer(0);
}
if (rf & RenderFlags.Update) {
ɵɵcontainerRefreshStart(0);
{
for (let i = 0; i < 3; i++) {
let rf = ɵɵembeddedViewStart(1, 3, 0);
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', [AttributeMarker.Bindings, 'with-content']);
{ ɵɵelement(1, 'span', null, ['foo', '']); }
ɵɵelementEnd();
}
ɵɵembeddedViewEnd();
const AppComponent = createComponent(
'app-component',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵcontainer(0);
}
}
if (rf & RenderFlags.Update) {
ɵɵcontainerRefreshStart(0);
{
for (let i = 0; i < 3; i++) {
let rf = ɵɵembeddedViewStart(1, 3, 0);
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', 0);
{ ɵɵelement(1, 'span', null, ['foo', '']); }
ɵɵelementEnd();
}
ɵɵembeddedViewEnd();
}
}
ɵɵcontainerRefreshEnd();
}
}, 1, 0, [WithContentDirective]);
ɵɵcontainerRefreshEnd();
}
},
1, 0, [WithContentDirective], [], null, [], [], undefined,
[[AttributeMarker.Bindings, 'with-content']]);
const fixture = new ComponentFixture(AppComponent);
expect(withContentInstance !.foos.length)
@ -1564,9 +1586,9 @@ describe('query', () => {
*/
const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['with-content', ''], ['foo', '']);
ɵɵelement(0, 'div', 0, ['foo', '']);
}
}, 2, 0, [WithContentDirective]);
}, 2, 0, [WithContentDirective], [], null, [], [], undefined, [['with-content', '']]);
const fixture = new ComponentFixture(AppComponent);
expect(withContentInstance !.foos.length)
@ -1588,10 +1610,10 @@ describe('query', () => {
'app-component',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['with-content', '']);
ɵɵelementStart(0, 'div', 0);
{ ɵɵelement(1, 'div', null, ['foo', '']); }
ɵɵelementEnd();
ɵɵelement(3, 'div', ['id', 'after'], ['bar', '']);
ɵɵelement(3, 'div', 1, ['bar', '']);
}
},
5, 0, [WithContentDirective], [],
@ -1604,7 +1626,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.foos = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['with-content', ''], ['id', 'after']]);
const fixture = new ComponentFixture(AppComponent);
const viewQList = fixture.component.foos;
@ -1629,8 +1652,8 @@ describe('query', () => {
'app-component',
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['with-content', '']);
{ ɵɵelement(1, 'div', ['id', 'yes'], ['foo', '']); }
ɵɵelementStart(0, 'div', 0);
{ ɵɵelement(1, 'div', 1, ['foo', '']); }
ɵɵelementEnd();
ɵɵelement(3, 'div', null, ['foo', '']);
}
@ -1645,7 +1668,8 @@ describe('query', () => {
ɵɵqueryRefresh(tmp = ɵɵloadQuery<QueryList<any>>()) &&
(ctx.bars = tmp as QueryList<any>);
}
});
},
[], [], undefined, [['with-content', ''], ['id', 'yes']]);
const fixture = new ComponentFixture(AppComponent);
expect(withContentInstance !.foos.length).toBe(1);
@ -1690,13 +1714,13 @@ describe('query', () => {
*/
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', [AttributeMarker.Bindings, 'query'], ['out', 'query']);
ɵɵelementStart(0, 'div', 0, ['out', 'query']);
{
ɵɵelement(2, 'span', ['id', 'foo'], ['foo', '']);
ɵɵelementStart(4, 'div', [AttributeMarker.Bindings, 'query'], ['in', 'query']);
{ ɵɵelement(6, 'span', ['id', 'bar'], ['bar', '']); }
ɵɵelement(2, 'span', 1, ['foo', '']);
ɵɵelementStart(4, 'div', 0, ['in', 'query']);
{ ɵɵelement(6, 'span', 2, ['bar', '']); }
ɵɵelementEnd();
ɵɵelement(8, 'span', ['id', 'baz'], ['baz', '']);
ɵɵelement(8, 'span', 3, ['baz', '']);
}
ɵɵelementEnd();
}
@ -1706,7 +1730,8 @@ describe('query', () => {
inInstance = load<QueryDirective>(lView, 5);
}
},
10, 0, [QueryDirective]);
10, 0, [QueryDirective], [], null, [], [], undefined,
[[AttributeMarker.Bindings, 'query'], ['id', 'foo'], ['id', 'bar'], ['id', 'baz']]);
const fixture = new ComponentFixture(AppComponent);
expect(outInstance !.fooBars.length).toBe(3);
@ -1750,10 +1775,10 @@ describe('query', () => {
*/
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['query', ''], ['out', 'query']);
ɵɵelementStart(0, 'div', 0, ['out', 'query']);
{
ɵɵelementStart(2, 'div', ['query', ''], ['in', 'query', 'foo', '']);
{ ɵɵelement(5, 'span', ['id', 'bar'], ['foo', '']); }
ɵɵelementStart(2, 'div', 0, ['in', 'query', 'foo', '']);
{ ɵɵelement(5, 'span', 1, ['foo', '']); }
ɵɵelementEnd();
}
ɵɵelementEnd();
@ -1764,7 +1789,7 @@ describe('query', () => {
inInstance = load<QueryDirective>(lView, 3);
}
},
7, 0, [QueryDirective]);
7, 0, [QueryDirective], [], null, [], [], undefined, [['query', ''], ['id', 'bar']]);
const fixture = new ComponentFixture(AppComponent);
expect(outInstance !.fooBars.length).toBe(1);
@ -1807,10 +1832,10 @@ describe('query', () => {
*/
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['query', ''], ['out', 'query']);
ɵɵelementStart(0, 'div', 0, ['out', 'query']);
{
ɵɵelementStart(2, 'div', ['query', ''], ['in', 'query', 'foo', '']);
{ ɵɵelement(5, 'span', ['id', 'bar'], ['foo', '']); }
ɵɵelementStart(2, 'div', 0, ['in', 'query', 'foo', '']);
{ ɵɵelement(5, 'span', 1, ['foo', '']); }
ɵɵelementEnd();
}
ɵɵelementEnd();
@ -1821,7 +1846,7 @@ describe('query', () => {
inInstance = load<QueryDirective>(lView, 3);
}
},
7, 0, [QueryDirective]);
7, 0, [QueryDirective], [], null, [], [], undefined, [['query', ''], ['id', 'bar']]);
const fixture1 = new ComponentFixture(AppComponent);
expect(outInstance !.fooBars.length).toBe(1);
@ -1893,9 +1918,7 @@ describe('query', () => {
*/
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(
0, 'div', [AttributeMarker.Bindings, 'shallow-query', 'deep-query'],
['shallow', 'shallow-query', 'deep', 'deep-query']);
ɵɵelementStart(0, 'div', 0, ['shallow', 'shallow-query', 'deep', 'deep-query']);
{
ɵɵelement(3, 'span', null, ['foo', '']);
ɵɵelementStart(5, 'div');
@ -1910,7 +1933,8 @@ describe('query', () => {
deepInstance = load<DeepQueryDirective>(lView, 2);
}
},
8, 0, [ShallowQueryDirective, DeepQueryDirective]);
8, 0, [ShallowQueryDirective, DeepQueryDirective], [], null, [], [], undefined,
[[AttributeMarker.Bindings, 'shallow-query', 'deep-query']]);
const fixture = new ComponentFixture(AppComponent);
expect(shallowInstance !.foos.length).toBe(1);
@ -1967,20 +1991,23 @@ describe('query', () => {
*/
function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['content-query']);
ɵɵelementStart(0, 'div', 0);
{
ɵɵelement(1, 'span', ['text', 'A']);
ɵɵelementStart(2, 'div', ['text', 'B']);
ɵɵelementStart(3, 'span', ['text', 'C']);
{ ɵɵelement(4, 'span', ['text', 'D']); }
ɵɵelement(1, 'span', 1);
ɵɵelementStart(2, 'div', 2);
ɵɵelementStart(3, 'span', 3);
{ ɵɵelement(4, 'span', 4); }
ɵɵelementEnd();
ɵɵelementEnd();
ɵɵelement(5, 'span', ['text', 'E']);
ɵɵelement(5, 'span', 5);
}
ɵɵelementEnd();
}
},
6, 0, [TextDirective, ContentQueryDirective]);
6, 0, [TextDirective, ContentQueryDirective], [], null, [], [], undefined, [
['content-query'], ['text', 'A'], ['text', 'B'], ['text', 'C'], ['text', 'D'],
['text', 'E']
]);
new ComponentFixture(AppComponent);
expect(contentQueryDirective !.texts.map(item => item.value)).toEqual([
@ -2006,18 +2033,19 @@ describe('query', () => {
static ngComponentDef = ɵɵdefineComponent({
type: ViewQueryComponent,
selectors: [['view-query']],
consts: [['text', 'A'], ['text', 'B'], ['text', 'C'], ['text', 'D'], ['text', 'E']],
template: function(rf: RenderFlags, ctx: ViewQueryComponent) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'span', ['text', 'A']);
ɵɵelementStart(1, 'div', ['text', 'B']);
ɵɵelementStart(2, 'span', ['text', 'C']);
{ ɵɵelement(3, 'span', ['text', 'D']); }
ɵɵelement(0, 'span', 0);
ɵɵelementStart(1, 'div', 1);
ɵɵelementStart(2, 'span', 2);
{ ɵɵelement(3, 'span', 3); }
ɵɵelementEnd();
ɵɵelementEnd();
ɵɵelement(4, 'span', ['text', 'E']);
ɵɵelement(4, 'span', 4);
}
},
consts: 5,
decls: 5,
vars: 0,
viewQuery: function(rf: RenderFlags, ctx: ViewQueryComponent) {
let tmp: any;

View File

@ -13,7 +13,7 @@ import {TemplateRef} from '@angular/core/src/linker/template_ref';
import {ViewContainerRef} from '@angular/core/src/linker/view_container_ref';
import {Renderer2} from '@angular/core/src/render/api';
import {createLView, createTView, getOrCreateTNode, getOrCreateTView, renderComponentOrTemplate} from '@angular/core/src/render3/instructions/shared';
import {TNodeType} from '@angular/core/src/render3/interfaces/node';
import {TAttributes, TNodeType} from '@angular/core/src/render3/interfaces/node';
import {getLView, resetComponentState, selectView} from '@angular/core/src/render3/state';
import {stringifyElement} from '@angular/platform-browser/testing/src/browser_util';
@ -100,10 +100,10 @@ export class TemplateFixture extends BaseFixture {
* `if (rf & RenderFlags.Update) { __here__ }`.
*/
constructor(
private createBlock: () => void, private updateBlock: () => void = noop, consts: number = 0,
private createBlock: () => void, private updateBlock: () => void = noop, decls: number = 0,
private vars: number = 0, directives?: DirectiveTypesOrFactory|null,
pipes?: PipeTypesOrFactory|null, sanitizer?: Sanitizer|null,
rendererFactory?: RendererFactory3) {
rendererFactory?: RendererFactory3, private _consts?: TAttributes[]) {
super();
this._directiveDefs = toDefs(directives, extractDirectiveDef);
this._pipeDefs = toDefs(pipes, extractPipeDef);
@ -119,8 +119,8 @@ export class TemplateFixture extends BaseFixture {
this.updateBlock();
}
},
consts, vars, null !, this._rendererFactory, null, this._directiveDefs, this._pipeDefs,
sanitizer);
decls, vars, null !, this._rendererFactory, null, this._directiveDefs, this._pipeDefs,
sanitizer, this._consts);
}
/**
@ -131,7 +131,8 @@ export class TemplateFixture extends BaseFixture {
update(updateBlock?: () => void): void {
renderTemplate(
this.hostElement, updateBlock || this.updateBlock, 0, this.vars, null !,
this._rendererFactory, this.hostView, this._directiveDefs, this._pipeDefs, this._sanitizer);
this._rendererFactory, this.hostView, this._directiveDefs, this._pipeDefs, this._sanitizer,
this._consts);
}
destroy(): void {
@ -236,24 +237,25 @@ export function resetDOM() {
*
* @param hostNode Existing node to render into.
* @param templateFn Template function with the instructions.
* @param consts The number of nodes, local refs, and pipes in this template
* @param decls The number of nodes, local refs, and pipes in this template
* @param context to pass into the template.
* @param providedRendererFactory renderer factory to use
* @param host The host element node to use
* @param directives Directive defs that should be used for matching
* @param pipes Pipe defs that should be used for matching
* @param consts Constants associated with the template.
*/
export function renderTemplate<T>(
hostNode: RElement, templateFn: ComponentTemplate<T>, consts: number, vars: number, context: T,
hostNode: RElement, templateFn: ComponentTemplate<T>, decls: number, vars: number, context: T,
providedRendererFactory: RendererFactory3, componentView: LView | null,
directives?: DirectiveDefListOrFactory | null, pipes?: PipeDefListOrFactory | null,
sanitizer?: Sanitizer | null): LView {
sanitizer?: Sanitizer | null, consts?: TAttributes[]): LView {
if (componentView === null) {
resetComponentState();
const renderer = providedRendererFactory.createRenderer(null, null);
// We need to create a root view so it's possible to look up the host element through its index
const tView = createTView(-1, null, 1, 0, null, null, null, null);
const tView = createTView(-1, null, 1, 0, null, null, null, null, null);
const hostLView = createLView(
null, tView, {}, LViewFlags.CheckAlways | LViewFlags.IsRoot, null, null,
providedRendererFactory, renderer);
@ -263,8 +265,9 @@ export function renderTemplate<T>(
selectors: [],
type: Object,
template: templateFn,
consts: consts,
decls: decls,
vars: vars,
consts: consts,
});
def.directiveDefs = directives || null;
def.pipeDefs = pipes || null;
@ -285,12 +288,14 @@ export function renderTemplate<T>(
* @deprecated use `TemplateFixture` or `ComponentFixture`
*/
export function renderToHtml(
template: ComponentTemplate<any>, ctx: any, consts: number = 0, vars: number = 0,
template: ComponentTemplate<any>, ctx: any, decls: number = 0, vars: number = 0,
directives?: DirectiveTypesOrFactory | null, pipes?: PipeTypesOrFactory | null,
providedRendererFactory?: RendererFactory3 | null, keepNgReflect = false) {
providedRendererFactory?: RendererFactory3 | null, keepNgReflect = false,
consts?: TAttributes[]) {
hostView = renderTemplate(
containerEl, template, consts, vars, ctx, providedRendererFactory || testRendererFactory,
hostView, toDefs(directives, extractDirectiveDef), toDefs(pipes, extractPipeDef));
containerEl, template, decls, vars, ctx, providedRendererFactory || testRendererFactory,
hostView, toDefs(directives, extractDirectiveDef), toDefs(pipes, extractPipeDef), null,
consts);
return toHtml(containerEl, keepNgReflect);
}
@ -362,24 +367,26 @@ export function toHtml<T>(componentOrElement: T | RElement, keepNgReflect = fals
}
export function createComponent(
name: string, template: ComponentTemplate<any>, consts: number = 0, vars: number = 0,
name: string, template: ComponentTemplate<any>, decls: number = 0, vars: number = 0,
directives: DirectiveTypesOrFactory = [], pipes: PipeTypesOrFactory = [],
viewQuery: ComponentTemplate<any>| null = null, providers: Provider[] = [],
viewProviders: Provider[] = [], hostBindings?: HostBindingsFunction<any>): ComponentType<any> {
viewProviders: Provider[] = [], hostBindings?: HostBindingsFunction<any>,
consts: TAttributes[] = []): ComponentType<any> {
return class Component {
value: any;
static ngFactoryDef = () => new Component;
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [[name]],
consts: consts,
decls: decls,
vars: vars,
template: template,
viewQuery: viewQuery,
directives: directives, hostBindings,
pipes: pipes,
features: (providers.length > 0 || viewProviders.length > 0)?
[ɵɵProvidersFeature(providers || [], viewProviders || [])]: []
[ɵɵProvidersFeature(providers || [], viewProviders || [])]: [],
consts: consts,
});
};
}

View File

@ -31,7 +31,7 @@ describe('renderer factory lifecycle', () => {
type: SomeComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['some-component']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: SomeComponent) {
if (rf & RenderFlags.Create) {
@ -51,7 +51,7 @@ describe('renderer factory lifecycle', () => {
type: SomeComponentWhichThrows,
encapsulation: ViewEncapsulation.None,
selectors: [['some-component-with-Error']],
consts: 0,
decls: 0,
vars: 0,
template: function(rf: RenderFlags, ctx: SomeComponentWhichThrows) {
throw(new Error('SomeComponentWhichThrows threw'));
@ -155,7 +155,7 @@ describe('Renderer2 destruction hooks', () => {
type: SimpleComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['simple']],
consts: 1,
decls: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: SimpleComponent) {
if (rf & RenderFlags.Create) {

View File

@ -106,13 +106,14 @@ describe('ViewContainerRef', () => {
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test-cmp']],
consts: 4,
decls: 4,
vars: 0,
consts: [['testdir', '']],
template: (rf: RenderFlags, cmp: TestComponent) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0, 'before|');
ɵɵtemplate(1, EmbeddedTemplateA, 1, 0, 'ng-template', ['testdir', '']);
ɵɵtemplate(2, EmbeddedTemplateB, 1, 0, 'ng-template', ['testdir', '']);
ɵɵtemplate(1, EmbeddedTemplateA, 1, 0, 'ng-template', 0);
ɵɵtemplate(2, EmbeddedTemplateB, 1, 0, 'ng-template', 0);
ɵɵtext(3, '|after');
}
},
@ -177,12 +178,13 @@ describe('ViewContainerRef', () => {
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test-cmp']],
consts: 4,
decls: 4,
vars: 0,
consts: [['testdir', '']],
template: (rf: RenderFlags, cmp: TestComponent) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0, 'before|');
ɵɵtemplate(1, EmbeddedTemplateA, 1, 0, 'ng-template', ['testdir', '']);
ɵɵtemplate(1, EmbeddedTemplateA, 1, 0, 'ng-template', 0);
ɵɵcontainer(2);
ɵɵtext(3, '|after');
}
@ -248,7 +250,7 @@ describe('ViewContainerRef', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
consts: 0,
decls: 0,
vars: 0,
template: (rf: RenderFlags, cmp: AppComp) => {}
});
@ -264,7 +266,7 @@ describe('ViewContainerRef', () => {
static ngComponentDef = ɵɵdefineComponent({
type: DynamicComp,
selectors: [['dynamic-comp']],
consts: 0,
decls: 0,
vars: 0,
template: (rf: RenderFlags, cmp: DynamicComp) => {}
});
@ -320,11 +322,13 @@ describe('ViewContainerRef', () => {
describe('getters', () => {
it('should work on elements', () => {
function createTemplate() {
ɵɵelement(0, 'header', ['vcref', '']);
ɵɵelement(0, 'header', 0);
ɵɵelement(1, 'footer');
}
new TemplateFixture(createTemplate, undefined, 2, 0, [DirectiveWithVCRef]);
new TemplateFixture(
createTemplate, undefined, 2, 0, [DirectiveWithVCRef], null, null, undefined,
[['vcref', '']]);
expect(directiveInstance !.vcref.element.nativeElement.tagName.toLowerCase())
.toEqual('header');
@ -339,11 +343,13 @@ describe('ViewContainerRef', () => {
createComponent('header-cmp', function(rf: RenderFlags, ctx: any) {});
function createTemplate() {
ɵɵelement(0, 'header-cmp', ['vcref', '']);
ɵɵelement(0, 'header-cmp', 0);
ɵɵelement(1, 'footer');
}
new TemplateFixture(createTemplate, undefined, 2, 0, [HeaderComponent, DirectiveWithVCRef]);
new TemplateFixture(
createTemplate, undefined, 2, 0, [HeaderComponent, DirectiveWithVCRef], null, null,
undefined, [['vcref', '']]);
expect(directiveInstance !.vcref.element.nativeElement.tagName.toLowerCase())
.toEqual('header-cmp');
@ -365,7 +371,7 @@ describe('ViewContainerRef', () => {
static ngComponentDef = ɵɵdefineComponent({
type: AppCmpt,
selectors: [['app']],
consts: 0,
decls: 0,
vars: 0,
template: (rf: RenderFlags, cmp: AppCmpt) => {}
});
@ -433,11 +439,12 @@ describe('ViewContainerRef', () => {
static ngComponentDef = ɵɵdefineComponent({
type: DynamicCompWithViewQueries,
selectors: [['dynamic-cmpt-with-view-queries']],
consts: 2,
decls: 2,
vars: 0,
consts: [['bar', '']],
template: (rf: RenderFlags, ctx: DynamicCompWithViewQueries) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['bar', ''], ['foo', '']);
ɵɵelement(0, 'div', 0, ['foo', '']);
}
// testing only
fooEl = getNativeByIndex(0, getLView()) as RElement;
@ -481,7 +488,7 @@ describe('ViewContainerRef', () => {
static ngComponentDef = ɵɵdefineComponent({
type: CompWithListenerThatDestroysItself,
selectors: [['comp-with-listener-and-on-destroy']],
consts: 2,
decls: 2,
vars: 0,
/** <button (click)="onClick()"> Click me </button> */
template: function CompTemplate(rf: RenderFlags, ctx: any) {

View File

@ -12,7 +12,7 @@ import {isLContainer, isLView} from '@angular/core/src/render3/interfaces/type_c
describe('view_utils', () => {
it('should verify unwrap methods', () => {
const div = document.createElement('div');
const tView = createTView(0, null, 0, 0, null, null, null, null);
const tView = createTView(0, null, 0, 0, null, null, null, null, null);
const lView = createLView(null, tView, {}, 0, div, null, {} as any, {} as any, null, null);
const tNode = createTNode(null !, null, 3, 0, 'div', []);
const lContainer = createLContainer(lView, lView, div, tNode, true);

View File

@ -509,7 +509,7 @@ describe('TestBed', () => {
static ngComponentDef = defineComponent({
type: ComponentClass,
selectors: [['comp']],
consts: 1,
decls: 1,
vars: 0,
template: (rf: any, ctx: any) => {
if (rf & 1) {

View File

@ -772,7 +772,7 @@ export declare function ɵɵdefineBase<T>(baseDefinition: {
export declare function ɵɵdefineComponent<T>(componentDefinition: {
type: Type<T>;
selectors: CssSelectorList;
consts: number;
decls: number;
vars: number;
inputs?: {
[P in keyof T]?: string | [string, string];
@ -784,6 +784,7 @@ export declare function ɵɵdefineComponent<T>(componentDefinition: {
contentQueries?: ContentQueriesFunction<T>;
exportAs?: string[];
template: ComponentTemplate<T>;
consts?: TAttributes[];
ngContentSelectors?: string[];
viewQuery?: ViewQueriesFunction<T> | null;
features?: ComponentDefFeature[];
@ -849,23 +850,23 @@ export declare function ɵɵdirectiveInject<T>(token: Type<T> | InjectionToken<T
export declare function ɵɵdisableBindings(): void;
export declare function ɵɵelement(index: number, name: string, attrs?: TAttributes | null, localRefs?: string[] | null): void;
export declare function ɵɵelement(index: number, name: string, constsIndex?: number | null, localRefs?: string[] | null): void;
export declare function ɵɵelementContainer(index: number, attrs?: TAttributes | null, localRefs?: string[] | null): void;
export declare function ɵɵelementContainer(index: number, constsIndex?: number | null, localRefs?: string[] | null): void;
export declare function ɵɵelementContainerEnd(): void;
export declare function ɵɵelementContainerStart(index: number, attrs?: TAttributes | null, localRefs?: string[] | null): void;
export declare function ɵɵelementContainerStart(index: number, constsIndex?: number | null, localRefs?: string[] | null): void;
export declare function ɵɵelementEnd(): void;
export declare function ɵɵelementHostAttrs(attrs: TAttributes): void;
export declare function ɵɵelementStart(index: number, name: string, attrs?: TAttributes | null, localRefs?: string[] | null): void;
export declare function ɵɵelementStart(index: number, name: string, constsIndex?: number | null, localRefs?: string[] | null): void;
export declare function ɵɵembeddedViewEnd(): void;
export declare function ɵɵembeddedViewStart(viewBlockId: number, consts: number, vars: number): RenderFlags;
export declare function ɵɵembeddedViewStart(viewBlockId: number, decls: number, vars: number): RenderFlags;
export declare function ɵɵenableBindings(): void;
@ -1075,7 +1076,7 @@ export declare function ɵɵstylePropInterpolateV(prop: string, values: any[], v
export declare function ɵɵstyleSanitizer(sanitizer: StyleSanitizeFn | null): void;
export declare function ɵɵtemplate(index: number, templateFn: ComponentTemplate<any> | null, consts: number, vars: number, tagName?: string | null, attrs?: TAttributes | null, localRefs?: string[] | null, localRefExtractor?: LocalRefExtractor): void;
export declare function ɵɵtemplate(index: number, templateFn: ComponentTemplate<any> | null, decls: number, vars: number, tagName?: string | null, constsIndex?: number | null, localRefs?: string[] | null, localRefExtractor?: LocalRefExtractor): void;
export declare function ɵɵtemplateRefExtractor(tNode: TNode, currentView: LView): ViewEngine_TemplateRef<unknown> | null;