diff --git a/modules/benchmarks/src/largetable/render3/table.ts b/modules/benchmarks/src/largetable/render3/table.ts index 9893af24b7..65998e56dc 100644 --- a/modules/benchmarks/src/largetable/render3/table.ts +++ b/modules/benchmarks/src/largetable/render3/table.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {ɵC as C, ɵE as E, ɵRenderFlags as RenderFlags, ɵT as T, ɵV as V, ɵb as b, ɵcR as cR, ɵcr as cr, ɵdefineComponent as defineComponent, ɵdetectChanges as detectChanges, ɵe as e, ɵi1 as i1, ɵp as p, ɵs as s, ɵsa as sa, ɵsm as sm, ɵsp as sp, ɵt as t, ɵv as v} from '@angular/core'; +import {ɵRenderFlags, ɵbind, ɵcontainer, ɵcontainerRefreshEnd, ɵcontainerRefreshStart, ɵdefineComponent, ɵdetectChanges, ɵelementEnd, ɵelementStart, ɵelementStyling, ɵelementStylingProp, ɵembeddedViewEnd, ɵembeddedViewStart, ɵtext, ɵtextBinding as ɵtextBinding} from '@angular/core'; import {ComponentDefInternal} from '@angular/core/src/render3/interfaces/definition'; import {TableCell, buildTable, emptyTable} from '../util'; @@ -16,57 +16,57 @@ export class LargeTableComponent { data: TableCell[][] = emptyTable; /** @nocollapse */ - static ngComponentDef: ComponentDefInternal = defineComponent({ + static ngComponentDef: ComponentDefInternal = ɵdefineComponent({ type: LargeTableComponent, selectors: [['largetable']], - template: function(rf: RenderFlags, ctx: LargeTableComponent) { - if (rf & RenderFlags.Create) { - E(0, 'table'); + template: function(rf: ɵRenderFlags, ctx: LargeTableComponent) { + if (rf & ɵRenderFlags.Create) { + ɵelementStart(0, 'table'); { - E(1, 'tbody'); - { C(2); } - e(); + ɵelementStart(1, 'tbody'); + { ɵcontainer(2); } + ɵelementEnd(); } - e(); + ɵelementEnd(); } - if (rf & RenderFlags.Update) { - cR(2); + if (rf & ɵRenderFlags.Update) { + ɵcontainerRefreshStart(2); { for (let row of ctx.data) { - let rf1 = V(1); + let rf1 = ɵembeddedViewStart(1); { - if (rf1 & RenderFlags.Create) { - E(0, 'tr'); - C(1); - e(); + if (rf1 & ɵRenderFlags.Create) { + ɵelementStart(0, 'tr'); + ɵcontainer(1); + ɵelementEnd(); } - if (rf1 & RenderFlags.Update) { - cR(1); + if (rf1 & ɵRenderFlags.Update) { + ɵcontainerRefreshStart(1); { for (let cell of row) { - let rf2 = V(2); + let rf2 = ɵembeddedViewStart(2); { - if (rf2 & RenderFlags.Create) { - E(0, 'td'); - s(null, c0); - { T(1); } - e(); + if (rf2 & ɵRenderFlags.Create) { + ɵelementStart(0, 'td'); + ɵelementStyling(null, c0); + { ɵtext(1); } + ɵelementEnd(); } - if (rf2 & RenderFlags.Update) { - sp(0, 0, null, cell.row % 2 ? '' : 'grey'); - t(1, b(cell.value)); + if (rf2 & ɵRenderFlags.Update) { + ɵelementStylingProp(0, 0, null, cell.row % 2 ? '' : 'grey'); + ɵtextBinding(1, ɵbind(cell.value)); } } - v(); + ɵembeddedViewEnd(); } } - cr(); + ɵcontainerRefreshEnd(); } } - v(); + ɵembeddedViewEnd(); } } - cr(); + ɵcontainerRefreshEnd(); } }, factory: () => new LargeTableComponent(), @@ -76,10 +76,10 @@ export class LargeTableComponent { export function destroyDom(component: LargeTableComponent) { component.data = emptyTable; - detectChanges(component); + ɵdetectChanges(component); } export function createDom(component: LargeTableComponent) { component.data = buildTable(); - detectChanges(component); + ɵdetectChanges(component); } diff --git a/modules/benchmarks/src/tree/render3/tree.ts b/modules/benchmarks/src/tree/render3/tree.ts index 70b9d43ea2..3d1933ebd0 100644 --- a/modules/benchmarks/src/tree/render3/tree.ts +++ b/modules/benchmarks/src/tree/render3/tree.ts @@ -6,25 +6,25 @@ * found in the LICENSE file at https://angular.io/license */ -import {ɵC as C, ɵE as E, ɵRenderFlags as RenderFlags, ɵT as T, ɵV as V, ɵb as b, ɵcR as cR, ɵcr as cr, ɵdefineComponent as defineComponent, ɵdetectChanges as _detectChanges, ɵe as e, ɵi1 as i1, ɵp as p, ɵs as s, ɵsa as sa, ɵsm as sm, ɵsp as sp, ɵt as t, ɵv as v} from '@angular/core'; +import {ɵRenderFlags, ɵbind, ɵcontainer, ɵcontainerRefreshEnd, ɵcontainerRefreshStart, ɵdefineComponent, ɵdetectChanges, ɵelementEnd, ɵelementProperty, ɵelementStart, ɵelementStyling as s, ɵelementStylingProp, ɵembeddedViewEnd, ɵembeddedViewStart, ɵinterpolation1, ɵtext, ɵtextBinding as ɵtextBinding} from '@angular/core'; import {TreeNode, buildTree, emptyTree} from '../util'; export function destroyDom(component: TreeComponent) { component.data = emptyTree; - _detectChanges(component); + ɵdetectChanges(component); } export function createDom(component: TreeComponent) { component.data = buildTree(); - _detectChanges(component); + ɵdetectChanges(component); } const numberOfChecksEl = document.getElementById('numberOfChecks') !; let detectChangesRuns = 0; export function detectChanges(component: TreeComponent) { for (let i = 0; i < 10; i++) { - _detectChanges(component); + ɵdetectChanges(component); } detectChangesRuns += 10; numberOfChecksEl.textContent = `${detectChangesRuns}`; @@ -35,55 +35,55 @@ export class TreeComponent { data: TreeNode = emptyTree; /** @nocollapse */ - static ngComponentDef = defineComponent({ + static ngComponentDef = ɵdefineComponent({ type: TreeComponent, selectors: [['tree']], - template: function(rf: RenderFlags, ctx: TreeComponent) { - if (rf & RenderFlags.Create) { - E(0, 'span'); + template: function(rf: ɵRenderFlags, ctx: TreeComponent) { + if (rf & ɵRenderFlags.Create) { + ɵelementStart(0, 'span'); s(null, c0); - { T(1); } - e(); - C(2); - C(3); + { ɵtext(1); } + ɵelementEnd(); + ɵcontainer(2); + ɵcontainer(3); } - if (rf & RenderFlags.Update) { - sp(0, 0, ctx.data.depth % 2 ? '' : 'grey'); - t(1, i1(' ', ctx.data.value, ' ')); - cR(2); + if (rf & ɵRenderFlags.Update) { + ɵelementStylingProp(0, 0, ctx.data.depth % 2 ? '' : 'grey'); + ɵtextBinding(1, ɵinterpolation1(' ', ctx.data.value, ' ')); + ɵcontainerRefreshStart(2); { if (ctx.data.left != null) { - let rf0 = V(0); + let rf0 = ɵembeddedViewStart(0); { - if (rf0 & RenderFlags.Create) { - E(0, 'tree'); - e(); + if (rf0 & ɵRenderFlags.Create) { + ɵelementStart(0, 'tree'); + ɵelementEnd(); } - if (rf0 & RenderFlags.Update) { - p(0, 'data', b(ctx.data.left)); + if (rf0 & ɵRenderFlags.Update) { + ɵelementProperty(0, 'data', ɵbind(ctx.data.left)); } } - v(); + ɵembeddedViewEnd(); } } - cr(); - cR(3); + ɵcontainerRefreshEnd(); + ɵcontainerRefreshStart(3); { if (ctx.data.right != null) { - let rf0 = V(0); + let rf0 = ɵembeddedViewStart(0); { - if (rf0 & RenderFlags.Create) { - E(0, 'tree'); - e(); + if (rf0 & ɵRenderFlags.Create) { + ɵelementStart(0, 'tree'); + ɵelementEnd(); } - if (rf0 & RenderFlags.Update) { - p(0, 'data', b(ctx.data.right)); + if (rf0 & ɵRenderFlags.Update) { + ɵelementProperty(0, 'data', ɵbind(ctx.data.right)); } } - v(); + ɵembeddedViewEnd(); } } - cr(); + ɵcontainerRefreshEnd(); } }, factory: () => new TreeComponent, @@ -96,10 +96,10 @@ export class TreeFunction { data: TreeNode = emptyTree; /** @nocollapse */ - static ngComponentDef = defineComponent({ + static ngComponentDef = ɵdefineComponent({ type: TreeFunction, selectors: [['tree']], - template: function(rf: RenderFlags, ctx: TreeFunction) { + template: function(rf: ɵRenderFlags, ctx: TreeFunction) { // bit of a hack TreeTpl(rf, ctx.data); }, @@ -109,39 +109,39 @@ export class TreeFunction { } const c1 = ['background-color']; -export function TreeTpl(rf: RenderFlags, ctx: TreeNode) { - if (rf & RenderFlags.Create) { - E(0, 'tree'); +export function TreeTpl(rf: ɵRenderFlags, ctx: TreeNode) { + if (rf & ɵRenderFlags.Create) { + ɵelementStart(0, 'tree'); { - E(1, 'span'); + ɵelementStart(1, 'span'); s(null, c1); - { T(2); } - e(); - C(3); - C(4); + { ɵtext(2); } + ɵelementEnd(); + ɵcontainer(3); + ɵcontainer(4); } - e(); + ɵelementEnd(); } - if (rf & RenderFlags.Update) { - sp(1, 0, ctx.depth % 2 ? '' : 'grey'); - t(2, i1(' ', ctx.value, ' ')); - cR(3); + if (rf & ɵRenderFlags.Update) { + ɵelementStylingProp(1, 0, ctx.depth % 2 ? '' : 'grey'); + ɵtextBinding(2, ɵinterpolation1(' ', ctx.value, ' ')); + ɵcontainerRefreshStart(3); { if (ctx.left != null) { - let rf0 = V(0); + let rf0 = ɵembeddedViewStart(0); { TreeTpl(rf0, ctx.left); } - v(); + ɵembeddedViewEnd(); } } - cr(); - cR(4); + ɵcontainerRefreshEnd(); + ɵcontainerRefreshStart(4); { if (ctx.right != null) { - let rf0 = V(0); + let rf0 = ɵembeddedViewStart(0); { TreeTpl(rf0, ctx.right); } - v(); + ɵembeddedViewEnd(); } } - cr(); + ɵcontainerRefreshEnd(); } } diff --git a/packages/compiler-cli/test/compliance/mock_compiler_spec.ts b/packages/compiler-cli/test/compliance/mock_compiler_spec.ts index 4b0e3ab4d4..7ea02519f8 100644 --- a/packages/compiler-cli/test/compliance/mock_compiler_spec.ts +++ b/packages/compiler-cli/test/compliance/mock_compiler_spec.ts @@ -140,7 +140,7 @@ describe('mock_compiler', () => { expectEmit( result.source, ` // TODO: this comment should not be taken into account - $r3$.ɵT(0, "Hello!"); + $r3$.ɵtext(0, "Hello!"); // TODO: this comment should not be taken into account `, 'todo comments should be ignored'); diff --git a/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts b/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts index 4d87cbe649..3a0c6e3b26 100644 --- a/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts @@ -53,17 +53,17 @@ describe('compiler compliance', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div", $c1$); - $r3$.ɵs($c2$); - $r3$.ɵNS(); - $r3$.ɵE(1, "svg"); - $r3$.ɵEe(2, "circle", $c3$); - $r3$.ɵe(); - $r3$.ɵNH(); - $r3$.ɵE(3, "p"); - $r3$.ɵT(4, "test"); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div", $c1$); + $r3$.ɵelementStyling($c2$); + $r3$.ɵnamespaceSVG(); + $r3$.ɵelementStart(1, "svg"); + $r3$.ɵelement(2, "circle", $c3$); + $r3$.ɵelementEnd(); + $r3$.ɵnamespaceHTML(); + $r3$.ɵelementStart(3, "p"); + $r3$.ɵtext(4, "test"); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } } `; @@ -104,17 +104,17 @@ describe('compiler compliance', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div", $c1$); - $r3$.ɵs($c2$); - $r3$.ɵNM(); - $r3$.ɵE(1, "math"); - $r3$.ɵEe(2, "infinity"); - $r3$.ɵe(); - $r3$.ɵNH(); - $r3$.ɵE(3, "p"); - $r3$.ɵT(4, "test"); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div", $c1$); + $r3$.ɵelementStyling($c2$); + $r3$.ɵnamespaceMathML(); + $r3$.ɵelementStart(1, "math"); + $r3$.ɵelement(2, "infinity"); + $r3$.ɵelementEnd(); + $r3$.ɵnamespaceHTML(); + $r3$.ɵelementStart(3, "p"); + $r3$.ɵtext(4, "test"); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } } `; @@ -155,14 +155,14 @@ describe('compiler compliance', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div", $c1$); - $r3$.ɵs($c2$); - $r3$.ɵT(1, "Hello "); - $r3$.ɵE(2, "b"); - $r3$.ɵT(3, "World"); - $r3$.ɵe(); - $r3$.ɵT(4, "!"); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div", $c1$); + $r3$.ɵelementStyling($c2$); + $r3$.ɵtext(1, "Hello "); + $r3$.ɵelementStart(2, "b"); + $r3$.ɵtext(3, "World"); + $r3$.ɵelementEnd(); + $r3$.ɵtext(4, "!"); + $r3$.ɵelementEnd(); } } `; @@ -204,13 +204,13 @@ describe('compiler compliance', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div", $e0_attrs$); - $r3$.ɵT(1, "Hello "); - $r3$.ɵE(2, "b"); - $r3$.ɵT(3, "World"); - $r3$.ɵe(); - $r3$.ɵT(4, "!"); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div", $e0_attrs$); + $r3$.ɵtext(1, "Hello "); + $r3$.ɵelementStart(2, "b"); + $r3$.ɵtext(3, "World"); + $r3$.ɵelementEnd(); + $r3$.ɵtext(4, "!"); + $r3$.ɵelementEnd(); } } `; @@ -246,10 +246,10 @@ describe('compiler compliance', () => { template: function MyComponent_Template(rf, ctx) { if (rf & 1) { i0.ɵEC(0); - i0.ɵE(1, "span"); - i0.ɵT(2, "in a "); - i0.ɵe(); - i0.ɵT(3, "container"); + i0.ɵelementStart(1, "span"); + i0.ɵtext(2, "in a "); + i0.ɵelementEnd(); + i0.ɵtext(3, "container"); i0.ɵeC(); } } @@ -317,10 +317,10 @@ describe('compiler compliance', () => { const template = ` template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "div"); + $r3$.ɵelement(0, "div"); } if (rf & 2) { - $r3$.ɵp(0, "id", $r3$.ɵb(ctx.id)); + $r3$.ɵelementProperty(0, "id", $r3$.ɵbind(ctx.id)); } } `; @@ -362,15 +362,15 @@ describe('compiler compliance', () => { const template = ` template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "div"); - $r3$.ɵPp(1,"pipe"); - $r3$.ɵrS(10); + $r3$.ɵelement(0, "div"); + $r3$.ɵpipe(1,"pipe"); + $r3$.ɵreserveSlots(10); } if (rf & 2) { - $r3$.ɵp(0, "ternary", $r3$.ɵb((ctx.cond ? $r3$.ɵf1(6, _c0, ctx.a): _c1))); - $r3$.ɵp(0, "pipe", $r3$.ɵb($r3$.ɵpb3(1, 4, ctx.value, 1, 2))); - $r3$.ɵp(0, "and", $r3$.ɵb((ctx.cond && $r3$.ɵf1(8, _c0, ctx.b)))); - $r3$.ɵp(0, "or", $r3$.ɵb((ctx.cond || $r3$.ɵf1(10, _c0, ctx.c)))); + $r3$.ɵelementProperty(0, "ternary", $r3$.ɵbind((ctx.cond ? $r3$.ɵpureFunction1(6, _c0, ctx.a): _c1))); + $r3$.ɵelementProperty(0, "pipe", $r3$.ɵbind($r3$.ɵpipeBind3(1, 4, ctx.value, 1, 2))); + $r3$.ɵelementProperty(0, "and", $r3$.ɵbind((ctx.cond && $r3$.ɵpureFunction1(8, _c0, ctx.b)))); + $r3$.ɵelementProperty(0, "or", $r3$.ɵbind((ctx.cond || $r3$.ɵpureFunction1(10, _c0, ctx.c)))); } } `; @@ -416,14 +416,14 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template:function MyComponent_Template(rf,ctx){ if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(_c0, _c1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(_c0, _c1); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsp(0, 0, ctx.color); - $r3$.ɵcp(0, 0, ctx.error); - $r3$.ɵsa(0); + $r3$.ɵelementStylingProp(0, 0, ctx.color); + $r3$.ɵelementClassProp(0, 0, ctx.error); + $r3$.ɵelementStylingApply(0); } } }); @@ -469,7 +469,7 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function ChildComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵT(0, "child-view"); + $r3$.ɵtext(0, "child-view"); } } });`; @@ -495,8 +495,8 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "child", $c1$); - $r3$.ɵT(1, "!"); + $r3$.ɵelement(0, "child", $c1$); + $r3$.ɵtext(1, "!"); } }, directives: [ChildComponent, SomeDirective] @@ -580,7 +580,7 @@ describe('compiler compliance', () => { selectors: [["", "hostBindingDir", ""]], factory: function HostBindingDir_Factory(t) { return new (t || HostBindingDir)(); }, hostBindings: function HostBindingDir_HostBindings(dirIndex, elIndex) { - $r3$.ɵp(elIndex, "id", $r3$.ɵb($r3$.ɵd(dirIndex).dirId)); + $r3$.ɵelementProperty(elIndex, "id", $r3$.ɵbind($r3$.ɵloadDirective(dirIndex).dirId)); }, features: [$r3$.ɵPublicFeature] }); @@ -629,14 +629,14 @@ describe('compiler compliance', () => { const $c2$ = ["if", ""]; function MyComponent_li_Template_2(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "li"); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "li"); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } if (rf & 2) { - const $myComp$ = $r3$.ɵx(); - const $foo$ = $r3$.ɵr(1); - $r3$.ɵt(1, $r3$.ɵi2("", $myComp$.salutation, " ", $foo$, "")); + const $myComp$ = $r3$.ɵnextContext(); + const $foo$ = $r3$.ɵreference(1); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation2("", $myComp$.salutation, " ", $foo$, "")); } } … @@ -647,9 +647,9 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "ul", null, $c1$); - $r3$.ɵC(2, MyComponent_li_Template_2, null, $c2$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "ul", null, $c1$); + $r3$.ɵcontainer(2, MyComponent_li_Template_2, null, $c2$); + $r3$.ɵelementEnd(); } }, directives:[IfDirective] @@ -707,11 +707,11 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyApp_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "my-comp"); - $r3$.ɵrS(2); + $r3$.ɵelement(0, "my-comp"); + $r3$.ɵreserveSlots(2); } if (rf & 2) { - $r3$.ɵp(0, "names", $r3$.ɵb($r3$.ɵf1(2, $e0_ff$, ctx.customName))); + $r3$.ɵelementProperty(0, "names", $r3$.ɵbind($r3$.ɵpureFunction1(2, $e0_ff$, ctx.customName))); } }, directives: [MyComp] @@ -787,13 +787,13 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyApp_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "my-comp"); - $r3$.ɵrS(10); + $r3$.ɵelement(0, "my-comp"); + $r3$.ɵreserveSlots(10); } if (rf & 2) { - $r3$.ɵp( + $r3$.ɵelementProperty( 0, "names", - $r3$.ɵb($r3$.ɵfV(10, $e0_ff$, [ctx.n0, ctx.n1, ctx.n2, ctx.n3, ctx.n4, ctx.n5, ctx.n6, ctx.n7, ctx.n8]))); + $r3$.ɵbind($r3$.ɵpureFunctionV(10, $e0_ff$, [ctx.n0, ctx.n1, ctx.n2, ctx.n3, ctx.n4, ctx.n5, ctx.n6, ctx.n7, ctx.n8]))); } }, directives: [MyComp] @@ -849,11 +849,11 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyApp_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "object-comp"); - $r3$.ɵrS(2); + $r3$.ɵelement(0, "object-comp"); + $r3$.ɵreserveSlots(2); } if (rf & 2) { - $r3$.ɵp(0, "config", $r3$.ɵb($r3$.ɵf1(2, $e0_ff$, ctx.name))); + $r3$.ɵelementProperty(0, "config", $r3$.ɵbind($r3$.ɵpureFunction1(2, $e0_ff$, ctx.name))); } }, directives: [ObjectComp] @@ -915,13 +915,13 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyApp_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "nested-comp"); - $r3$.ɵrS(7); + $r3$.ɵelement(0, "nested-comp"); + $r3$.ɵreserveSlots(7); } if (rf & 2) { - $r3$.ɵp( + $r3$.ɵelementProperty( 0, "config", - $r3$.ɵb($r3$.ɵf2(7, $e0_ff_2$, ctx.name, $r3$.ɵf1(4, $e0_ff_1$, $r3$.ɵf1(2, $e0_ff$, ctx.duration))))); + $r3$.ɵbind($r3$.ɵpureFunction2(7, $e0_ff_2$, ctx.name, $r3$.ɵpureFunction1(4, $e0_ff_1$, $r3$.ɵpureFunction1(2, $e0_ff$, ctx.duration))))); } }, directives: [NestedComp] @@ -973,10 +973,10 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function SimpleComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵpD(); - $r3$.ɵE(0, "div"); - $r3$.ɵP(1); - $r3$.ɵe(); + $r3$.ɵprojectionDef(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵprojection(1); + $r3$.ɵelementEnd(); } } });`; @@ -994,13 +994,13 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function ComplexComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵpD($c1$, $c2$); - $r3$.ɵE(0, "div", $c3$); - $r3$.ɵP(1, 1); - $r3$.ɵe(); - $r3$.ɵE(2, "div", $c4$); - $r3$.ɵP(3, 2); - $r3$.ɵe(); + $r3$.ɵprojectionDef($c1$, $c2$); + $r3$.ɵelementStart(0, "div", $c3$); + $r3$.ɵprojection(1, 1); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(2, "div", $c4$); + $r3$.ɵprojection(3, 2); + $r3$.ɵelementEnd(); } } }); @@ -1060,16 +1060,16 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], viewQuery: function ViewQueryComponent_Query(rf, ctx) { if (rf & 1) { - $r3$.ɵQ(0, SomeDirective, true); + $r3$.ɵquery(0, SomeDirective, true); } if (rf & 2) { var $tmp$; - ($r3$.ɵqR(($tmp$ = $r3$.ɵld(0))) && (ctx.someDir = $tmp$.first)); + ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵload(0))) && (ctx.someDir = $tmp$.first)); } }, template: function ViewQueryComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(1, "div", $e0_attrs$); + $r3$.ɵelement(1, "div", $e0_attrs$); } }, directives: function () { return [SomeDirective]; } @@ -1124,22 +1124,22 @@ describe('compiler compliance', () => { return new (t || ContentQueryComponent)(); }, contentQueries: function ContentQueryComponent_ContentQueries() { - $r3$.ɵQr($r3$.ɵQ(null, SomeDirective, true)); - $r3$.ɵQr($r3$.ɵQ(null, SomeDirective, false)); + $r3$.ɵregisterContentQuery($r3$.ɵquery(null, SomeDirective, true)); + $r3$.ɵregisterContentQuery($r3$.ɵquery(null, SomeDirective, false)); }, contentQueriesRefresh: function ContentQueryComponent_ContentQueriesRefresh(dirIndex, queryStartIndex) { - const instance = $r3$.ɵd(dirIndex); + const instance = $r3$.ɵloadDirective(dirIndex); var $tmp$; - ($r3$.ɵqR(($tmp$ = $r3$.ɵql(queryStartIndex))) && ($instance$.someDir = $tmp$.first)); - ($r3$.ɵqR(($tmp$ = $r3$.ɵql((queryStartIndex + 1)))) && ($instance$.someDirList = $tmp$)); + ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList(queryStartIndex))) && ($instance$.someDir = $tmp$.first)); + ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList((queryStartIndex + 1)))) && ($instance$.someDirList = $tmp$)); }, features: [$r3$.ɵPublicFeature], template: function ContentQueryComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵpD(); - $r3$.ɵE(0, "div"); - $r3$.ɵP(1); - $r3$.ɵe(); + $r3$.ɵprojectionDef(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵprojection(1); + $r3$.ɵelementEnd(); } } });`; @@ -1221,18 +1221,18 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyApp_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵT(0); - $r3$.ɵPp(1, "myPurePipe"); - $r3$.ɵPp(2, "myPipe"); - $r3$.ɵE(3, "p"); - $r3$.ɵT(4); - $r3$.ɵPp(5, "myPipe"); - $r3$.ɵe(); - $r3$.ɵrS(15); + $r3$.ɵtext(0); + $r3$.ɵpipe(1, "myPurePipe"); + $r3$.ɵpipe(2, "myPipe"); + $r3$.ɵelementStart(3, "p"); + $r3$.ɵtext(4); + $r3$.ɵpipe(5, "myPipe"); + $r3$.ɵelementEnd(); + $r3$.ɵreserveSlots(15); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵi1("", $r3$.ɵpb2(1, 3, $r3$.ɵpb2(2, 6, ctx.name, ctx.size), ctx.size), "")); - $r3$.ɵt(4, $r3$.ɵi1("", $r3$.ɵpbV(5, 13 , $r3$.ɵf1(15, $c0$, ctx.name)), "")); + $r3$.ɵtextBinding(0, $r3$.ɵinterpolation1("", $r3$.ɵpipeBind2(1, 3, $r3$.ɵpipeBind2(2, 6, ctx.name, ctx.size), ctx.size), "")); + $r3$.ɵtextBinding(4, $r3$.ɵinterpolation1("", $r3$.ɵpipeBindV(5, 13 , $r3$.ɵpureFunction1(15, $c0$, ctx.name)), "")); } }, pipes: [MyPurePipe, MyPipe] @@ -1272,12 +1272,12 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "input", null, $c1$); - $r3$.ɵT(2); + $r3$.ɵelement(0, "input", null, $c1$); + $r3$.ɵtext(2); } if (rf & 2) { - const $user$ = $r3$.ɵr(1); - $r3$.ɵt(2, $r3$.ɵi1("Hello ", $user$.value, "!")); + const $user$ = $r3$.ɵreference(1); + $r3$.ɵtextBinding(2, $r3$.ɵinterpolation1("Hello ", $user$.value, "!")); } } }); @@ -1328,32 +1328,32 @@ describe('compiler compliance', () => { const $c4$ = ["bar", ""]; function MyComponent_div_span_Template_2(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "span"); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "span"); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵx(); - const $bar$ = $r3$.ɵr(4); - $r3$.ɵx(); - const $foo$ = $r3$.ɵr(1); - const $baz$ = $r3$.ɵr(5); - $r3$.ɵt(1, $r3$.ɵi3("", $foo$, "-", $bar$, "-", $baz$, "")); + $r3$.ɵnextContext(); + const $bar$ = $r3$.ɵreference(4); + $r3$.ɵnextContext(); + const $foo$ = $r3$.ɵreference(1); + const $baz$ = $r3$.ɵreference(5); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation3("", $foo$, "-", $bar$, "-", $baz$, "")); } } function MyComponent_div_Template_3(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵT(1); - $r3$.ɵC(2, MyComponent_div_span_Template_2, null, $c2$); - $r3$.ɵEe(3, "span", null, $c4$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵtext(1); + $r3$.ɵcontainer(2, MyComponent_div_span_Template_2, null, $c2$); + $r3$.ɵelement(3, "span", null, $c4$); + $r3$.ɵelementEnd(); } if (rf & 2) { - const $bar$ = $r3$.ɵr(4); - $r3$.ɵx(); - const $foo$ = $r3$.ɵr(1); - $r3$.ɵt(1, $r3$.ɵi2(" ", $foo$, "-", $bar$, " ")); + const $bar$ = $r3$.ɵreference(4); + $r3$.ɵnextContext(); + const $foo$ = $r3$.ɵreference(1); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation2(" ", $foo$, "-", $bar$, " ")); } } … @@ -1364,14 +1364,14 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "div", null, $c1$); - $r3$.ɵT(2); - $r3$.ɵC(3, MyComponent_div_Template_3, null, $c2$); - $r3$.ɵEe(4, "div", null, $c3$); + $r3$.ɵelement(0, "div", null, $c1$); + $r3$.ɵtext(2); + $r3$.ɵcontainer(3, MyComponent_div_Template_3, null, $c2$); + $r3$.ɵelement(4, "div", null, $c3$); } if (rf & 2) { - const $foo$ = $r3$.ɵr(1); - $r3$.ɵt(2, $r3$.ɵi1(" ", $foo$, " ")); + const $foo$ = $r3$.ɵreference(1); + $r3$.ɵtextBinding(2, $r3$.ɵinterpolation1(" ", $foo$, " ")); } }, directives:[IfDirective] @@ -1415,37 +1415,37 @@ describe('compiler compliance', () => { function MyComponent_div_span_Template_3(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "span"); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "span"); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $item$ = $i0$.ɵx().$implicit; - const $foo$ = $i0$.ɵr(2); - $i0$.ɵt(1, $i0$.ɵi2(" ", $foo$, " - ", $item$, " ")); + const $item$ = $i0$.ɵnextContext().$implicit; + const $foo$ = $i0$.ɵreference(2); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation2(" ", $foo$, " - ", $item$, " ")); } } function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵEe(1, "div", null, $c1$); - $i0$.ɵC(3, MyComponent_div_span_Template_3, null, $c2$); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵelement(1, "div", null, $c1$); + $i0$.ɵcontainer(3, MyComponent_div_span_Template_3, null, $c2$); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $app$ = $i0$.ɵx(); - $i0$.ɵp(3, "ngIf", $i0$.ɵb($app$.showing)); + const $app$ = $i0$.ɵnextContext(); + $i0$.ɵelementProperty(3, "ngIf", $i0$.ɵbind($app$.showing)); } } // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { - $i0$.ɵC(0, MyComponent_div_Template_0, null, $c0$); + $i0$.ɵcontainer(0, MyComponent_div_Template_0, null, $c0$); } if (rf & 2) { - $i0$.ɵp(0, "ngForOf", $i0$.ɵb(ctx.items)); + $i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items)); } }`; @@ -1517,12 +1517,12 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function SimpleLayout_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "lifecycle-comp"); - $r3$.ɵEe(1, "lifecycle-comp"); + $r3$.ɵelement(0, "lifecycle-comp"); + $r3$.ɵelement(1, "lifecycle-comp"); } if (rf & 2) { - $r3$.ɵp(0, "name", $r3$.ɵb(ctx.name1)); - $r3$.ɵp(1, "name", $r3$.ɵb(ctx.name2)); + $r3$.ɵelementProperty(0, "name", $r3$.ɵbind(ctx.name1)); + $r3$.ɵelementProperty(1, "name", $r3$.ɵbind(ctx.name2)); } }, directives: [LifecycleComp] @@ -1631,10 +1631,10 @@ describe('compiler compliance', () => { const $_c0$ = ["for","","forOf",""]; function MyComponent__svg_g_Template_1(rf, ctx) { if (rf & 1) { - $r3$.ɵNS(); - $r3$.ɵE(0,"g"); - $r3$.ɵEe(1,"circle"); - $r3$.ɵe(); + $r3$.ɵnamespaceSVG(); + $r3$.ɵelementStart(0,"g"); + $r3$.ɵelement(1,"circle"); + $r3$.ɵelementEnd(); } } … @@ -1645,12 +1645,12 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx){ if (rf & 1) { - $r3$.ɵNS(); - $r3$.ɵE(0,"svg"); - $r3$.ɵC(1,MyComponent__svg_g_Template_1,null,$_c0$); - $r3$.ɵe(); + $r3$.ɵnamespaceSVG(); + $r3$.ɵelementStart(0,"svg"); + $r3$.ɵcontainer(1,MyComponent__svg_g_Template_1,null,$_c0$); + $r3$.ɵelementEnd(); } - if (rf & 2) { $r3$.ɵp(1,"forOf",$r3$.ɵb(ctx.items)); } + if (rf & 2) { $r3$.ɵelementProperty(1,"forOf",$r3$.ɵbind(ctx.items)); } }, directives: function() { return [ForOfDirective]; } }); @@ -1705,13 +1705,13 @@ describe('compiler compliance', () => { const $_c0$ = ["for","","forOf",""]; function MyComponent_li_Template_1(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "li"); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "li"); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } if (rf & 2) { const $item$ = ctx.$implicit; - $r3$.ɵt(1, $r3$.ɵi1("", $item$.name, "")); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation1("", $item$.name, "")); } } … @@ -1722,12 +1722,12 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "ul"); - $r3$.ɵC(1, MyComponent_li_Template_1, null, $_c0$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "ul"); + $r3$.ɵcontainer(1, MyComponent_li_Template_1, null, $_c0$); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(1, "forOf", $r3$.ɵb(ctx.items)); + $r3$.ɵelementProperty(1, "forOf", $r3$.ɵbind(ctx.items)); } }, directives: function() { return [ForOfDirective]; } @@ -1783,32 +1783,32 @@ describe('compiler compliance', () => { const $c1$ = ["for", "", "forOf", ""]; function MyComponent_li_li_Template_4(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "li"); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "li"); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } if (rf & 2) { const $info$ = ctx.$implicit; - const $item$ = $r3$.ɵx().$implicit; - $r3$.ɵt(1, $r3$.ɵi2(" ", $item$.name, ": ", $info$.description, " ")); + const $item$ = $r3$.ɵnextContext().$implicit; + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation2(" ", $item$.name, ": ", $info$.description, " ")); } } function MyComponent_li_Template_1(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "li"); - $r3$.ɵE(1, "div"); - $r3$.ɵT(2); - $r3$.ɵe(); - $r3$.ɵE(3, "ul"); - $r3$.ɵC(4, MyComponent_li_li_Template_4, null, $c1$); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "li"); + $r3$.ɵelementStart(1, "div"); + $r3$.ɵtext(2); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(3, "ul"); + $r3$.ɵcontainer(4, MyComponent_li_li_Template_4, null, $c1$); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } if (rf & 2) { const $item$ = ctx.$implicit; - $r3$.ɵt(2, $r3$.ɵi1("", IDENT.name, "")); - $r3$.ɵp(4, "forOf", $r3$.ɵb(IDENT.infos)); + $r3$.ɵtextBinding(2, $r3$.ɵinterpolation1("", IDENT.name, "")); + $r3$.ɵelementProperty(4, "forOf", $r3$.ɵbind(IDENT.infos)); } } @@ -1820,12 +1820,12 @@ describe('compiler compliance', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "ul"); - $r3$.ɵC(1, MyComponent_li_Template_1, null, $c1$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "ul"); + $r3$.ɵcontainer(1, MyComponent_li_Template_1, null, $c1$); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(1, "forOf", $r3$.ɵb(ctx.items)); + $r3$.ɵelementProperty(1, "forOf", $r3$.ɵbind(ctx.items)); } }, directives: function () { return [ForOfDirective]; } diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts index 5dde3a2b3e..43235bbc61 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts @@ -39,12 +39,12 @@ describe('compiler compliance: bindings', () => { const template = ` template:function MyComponent_Template(rf, $ctx$){ if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { - $i0$.ɵt(1, $i0$.ɵi1("Hello ", $ctx$.name, "")); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation1("Hello ", $ctx$.name, "")); } }`; const result = compile(files, angularFiles); @@ -75,10 +75,10 @@ describe('compiler compliance: bindings', () => { const template = ` template:function MyComponent_Template(rf, $ctx$){ if (rf & 1) { - $i0$.ɵEe(0, "a"); + $i0$.ɵelement(0, "a"); } if (rf & 2) { - $i0$.ɵp(0, "title", $i0$.ɵb($ctx$.title)); + $i0$.ɵelementProperty(0, "title", $i0$.ɵbind($ctx$.title)); } }`; const result = compile(files, angularFiles); @@ -107,10 +107,10 @@ describe('compiler compliance: bindings', () => { const template = ` template:function MyComponent_Template(rf, $ctx$){ if (rf & 1) { - $i0$.ɵEe(0, "a"); + $i0$.ɵelement(0, "a"); } if (rf & 2) { - $i0$.ɵp(0, "title", $i0$.ɵi1("Hello ", $ctx$.name, "")); + $i0$.ɵelementProperty(0, "title", $i0$.ɵinterpolation1("Hello ", $ctx$.name, "")); } }`; const result = compile(files, angularFiles); diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts index 98884f56ea..2cd4bf2e55 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_i18n_spec.ts @@ -49,13 +49,13 @@ describe('i18n support in the view compiler', () => { template: function MyComponent_Template(rf, ctx) { if (rf & 1) { … - $r3$.ɵT(1, $msg_1$); + $r3$.ɵtext(1, $msg_1$); … - $r3$.ɵT(3,"&"); + $r3$.ɵtext(3,"&"); … - $r3$.ɵT(5, $msg_2$); + $r3$.ɵtext(5, $msg_2$); … - $r3$.ɵT(7, $msg_2$); + $r3$.ɵtext(7, $msg_2$); … } } @@ -103,9 +103,9 @@ describe('i18n support in the view compiler', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div", $c1$); - $r3$.ɵT(1, $msg_2$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div", $c1$); + $r3$.ɵtext(1, $msg_2$); + $r3$.ɵelementEnd(); } } `; @@ -148,7 +148,7 @@ describe('i18n support in the view compiler', () => { … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵEe(0, "div", $c1$); + $r3$.ɵelement(0, "div", $c1$); } } `; diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_listener_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_listener_spec.ts index 510e442918..4b2078d1c6 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_listener_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_listener_spec.ts @@ -43,12 +43,12 @@ describe('compiler compliance: listen()', () => { const template = ` template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵL("click", function MyComponent_Template_div_click_listener($event) { + $r3$.ɵelementStart(0, "div"); + $r3$.ɵlistener("click", function MyComponent_Template_div_click_listener($event) { ctx.onClick($event); return (1 == 2); }); - $r3$.ɵe(); + $r3$.ɵelementEnd(); } } `; @@ -90,32 +90,32 @@ describe('compiler compliance: listen()', () => { function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { - const $s$ = $r3$.ɵgV(); - $r3$.ɵE(0, "div"); - $r3$.ɵE(1, "div"); - $r3$.ɵL("click", function MyComponent_div_Template_0_div_click_listener($event) { - $r3$.ɵrV($s$); - const $comp$ = $r3$.ɵx(); + const $s$ = $r3$.ɵgetCurrentView(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStart(1, "div"); + $r3$.ɵlistener("click", function MyComponent_div_Template_0_div_click_listener($event) { + $r3$.ɵrestoreView($s$); + const $comp$ = $r3$.ɵnextContext(); return $comp$.onClick($comp$.foo); }); - $r3$.ɵe(); - $r3$.ɵE(2, "button"); - $r3$.ɵL("click", function MyComponent_div_Template_0_button_click_listener($event) { - $r3$.ɵrV($s$); - const $comp2$ = $r3$.ɵx(); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(2, "button"); + $r3$.ɵlistener("click", function MyComponent_div_Template_0_button_click_listener($event) { + $r3$.ɵrestoreView($s$); + const $comp2$ = $r3$.ɵnextContext(); return $comp2$.onClick2($comp2$.bar); }); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } } // ... template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵC(0, MyComponent_div_Template_0, null, $c0$); + $r3$.ɵcontainer(0, MyComponent_div_Template_0, null, $c0$); } if (rf & 2) { - $i0$.ɵp(0, "ngIf", $i0$.ɵb(ctx.showing)); + $i0$.ɵelementProperty(0, "ngIf", $i0$.ɵbind(ctx.showing)); } } `; @@ -156,14 +156,14 @@ describe('compiler compliance: listen()', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "button"); - $r3$.ɵL("click", function MyComponent_Template_button_click_listener($event) { - const $user$ = $r3$.ɵr(3); + $r3$.ɵelementStart(0, "button"); + $r3$.ɵlistener("click", function MyComponent_Template_button_click_listener($event) { + const $user$ = $r3$.ɵreference(3); return ctx.onClick($user$.value); }); - $r3$.ɵT(1, "Save"); - $r3$.ɵe(); - $r3$.ɵEe(2, "input", null, $c0$); + $r3$.ɵtext(1, "Save"); + $r3$.ɵelementEnd(); + $r3$.ɵelement(2, "input", null, $c0$); } } }); diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_spec.ts index de9d39af5c..013d28e5b9 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_spec.ts @@ -112,7 +112,8 @@ describe('r3_view_compiler', () => { } }; - const bV_call = `$r3$.ɵiV([" ",ctx.list[0]," ",ctx.list[1]," ",ctx.list[2]," ",ctx.list[3], + const bV_call = + `$r3$.ɵinterpolationV([" ",ctx.list[0]," ",ctx.list[1]," ",ctx.list[2]," ",ctx.list[3], " ",ctx.list[4]," ",ctx.list[5]," ",ctx.list[6]," ",ctx.list[7]," ",ctx.list[8], " "])`; const result = compile(files, angularFiles); diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_styling_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_styling_spec.ts index b645468be7..8ef0cfff8a 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_styling_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_styling_spec.ts @@ -42,13 +42,13 @@ describe('compiler compliance: styling', () => { const template = ` template: function MyComponent_Template(rf, $ctx$) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(null, null, $r3$.ɵzss); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(null, null, $r3$.ɵzss); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsm(0, null, $ctx$.myStyleExp); - $r3$.ɵsa(0); + $r3$.ɵelementStylingMap(0, null, $ctx$.myStyleExp); + $r3$.ɵelementStylingApply(0); } } `; @@ -96,16 +96,16 @@ describe('compiler compliance: styling', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, $ctx$) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(null, _c0, $r3$.ɵzss); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(null, _c0, $r3$.ɵzss); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsm(0, null, $ctx$.myStyleExp); - $r3$.ɵsp(0, 1, $ctx$.myWidth); - $r3$.ɵsp(0, 2, $ctx$.myHeight); - $r3$.ɵsa(0); - $r3$.ɵa(0, "style", $r3$.ɵb("border-width: 10px"), $r3$.ɵzs); + $r3$.ɵelementStylingMap(0, null, $ctx$.myStyleExp); + $r3$.ɵelementStylingProp(0, 1, $ctx$.myWidth); + $r3$.ɵelementStylingProp(0, 2, $ctx$.myHeight); + $r3$.ɵelementStylingApply(0); + $r3$.ɵelementAttribute(0, "style", $r3$.ɵbind("border-width: 10px"), $r3$.ɵzs); } } }); @@ -153,13 +153,13 @@ describe('compiler compliance: styling', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(null, _c0, $r3$.ɵzss); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(null, _c0, $r3$.ɵzss); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsp(0, 0, ctx.myImage); - $r3$.ɵsa(0); + $r3$.ɵelementStylingProp(0, 0, ctx.myImage); + $r3$.ɵelementStylingApply(0); } } }); @@ -194,13 +194,13 @@ describe('compiler compliance: styling', () => { const template = ` template: function MyComponent_Template(rf, $ctx$) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsm(0,$ctx$.myClassExp); - $r3$.ɵsa(0); + $r3$.ɵelementStylingMap(0,$ctx$.myClassExp); + $r3$.ɵelementStylingApply(0); } } `; @@ -248,16 +248,16 @@ describe('compiler compliance: styling', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, $ctx$) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(_c0); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(_c0); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsm(0, $ctx$.myClassExp); - $r3$.ɵcp(0, 1, $ctx$.yesToApple); - $r3$.ɵcp(0, 2, $ctx$.yesToOrange); - $r3$.ɵsa(0); - $r3$.ɵa(0, "class", $r3$.ɵb("banana")); + $r3$.ɵelementStylingMap(0, $ctx$.myClassExp); + $r3$.ɵelementClassProp(0, 1, $ctx$.yesToApple); + $r3$.ɵelementClassProp(0, 2, $ctx$.yesToOrange); + $r3$.ɵelementStylingApply(0); + $r3$.ɵelementAttribute(0, "class", $r3$.ɵbind("banana")); } } }); @@ -302,13 +302,13 @@ describe('compiler compliance: styling', () => { features: [$r3$.ɵPublicFeature], template: function MyComponent_Template(rf, $ctx$) { if (rf & 1) { - $r3$.ɵE(0, "div"); - $r3$.ɵs(_c0, _c1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, "div"); + $r3$.ɵelementStyling(_c0, _c1); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵa(0, "class", $r3$.ɵb("round")); - $r3$.ɵa(0, "style", $r3$.ɵb("height:100px"), $r3$.ɵzs); + $r3$.ɵelementAttribute(0, "class", $r3$.ɵbind("round")); + $r3$.ɵelementAttribute(0, "style", $r3$.ɵbind("height:100px"), $r3$.ɵzs); } } }); diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts index 0d4c884a3e..72684fa503 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts @@ -54,60 +54,60 @@ describe('compiler compliance: template', () => { function MyComponent_ul_li_div_Template_1(rf, ctx) { if (rf & 1) { - const $s$ = $i0$.ɵgV(); - $i0$.ɵE(0, "div"); - $i0$.ɵL("click", function MyComponent_ul_li_div_Template_1_div_click_listener($event){ - $i0$.ɵrV($s$); + const $s$ = $i0$.ɵgetCurrentView(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵlistener("click", function MyComponent_ul_li_div_Template_1_div_click_listener($event){ + $i0$.ɵrestoreView($s$); const $inner$ = ctx.$implicit; - const $middle$ = $i0$.ɵx().$implicit; - const $outer$ = $i0$.ɵx().$implicit; - const $myComp$ = $i0$.ɵx(); + const $middle$ = $i0$.ɵnextContext().$implicit; + const $outer$ = $i0$.ɵnextContext().$implicit; + const $myComp$ = $i0$.ɵnextContext(); return $myComp$.onClick($outer$, $middle$, $inner$); }); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { const $inner1$ = ctx.$implicit; - const $middle1$ = $i0$.ɵx().$implicit; - const $outer1$ = $i0$.ɵx().$implicit; - const $myComp1$ = $i0$.ɵx(); - $i0$.ɵp(0, "title", $i0$.ɵb($myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component))); - $i0$.ɵt(1, $i0$.ɵi1(" ", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component), " ")); + const $middle1$ = $i0$.ɵnextContext().$implicit; + const $outer1$ = $i0$.ɵnextContext().$implicit; + const $myComp1$ = $i0$.ɵnextContext(); + $i0$.ɵelementProperty(0, "title", $i0$.ɵbind($myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component))); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation1(" ", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component), " ")); } } function MyComponent_ul_li_Template_1(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "li"); - $i0$.ɵC(1, MyComponent_ul_li_div_Template_1, null, _c0); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "li"); + $i0$.ɵcontainer(1, MyComponent_ul_li_div_Template_1, null, _c0); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $myComp2$ = $i0$.ɵx(2); - $i0$.ɵp(1, "ngForOf", $i0$.ɵb($myComp2$.items)); + const $myComp2$ = $i0$.ɵnextContext(2); + $i0$.ɵelementProperty(1, "ngForOf", $i0$.ɵbind($myComp2$.items)); } } function MyComponent_ul_Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "ul"); - $i0$.ɵC(1, MyComponent_ul_li_Template_1, null, _c0); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "ul"); + $i0$.ɵcontainer(1, MyComponent_ul_li_Template_1, null, _c0); + $i0$.ɵelementEnd(); } if (rf & 2) { const $outer2$ = ctx.$implicit; - $i0$.ɵp(1, "ngForOf", $i0$.ɵb($outer2$.items)); + $i0$.ɵelementProperty(1, "ngForOf", $i0$.ɵbind($outer2$.items)); } } // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { - $i0$.ɵC(0, MyComponent_ul_Template_0, null, _c0); + $i0$.ɵcontainer(0, MyComponent_ul_Template_0, null, _c0); } if (rf & 2) { - $i0$.ɵp(0, "ngForOf", $i0$.ɵb(ctx.items)); + $i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items)); } }`; @@ -142,23 +142,23 @@ describe('compiler compliance: template', () => { function MyComponent_span_Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "span"); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "span"); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { const $item$ = ctx.$implicit; const $i$ = ctx.index; - $i0$.ɵt(1, $i0$.ɵi2(" ", $i$, " - ", $item$, " ")); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation2(" ", $i$, " - ", $item$, " ")); } } // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { - $i0$.ɵC(0, MyComponent_span_Template_0, null, _c0); + $i0$.ɵcontainer(0, MyComponent_span_Template_0, null, _c0); } if (rf & 2) { - $i0$.ɵp(0, "ngForOf", $i0$.ɵb(ctx.items)); + $i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items)); } }`; @@ -196,37 +196,37 @@ describe('compiler compliance: template', () => { function MyComponent_div_span_Template_1(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "span"); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "span"); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $div$ = $i0$.ɵx(); + const $div$ = $i0$.ɵnextContext(); const $i$ = $div$.index; const $item$ = $div$.$implicit; - $i0$.ɵt(1, $i0$.ɵi2(" ", $i$, " - ", $item$, " ")); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation2(" ", $i$, " - ", $item$, " ")); } } function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵC(1, MyComponent_div_span_Template_1, null, $c1$); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵcontainer(1, MyComponent_div_span_Template_1, null, $c1$); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $app$ = $i0$.ɵx(); - $i0$.ɵp(1, "ngIf", $i0$.ɵb($app$.showing)); + const $app$ = $i0$.ɵnextContext(); + $i0$.ɵelementProperty(1, "ngIf", $i0$.ɵbind($app$.showing)); } } // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { - $i0$.ɵC(0, MyComponent_div_Template_0, null, $c0$); + $i0$.ɵcontainer(0, MyComponent_div_Template_0, null, $c0$); } if (rf & 2) { - $i0$.ɵp(0, "ngForOf", $i0$.ɵb(ctx.items)); + $i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items)); } }`; @@ -265,47 +265,47 @@ describe('compiler compliance: template', () => { const $c0$ = ["ngFor", "", "ngForOf", ""]; function MyComponent_div_div_div_Template_1(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵT(1); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵtext(1); + $i0$.ɵelementEnd(); } if (rf & 2) { - const $middle$ = $i0$.ɵx().$implicit; - const $myComp$ = $i0$.ɵx(2); - $i0$.ɵt(1, $i0$.ɵi2(" ", $middle$.value, " - ", $myComp$.name, " ")); + const $middle$ = $i0$.ɵnextContext().$implicit; + const $myComp$ = $i0$.ɵnextContext(2); + $i0$.ɵtextBinding(1, $i0$.ɵinterpolation2(" ", $middle$.value, " - ", $myComp$.name, " ")); } } function MyComponent_div_div_Template_1(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵC(1, MyComponent_div_div_div_Template_1, null, _c0); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵcontainer(1, MyComponent_div_div_div_Template_1, null, _c0); + $i0$.ɵelementEnd(); } if (rf & 2) { const $middle$ = ctx.$implicit; - $i0$.ɵp(1, "ngForOf", $i0$.ɵb($middle$.items)); + $i0$.ɵelementProperty(1, "ngForOf", $i0$.ɵbind($middle$.items)); } } function MyComponent_div_Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵE(0, "div"); - $i0$.ɵC(1, MyComponent_div_div_Template_1, null, _c0); - $i0$.ɵe(); + $i0$.ɵelementStart(0, "div"); + $i0$.ɵcontainer(1, MyComponent_div_div_Template_1, null, _c0); + $i0$.ɵelementEnd(); } if (rf & 2) { const $outer$ = ctx.$implicit; - $i0$.ɵp(1, "ngForOf", $i0$.ɵb($outer$.items)); + $i0$.ɵelementProperty(1, "ngForOf", $i0$.ɵbind($outer$.items)); } } // ... template:function MyComponent_Template(rf, ctx){ if (rf & 1) { - $i0$.ɵC(0, MyComponent_div_Template_0, null, _c0); + $i0$.ɵcontainer(0, MyComponent_div_Template_0, null, _c0); } if (rf & 2) { - $i0$.ɵp(0, "ngForOf", $i0$.ɵb(ctx.items)); + $i0$.ɵelementProperty(0, "ngForOf", $i0$.ɵbind(ctx.items)); } }`; @@ -340,7 +340,7 @@ describe('compiler compliance: template', () => { function Template_0(rf, ctx) { if (rf & 1) { - $i0$.ɵT(0, " some-content "); + $i0$.ɵtext(0, " some-content "); } } @@ -348,10 +348,10 @@ describe('compiler compliance: template', () => { template: function MyComponent_Template(rf, ctx) { if (rf & 1) { - $i0$.ɵC(0, Template_0, null, $c0$); + $i0$.ɵcontainer(0, Template_0, null, $c0$); } if (rf & 2) { - $i0$.ɵp(0, "boundAttr", $i0$.ɵb(ctx.b)); + $i0$.ɵelementProperty(0, "boundAttr", $i0$.ɵbind(ctx.b)); } }`; diff --git a/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts b/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts index 1ea954a64b..c27411238b 100644 --- a/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts +++ b/packages/compiler-cli/test/ngtsc/ngtsc_spec.ts @@ -502,11 +502,11 @@ describe('ngtsc behavioral tests', () => { expect(errorSpy).not.toHaveBeenCalled(); expect(exitCode).toBe(0); const jsContents = getContents('test.js'); - expect(jsContents).toContain(`i0.ɵQ(null, ["bar"], true, TemplateRef)`); - expect(jsContents).toContain(`i0.ɵQ(null, TemplateRef, false)`); - expect(jsContents).toContain(`i0.ɵQ(null, ["test2"], true)`); - expect(jsContents).toContain(`i0.ɵQ(0, ["accessor"], true)`); - expect(jsContents).toContain(`i0.ɵQ(1, ["test1"], true)`); + expect(jsContents).toContain(`i0.ɵquery(null, ["bar"], true, TemplateRef)`); + expect(jsContents).toContain(`i0.ɵquery(null, TemplateRef, false)`); + expect(jsContents).toContain(`i0.ɵquery(null, ["test2"], true)`); + expect(jsContents).toContain(`i0.ɵquery(0, ["accessor"], true)`); + expect(jsContents).toContain(`i0.ɵquery(1, ["test1"], true)`); }); it('should handle queries that use forwardRef', () => { @@ -529,8 +529,8 @@ describe('ngtsc behavioral tests', () => { expect(errorSpy).not.toHaveBeenCalled(); expect(exitCode).toBe(0); const jsContents = getContents('test.js'); - expect(jsContents).toContain(`i0.ɵQ(null, TemplateRef, true)`); - expect(jsContents).toContain(`i0.ɵQ(null, ViewContainerRef, true)`); + expect(jsContents).toContain(`i0.ɵquery(null, TemplateRef, true)`); + expect(jsContents).toContain(`i0.ɵquery(null, ViewContainerRef, true)`); }); it('should generate host bindings for directives', () => { @@ -562,12 +562,18 @@ describe('ngtsc behavioral tests', () => { expect(errorSpy).not.toHaveBeenCalled(); expect(exitCode).toBe(0); const jsContents = getContents('test.js'); - expect(jsContents).toContain(`i0.ɵp(elIndex, "attr.hello", i0.ɵb(i0.ɵd(dirIndex).foo));`); - expect(jsContents).toContain(`i0.ɵp(elIndex, "prop", i0.ɵb(i0.ɵd(dirIndex).bar));`); expect(jsContents) - .toContain('i0.ɵp(elIndex, "class.someclass", i0.ɵb(i0.ɵd(dirIndex).someClass))'); - expect(jsContents).toContain('i0.ɵd(dirIndex).onClick($event)'); - expect(jsContents).toContain('i0.ɵd(dirIndex).onChange(i0.ɵd(dirIndex).arg)'); + .toContain( + `i0.ɵelementProperty(elIndex, "attr.hello", i0.ɵbind(i0.ɵloadDirective(dirIndex).foo));`); + expect(jsContents) + .toContain( + `i0.ɵelementProperty(elIndex, "prop", i0.ɵbind(i0.ɵloadDirective(dirIndex).bar));`); + expect(jsContents) + .toContain( + 'i0.ɵelementProperty(elIndex, "class.someclass", i0.ɵbind(i0.ɵloadDirective(dirIndex).someClass))'); + expect(jsContents).toContain('i0.ɵloadDirective(dirIndex).onClick($event)'); + expect(jsContents) + .toContain('i0.ɵloadDirective(dirIndex).onChange(i0.ɵloadDirective(dirIndex).arg)'); }); it('should correctly recognize local symbols', () => { diff --git a/packages/compiler/design/architecture.md b/packages/compiler/design/architecture.md index 396e0dcfec..9c140c6ffd 100644 --- a/packages/compiler/design/architecture.md +++ b/packages/compiler/design/architecture.md @@ -87,12 +87,12 @@ GreetComponent.ngComponentDef = i0.ɵdefineComponent({ factory: () => new GreetComponent(), template: function (rf, ctx) { if (rf & RenderFlags.Create) { - i0.ɵE(0, 'div'); - i0.ɵT(1); - i0.ɵe(); + i0.ɵelementStart(0, 'div'); + i0.ɵtext(1); + i0.ɵelementEnd(); } if (rf & RenderFlags.Update) { - i0.ɵt(1, i0.ɵi1('Hello ', ctx.name, '!')); + i0.ɵtextBinding(1, i0.ɵinterpolation1('Hello ', ctx.name, '!')); } } }); diff --git a/packages/compiler/src/render3/r3_identifiers.ts b/packages/compiler/src/render3/r3_identifiers.ts index b18f49bd99..7277aadb60 100644 --- a/packages/compiler/src/render3/r3_identifiers.ts +++ b/packages/compiler/src/render3/r3_identifiers.ts @@ -17,87 +17,88 @@ export class Identifiers { static PATCH_DEPS = 'patchedDeps'; /* Instructions */ - static namespaceHTML: o.ExternalReference = {name: 'ɵNH', moduleName: CORE}; + static namespaceHTML: o.ExternalReference = {name: 'ɵnamespaceHTML', moduleName: CORE}; - static namespaceMathML: o.ExternalReference = {name: 'ɵNM', moduleName: CORE}; + static namespaceMathML: o.ExternalReference = {name: 'ɵnamespaceMathML', moduleName: CORE}; - static namespaceSVG: o.ExternalReference = {name: 'ɵNS', moduleName: CORE}; + static namespaceSVG: o.ExternalReference = {name: 'ɵnamespaceSVG', moduleName: CORE}; - static element: o.ExternalReference = {name: 'ɵEe', moduleName: CORE}; + static element: o.ExternalReference = {name: 'ɵelement', moduleName: CORE}; - static elementStart: o.ExternalReference = {name: 'ɵE', moduleName: CORE}; + static elementStart: o.ExternalReference = {name: 'ɵelementStart', moduleName: CORE}; - static elementEnd: o.ExternalReference = {name: 'ɵe', moduleName: CORE}; + static elementEnd: o.ExternalReference = {name: 'ɵelementEnd', moduleName: CORE}; - static elementProperty: o.ExternalReference = {name: 'ɵp', moduleName: CORE}; + static elementProperty: o.ExternalReference = {name: 'ɵelementProperty', moduleName: CORE}; - static elementAttribute: o.ExternalReference = {name: 'ɵa', moduleName: CORE}; + static elementAttribute: o.ExternalReference = {name: 'ɵelementAttribute', moduleName: CORE}; - static elementClassProp: o.ExternalReference = {name: 'ɵcp', moduleName: CORE}; + static elementClassProp: o.ExternalReference = {name: 'ɵelementClassProp', moduleName: CORE}; static elementContainerStart: o.ExternalReference = {name: 'ɵEC', moduleName: CORE}; static elementContainerEnd: o.ExternalReference = {name: 'ɵeC', moduleName: CORE}; - static elementStyling: o.ExternalReference = {name: 'ɵs', moduleName: CORE}; + static elementStyling: o.ExternalReference = {name: 'ɵelementStyling', moduleName: CORE}; - static elementStylingMap: o.ExternalReference = {name: 'ɵsm', moduleName: CORE}; + static elementStylingMap: o.ExternalReference = {name: 'ɵelementStylingMap', moduleName: CORE}; - static elementStyleProp: o.ExternalReference = {name: 'ɵsp', moduleName: CORE}; + static elementStyleProp: o.ExternalReference = {name: 'ɵelementStylingProp', moduleName: CORE}; - static elementStylingApply: o.ExternalReference = {name: 'ɵsa', moduleName: CORE}; + static elementStylingApply: + o.ExternalReference = {name: 'ɵelementStylingApply', moduleName: CORE}; - static containerCreate: o.ExternalReference = {name: 'ɵC', moduleName: CORE}; + static containerCreate: o.ExternalReference = {name: 'ɵcontainer', moduleName: CORE}; - static nextContext: o.ExternalReference = {name: 'ɵx', moduleName: CORE}; + static nextContext: o.ExternalReference = {name: 'ɵnextContext', moduleName: CORE}; - static text: o.ExternalReference = {name: 'ɵT', moduleName: CORE}; + static text: o.ExternalReference = {name: 'ɵtext', moduleName: CORE}; - static textBinding: o.ExternalReference = {name: 'ɵt', moduleName: CORE}; + static textBinding: o.ExternalReference = {name: 'ɵtextBinding', moduleName: CORE}; - static bind: o.ExternalReference = {name: 'ɵb', moduleName: CORE}; + static bind: o.ExternalReference = {name: 'ɵbind', moduleName: CORE}; - static getCurrentView: o.ExternalReference = {name: 'ɵgV', moduleName: CORE}; + static getCurrentView: o.ExternalReference = {name: 'ɵgetCurrentView', moduleName: CORE}; - static restoreView: o.ExternalReference = {name: 'ɵrV', moduleName: CORE}; + static restoreView: o.ExternalReference = {name: 'ɵrestoreView', moduleName: CORE}; - static interpolation1: o.ExternalReference = {name: 'ɵi1', moduleName: CORE}; - static interpolation2: o.ExternalReference = {name: 'ɵi2', moduleName: CORE}; - static interpolation3: o.ExternalReference = {name: 'ɵi3', moduleName: CORE}; - static interpolation4: o.ExternalReference = {name: 'ɵi4', moduleName: CORE}; - static interpolation5: o.ExternalReference = {name: 'ɵi5', moduleName: CORE}; - static interpolation6: o.ExternalReference = {name: 'ɵi6', moduleName: CORE}; - static interpolation7: o.ExternalReference = {name: 'ɵi7', moduleName: CORE}; - static interpolation8: o.ExternalReference = {name: 'ɵi8', moduleName: CORE}; - static interpolationV: o.ExternalReference = {name: 'ɵiV', moduleName: CORE}; + static interpolation1: o.ExternalReference = {name: 'ɵinterpolation1', moduleName: CORE}; + static interpolation2: o.ExternalReference = {name: 'ɵinterpolation2', moduleName: CORE}; + static interpolation3: o.ExternalReference = {name: 'ɵinterpolation3', moduleName: CORE}; + static interpolation4: o.ExternalReference = {name: 'ɵinterpolation4', moduleName: CORE}; + static interpolation5: o.ExternalReference = {name: 'ɵinterpolation5', moduleName: CORE}; + static interpolation6: o.ExternalReference = {name: 'ɵinterpolation6', moduleName: CORE}; + static interpolation7: o.ExternalReference = {name: 'ɵinterpolation7', moduleName: CORE}; + static interpolation8: o.ExternalReference = {name: 'ɵinterpolation8', moduleName: CORE}; + static interpolationV: o.ExternalReference = {name: 'ɵinterpolationV', moduleName: CORE}; - static pureFunction0: o.ExternalReference = {name: 'ɵf0', moduleName: CORE}; - static pureFunction1: o.ExternalReference = {name: 'ɵf1', moduleName: CORE}; - static pureFunction2: o.ExternalReference = {name: 'ɵf2', moduleName: CORE}; - static pureFunction3: o.ExternalReference = {name: 'ɵf3', moduleName: CORE}; - static pureFunction4: o.ExternalReference = {name: 'ɵf4', moduleName: CORE}; - static pureFunction5: o.ExternalReference = {name: 'ɵf5', moduleName: CORE}; - static pureFunction6: o.ExternalReference = {name: 'ɵf6', moduleName: CORE}; - static pureFunction7: o.ExternalReference = {name: 'ɵf7', moduleName: CORE}; - static pureFunction8: o.ExternalReference = {name: 'ɵf8', moduleName: CORE}; - static pureFunctionV: o.ExternalReference = {name: 'ɵfV', moduleName: CORE}; + static pureFunction0: o.ExternalReference = {name: 'ɵpureFunction0', moduleName: CORE}; + static pureFunction1: o.ExternalReference = {name: 'ɵpureFunction1', moduleName: CORE}; + static pureFunction2: o.ExternalReference = {name: 'ɵpureFunction2', moduleName: CORE}; + static pureFunction3: o.ExternalReference = {name: 'ɵpureFunction3', moduleName: CORE}; + static pureFunction4: o.ExternalReference = {name: 'ɵpureFunction4', moduleName: CORE}; + static pureFunction5: o.ExternalReference = {name: 'ɵpureFunction5', moduleName: CORE}; + static pureFunction6: o.ExternalReference = {name: 'ɵpureFunction6', moduleName: CORE}; + static pureFunction7: o.ExternalReference = {name: 'ɵpureFunction7', moduleName: CORE}; + static pureFunction8: o.ExternalReference = {name: 'ɵpureFunction8', moduleName: CORE}; + static pureFunctionV: o.ExternalReference = {name: 'ɵpureFunctionV', moduleName: CORE}; - static pipeBind1: o.ExternalReference = {name: 'ɵpb1', moduleName: CORE}; - static pipeBind2: o.ExternalReference = {name: 'ɵpb2', moduleName: CORE}; - static pipeBind3: o.ExternalReference = {name: 'ɵpb3', moduleName: CORE}; - static pipeBind4: o.ExternalReference = {name: 'ɵpb4', moduleName: CORE}; - static pipeBindV: o.ExternalReference = {name: 'ɵpbV', moduleName: CORE}; + static pipeBind1: o.ExternalReference = {name: 'ɵpipeBind1', moduleName: CORE}; + static pipeBind2: o.ExternalReference = {name: 'ɵpipeBind2', moduleName: CORE}; + static pipeBind3: o.ExternalReference = {name: 'ɵpipeBind3', moduleName: CORE}; + static pipeBind4: o.ExternalReference = {name: 'ɵpipeBind4', moduleName: CORE}; + static pipeBindV: o.ExternalReference = {name: 'ɵpipeBindV', moduleName: CORE}; - static load: o.ExternalReference = {name: 'ɵld', moduleName: CORE}; - static loadDirective: o.ExternalReference = {name: 'ɵd', moduleName: CORE}; - static loadQueryList: o.ExternalReference = {name: 'ɵql', moduleName: CORE}; + static load: o.ExternalReference = {name: 'ɵload', moduleName: CORE}; + static loadDirective: o.ExternalReference = {name: 'ɵloadDirective', moduleName: CORE}; + static loadQueryList: o.ExternalReference = {name: 'ɵloadQueryList', moduleName: CORE}; - static pipe: o.ExternalReference = {name: 'ɵPp', moduleName: CORE}; + static pipe: o.ExternalReference = {name: 'ɵpipe', moduleName: CORE}; - static projection: o.ExternalReference = {name: 'ɵP', moduleName: CORE}; - static projectionDef: o.ExternalReference = {name: 'ɵpD', moduleName: CORE}; + static projection: o.ExternalReference = {name: 'ɵprojection', moduleName: CORE}; + static projectionDef: o.ExternalReference = {name: 'ɵprojectionDef', moduleName: CORE}; - static reference: o.ExternalReference = {name: 'ɵr', moduleName: CORE}; + static reference: o.ExternalReference = {name: 'ɵreference', moduleName: CORE}; static inject: o.ExternalReference = {name: 'inject', moduleName: CORE}; @@ -160,9 +161,10 @@ export class Identifiers { static definePipe: o.ExternalReference = {name: 'ɵdefinePipe', moduleName: CORE}; - static query: o.ExternalReference = {name: 'ɵQ', moduleName: CORE}; - static queryRefresh: o.ExternalReference = {name: 'ɵqR', moduleName: CORE}; - static registerContentQuery: o.ExternalReference = {name: 'ɵQr', moduleName: CORE}; + static query: o.ExternalReference = {name: 'ɵquery', moduleName: CORE}; + static queryRefresh: o.ExternalReference = {name: 'ɵqueryRefresh', moduleName: CORE}; + static registerContentQuery: + o.ExternalReference = {name: 'ɵregisterContentQuery', moduleName: CORE}; static NgOnChangesFeature: o.ExternalReference = {name: 'ɵNgOnChangesFeature', moduleName: CORE}; @@ -171,7 +173,7 @@ export class Identifiers { static PublicFeature: o.ExternalReference = {name: 'ɵPublicFeature', moduleName: CORE}; - static listener: o.ExternalReference = {name: 'ɵL', moduleName: CORE}; + static listener: o.ExternalReference = {name: 'ɵlistener', moduleName: CORE}; static getFactoryOf: o.ExternalReference = { name: 'ɵgetFactoryOf', @@ -184,7 +186,7 @@ export class Identifiers { }; // Reserve slots for pure functions - static reserveSlots: o.ExternalReference = {name: 'ɵrS', moduleName: CORE}; + static reserveSlots: o.ExternalReference = {name: 'ɵreserveSlots', moduleName: CORE}; // sanitization-related functions static sanitizeHtml: o.ExternalReference = {name: 'ɵzh', moduleName: CORE}; diff --git a/packages/compiler/src/render3/view/compiler.ts b/packages/compiler/src/render3/view/compiler.ts index 950b366964..2615cda505 100644 --- a/packages/compiler/src/render3/view/compiler.ts +++ b/packages/compiler/src/render3/view/compiler.ts @@ -436,7 +436,7 @@ function createContentQueriesRefreshFunction(meta: R3DirectiveMetadata): o.Expre // var $tmp$: any; const temporary = temporaryAllocator(statements, TEMPORARY_NAME); - // const $instance$ = $r3$.ɵd(dirIndex); + // const $instance$ = $r3$.ɵloadDirective(dirIndex); statements.push( directiveInstanceVar.set(o.importExpr(R3.loadDirective).callFn([o.variable('dirIndex')])) .toDeclStmt(o.INFERRED_TYPE, [o.StmtModifier.Final])); @@ -478,7 +478,7 @@ function createViewQueriesFunction( const queryDefinition = createQueryDefinition(query, constantPool, i); createStatements.push(queryDefinition.toStmt()); - // update, e.g. (r3.qR(tmp = r3.ɵld(0)) && (ctx.someDir = tmp)); + // update, e.g. (r3.qR(tmp = r3.ɵload(0)) && (ctx.someDir = tmp)); const temporary = tempAllocator(); const getQueryList = o.importExpr(R3.load).callFn([o.literal(i)]); const refresh = o.importExpr(R3.queryRefresh).callFn([temporary.set(getQueryList)]); diff --git a/packages/compiler/src/render3/view/template.ts b/packages/compiler/src/render3/view/template.ts index be1add72d9..4c54c2ce78 100644 --- a/packages/compiler/src/render3/view/template.ts +++ b/packages/compiler/src/render3/view/template.ts @@ -731,7 +731,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver this.creationInstruction( template.sourceSpan, R3.containerCreate, trimTrailingNulls(parameters)); - // e.g. p(1, 'forOf', ɵb(ctx.items)); + // e.g. p(1, 'forOf', ɵbind(ctx.items)); const context = o.variable(CONTEXT_NAME); template.inputs.forEach(input => { const value = input.value.visit(this._valueConverter); @@ -792,7 +792,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver // * @meaning mean // */ // const MSG_XYZ = goog.getMsg('some content'); - // i0.ɵT(1, MSG_XYZ); + // i0.ɵtext(1, MSG_XYZ); // ``` visitSingleI18nTextChild(text: t.Text, i18nMeta: string) { const meta = parseI18nMeta(i18nMeta); diff --git a/packages/core/src/core_render3_private_export.ts b/packages/core/src/core_render3_private_export.ts index 72c7085e49..84fb3f859e 100644 --- a/packages/core/src/core_render3_private_export.ts +++ b/packages/core/src/core_render3_private_export.ts @@ -36,86 +36,86 @@ export { CssSelectorList as ɵCssSelectorList, markDirty as ɵmarkDirty, NgModuleFactory as ɵNgModuleFactory, - NC as ɵNC, - C as ɵC, - x as ɵx, - E as ɵE, - NH as ɵNH, - NM as ɵNM, - NS as ɵNS, - Ee as ɵEe, - L as ɵL, - T as ɵT, - V as ɵV, - Q as ɵQ, - Qr as ɵQr, - d as ɵd, - P as ɵP, - b as ɵb, - i1 as ɵi1, - i2 as ɵi2, - i3 as ɵi3, - i4 as ɵi4, - i5 as ɵi5, - i6 as ɵi6, - i7 as ɵi7, - i8 as ɵi8, - iV as ɵiV, - pb1 as ɵpb1, - pb2 as ɵpb2, - pb3 as ɵpb3, - pb4 as ɵpb4, - pbV as ɵpbV, - f0 as ɵf0, - f1 as ɵf1, - f2 as ɵf2, - f3 as ɵf3, - f4 as ɵf4, - f5 as ɵf5, - f6 as ɵf6, - f7 as ɵf7, - f8 as ɵf8, - fV as ɵfV, - gV as ɵgV, - rV as ɵrV, - cR as ɵcR, - cr as ɵcr, - qR as ɵqR, - ql as ɵql, - e as ɵe, - p as ɵp, - pD as ɵpD, - r as ɵr, - rS as ɵrS, - a as ɵa, - s as ɵs, - sm as ɵsm, - sp as ɵsp, - sa as ɵsa, - cp as ɵcp, - t as ɵt, - v as ɵv, - st as ɵst, - ld as ɵld, - Pp as ɵPp, + NO_CHANGE as ɵNO_CHANGE, + container as ɵcontainer, + nextContext as ɵnextContext, + elementStart as ɵelementStart, + namespaceHTML as ɵnamespaceHTML, + namespaceMathML as ɵnamespaceMathML, + namespaceSVG as ɵnamespaceSVG, + element as ɵelement, + listener as ɵlistener, + text as ɵtext, + embeddedViewStart as ɵembeddedViewStart, + query as ɵquery, + registerContentQuery as ɵregisterContentQuery, + loadDirective as ɵloadDirective, + projection as ɵprojection, + bind as ɵbind, + interpolation1 as ɵinterpolation1, + interpolation2 as ɵinterpolation2, + interpolation3 as ɵinterpolation3, + interpolation4 as ɵinterpolation4, + interpolation5 as ɵinterpolation5, + interpolation6 as ɵinterpolation6, + interpolation7 as ɵinterpolation7, + interpolation8 as ɵinterpolation8, + interpolationV as ɵinterpolationV, + pipeBind1 as ɵpipeBind1, + pipeBind2 as ɵpipeBind2, + pipeBind3 as ɵpipeBind3, + pipeBind4 as ɵpipeBind4, + pipeBindV as ɵpipeBindV, + pureFunction0 as ɵpureFunction0, + pureFunction1 as ɵpureFunction1, + pureFunction2 as ɵpureFunction2, + pureFunction3 as ɵpureFunction3, + pureFunction4 as ɵpureFunction4, + pureFunction5 as ɵpureFunction5, + pureFunction6 as ɵpureFunction6, + pureFunction7 as ɵpureFunction7, + pureFunction8 as ɵpureFunction8, + pureFunctionV as ɵpureFunctionV, + getCurrentView as ɵgetCurrentView, + restoreView as ɵrestoreView, + containerRefreshStart as ɵcontainerRefreshStart, + containerRefreshEnd as ɵcontainerRefreshEnd, + queryRefresh as ɵqueryRefresh, + loadQueryList as ɵloadQueryList, + elementEnd as ɵelementEnd, + elementProperty as ɵelementProperty, + projectionDef as ɵprojectionDef, + reference as ɵreference, + reserveSlots as ɵreserveSlots, + elementAttribute as ɵelementAttribute, + elementStyling as ɵelementStyling, + elementStylingMap as ɵelementStylingMap, + elementStyleProp as ɵelementStylingProp, + elementStylingApply as ɵelementStylingApply, + elementClassProp as ɵelementClassProp, + textBinding as ɵtextBinding, + embeddedViewEnd as ɵembeddedViewEnd, + store as ɵstore, + load as ɵload, + pipe as ɵpipe, BaseDef as ɵBaseDef, ComponentDef as ɵComponentDef, ComponentDefInternal as ɵComponentDefInternal, DirectiveDef as ɵDirectiveDef, PipeDef as ɵPipeDef, whenRendered as ɵwhenRendered, - iA as ɵiA, - iEM as ɵiEM, - iI1 as ɵiI1, - iI2 as ɵiI2, - iI3 as ɵiI3, - iI4 as ɵiI4, - iI5 as ɵiI5, - iI6 as ɵiI6, - iI7 as ɵiI7, - iI8 as ɵiI8, - iIV as ɵIV, - iM as ɵiM, + i18nApply as ɵi18nApply, + i18nExpMapping as ɵi18nExpMapping, + i18nInterpolation1 as ɵi18nInterpolation1, + i18nInterpolation2 as ɵi18nInterpolation2, + i18nInterpolation3 as ɵi18nInterpolation3, + i18nInterpolation4 as ɵi18nInterpolation4, + i18nInterpolation5 as ɵi18nInterpolation5, + i18nInterpolation6 as ɵi18nInterpolation6, + i18nInterpolation7 as ɵi18nInterpolation7, + i18nInterpolation8 as ɵi18nInterpolation8, + i18nInterpolationV as ɵi18nInterpolationV, + i18nMapping as ɵi18nMapping, I18nInstruction as ɵI18nInstruction, I18nExpInstruction as ɵI18nExpInstruction, WRAP_RENDERER_FACTORY2 as ɵWRAP_RENDERER_FACTORY2, diff --git a/packages/core/src/render3/index.ts b/packages/core/src/render3/index.ts index 114bf8224c..8d7bd61312 100644 --- a/packages/core/src/render3/index.ts +++ b/packages/core/src/render3/index.ts @@ -19,93 +19,85 @@ export {QUERY_READ_CONTAINER_REF, QUERY_READ_ELEMENT_REF, QUERY_READ_FROM_NODE, export {RenderFlags} from './interfaces/definition'; export {CssSelectorList} from './interfaces/projection'; -// Naming scheme: -// - Capital letters are for creating things: T(Text), E(Element), D(Directive), V(View), -// C(Container), L(Listener) -// - lower case letters are for binding: b(bind) -// - lower case letters are for binding target: p(property), a(attribute), k(class), s(style), -// i(input) -// - lower case letters for guarding life cycle hooks: l(lifeCycle) -// - lower case for closing: c(containerEnd), e(elementEnd), v(viewEnd) // clang-format off export { - NO_CHANGE as NC, + NO_CHANGE, - bind as b, - interpolation1 as i1, - interpolation2 as i2, - interpolation3 as i3, - interpolation4 as i4, - interpolation5 as i5, - interpolation6 as i6, - interpolation7 as i7, - interpolation8 as i8, - interpolationV as iV, + bind, + interpolation1, + interpolation2, + interpolation3, + interpolation4, + interpolation5, + interpolation6, + interpolation7, + interpolation8, + interpolationV, - container as C, - containerRefreshStart as cR, - containerRefreshEnd as cr, + container, + containerRefreshStart, + containerRefreshEnd, - nextContext as x, + nextContext, - element as Ee, - elementAttribute as a, - elementClassProp as cp, - elementEnd as e, - elementProperty as p, - elementStart as E, + element, + elementAttribute, + elementClassProp, + elementEnd, + elementProperty, + elementStart, - elementContainerStart as EC, - elementContainerEnd as eC, + elementContainerStart, + elementContainerEnd, - elementStyling as s, - elementStylingMap as sm, - elementStyleProp as sp, - elementStylingApply as sa, + elementStyling, + elementStylingMap, + elementStyleProp, + elementStylingApply, - getCurrentView as gV, - restoreView as rV, + getCurrentView, + restoreView, - listener as L, - store as st, - load as ld, - loadDirective as d, + listener, + store, + load, + loadDirective, - namespaceHTML as NH, - namespaceMathML as NM, - namespaceSVG as NS, + namespaceHTML, + namespaceMathML, + namespaceSVG, - projection as P, - projectionDef as pD, + projection, + projectionDef, - text as T, - textBinding as t, + text, + textBinding, - reference as r, + reference, - reserveSlots as rS, + reserveSlots, - embeddedViewStart as V, - embeddedViewEnd as v, + embeddedViewStart, + embeddedViewEnd, detectChanges, markDirty, tick, } from './instructions'; export { - i18nApply as iA, - i18nMapping as iM, - i18nInterpolation1 as iI1, - i18nInterpolation2 as iI2, - i18nInterpolation3 as iI3, - i18nInterpolation4 as iI4, - i18nInterpolation5 as iI5, - i18nInterpolation6 as iI6, - i18nInterpolation7 as iI7, - i18nInterpolation8 as iI8, - i18nInterpolationV as iIV, - i18nExpMapping as iEM, + i18nApply, + i18nMapping, + i18nInterpolation1, + i18nInterpolation2, + i18nInterpolation3, + i18nInterpolation4, + i18nInterpolation5, + i18nInterpolation6, + i18nInterpolation7, + i18nInterpolation8, + i18nInterpolationV, + i18nExpMapping, I18nInstruction, I18nExpInstruction } from './i18n'; @@ -117,35 +109,35 @@ export { } from './interfaces/node'; export { - pipe as Pp, - pipeBind1 as pb1, - pipeBind2 as pb2, - pipeBind3 as pb3, - pipeBind4 as pb4, - pipeBindV as pbV, + pipe, + pipeBind1, + pipeBind2, + pipeBind3, + pipeBind4, + pipeBindV, } from './pipe'; export { QueryList, - query as Q, - queryRefresh as qR, + query, + queryRefresh, } from './query'; export { - registerContentQuery as Qr, - loadQueryList as ql, + registerContentQuery, + loadQueryList, } from './instructions'; export { - pureFunction0 as f0, - pureFunction1 as f1, - pureFunction2 as f2, - pureFunction3 as f3, - pureFunction4 as f4, - pureFunction5 as f5, - pureFunction6 as f6, - pureFunction7 as f7, - pureFunction8 as f8, - pureFunctionV as fV, + pureFunction0, + pureFunction1, + pureFunction2, + pureFunction3, + pureFunction4, + pureFunction5, + pureFunction6, + pureFunction7, + pureFunction8, + pureFunctionV, } from './pure_function'; diff --git a/packages/core/src/render3/jit/environment.ts b/packages/core/src/render3/jit/environment.ts index 00dbe0d348..03cde2c4b4 100644 --- a/packages/core/src/render3/jit/environment.ts +++ b/packages/core/src/render3/jit/environment.ts @@ -37,68 +37,68 @@ export const angularCoreEnv: {[name: string]: Function} = { 'ɵNgOnChangesFeature': r3.NgOnChangesFeature, 'ɵPublicFeature': r3.PublicFeature, 'ɵInheritDefinitionFeature': r3.InheritDefinitionFeature, - 'ɵa': r3.a, - 'ɵb': r3.b, - 'ɵC': r3.C, - 'ɵx': r3.x, - 'ɵcR': r3.cR, - 'ɵcr': r3.cr, - 'ɵd': r3.d, - 'ɵql': r3.ql, - 'ɵNH': r3.NH, - 'ɵNM': r3.NM, - 'ɵNS': r3.NS, - 'ɵE': r3.E, - 'ɵe': r3.e, - 'ɵEe': r3.Ee, - 'ɵEC': r3.EC, - 'ɵeC': r3.eC, - 'ɵf0': r3.f0, - 'ɵf1': r3.f1, - 'ɵf2': r3.f2, - 'ɵf3': r3.f3, - 'ɵf4': r3.f4, - 'ɵf5': r3.f5, - 'ɵf6': r3.f6, - 'ɵf7': r3.f7, - 'ɵf8': r3.f8, - 'ɵfV': r3.fV, - 'ɵgV': r3.gV, - 'ɵrV': r3.rV, - 'ɵi1': r3.i1, - 'ɵi2': r3.i2, - 'ɵi3': r3.i3, - 'ɵi4': r3.i4, - 'ɵi5': r3.i5, - 'ɵi6': r3.i6, - 'ɵi7': r3.i7, - 'ɵi8': r3.i8, - 'ɵiV': r3.iV, - 'ɵcp': r3.cp, - 'ɵL': r3.L, - 'ɵld': r3.ld, - 'ɵP': r3.P, - 'ɵp': r3.p, - 'ɵpb1': r3.pb1, - 'ɵpb2': r3.pb2, - 'ɵpb3': r3.pb3, - 'ɵpb4': r3.pb4, - 'ɵpbV': r3.pbV, - 'ɵpD': r3.pD, - 'ɵPp': r3.Pp, - 'ɵQ': r3.Q, - 'ɵqR': r3.qR, - 'ɵQr': r3.Qr, - 'ɵrS': r3.rS, - 'ɵr': r3.r, - 'ɵs': r3.s, - 'ɵsm': r3.sm, - 'ɵsp': r3.sp, - 'ɵsa': r3.sa, - 'ɵT': r3.T, - 'ɵt': r3.t, - 'ɵV': r3.V, - 'ɵv': r3.v, + 'ɵelementAttribute': r3.elementAttribute, + 'ɵbind': r3.bind, + 'ɵcontainer': r3.container, + 'ɵnextContext': r3.nextContext, + 'ɵcontainerRefreshStart': r3.containerRefreshStart, + 'ɵcontainerRefreshEnd': r3.containerRefreshEnd, + 'ɵloadDirective': r3.loadDirective, + 'ɵloadQueryList': r3.loadQueryList, + 'ɵnamespaceHTML': r3.namespaceHTML, + 'ɵnamespaceMathML': r3.namespaceMathML, + 'ɵnamespaceSVG': r3.namespaceSVG, + 'ɵelementStart': r3.elementStart, + 'ɵelementEnd': r3.elementEnd, + 'ɵelement': r3.element, + 'ɵEC': r3.elementContainerStart, + 'ɵeC': r3.elementContainerEnd, + 'ɵpureFunction0': r3.pureFunction0, + 'ɵpureFunction1': r3.pureFunction1, + 'ɵpureFunction2': r3.pureFunction2, + 'ɵpureFunction3': r3.pureFunction3, + 'ɵpureFunction4': r3.pureFunction4, + 'ɵpureFunction5': r3.pureFunction5, + 'ɵpureFunction6': r3.pureFunction6, + 'ɵpureFunction7': r3.pureFunction7, + 'ɵpureFunction8': r3.pureFunction8, + 'ɵpureFunctionV': r3.pureFunctionV, + 'ɵgetCurrentView': r3.getCurrentView, + 'ɵrestoreView': r3.restoreView, + 'ɵinterpolation1': r3.interpolation1, + 'ɵinterpolation2': r3.interpolation2, + 'ɵinterpolation3': r3.interpolation3, + 'ɵinterpolation4': r3.interpolation4, + 'ɵinterpolation5': r3.interpolation5, + 'ɵinterpolation6': r3.interpolation6, + 'ɵinterpolation7': r3.interpolation7, + 'ɵinterpolation8': r3.interpolation8, + 'ɵinterpolationV': r3.interpolationV, + 'ɵelementClassProp': r3.elementClassProp, + 'ɵlistener': r3.listener, + 'ɵload': r3.load, + 'ɵprojection': r3.projection, + 'ɵelementProperty': r3.elementProperty, + 'ɵpipeBind1': r3.pipeBind1, + 'ɵpipeBind2': r3.pipeBind1, + 'ɵpipeBind3': r3.pipeBind3, + 'ɵpipeBind4': r3.pipeBind4, + 'ɵpipeBindV': r3.pipeBindV, + 'ɵprojectionDef': r3.projectionDef, + 'ɵpipe': r3.pipe, + 'ɵquery': r3.query, + 'ɵqueryRefresh': r3.queryRefresh, + 'ɵregisterContentQuery': r3.registerContentQuery, + 'ɵreserveSlots': r3.reserveSlots, + 'ɵreference': r3.reference, + 'ɵelementStyling': r3.elementStyling, + 'ɵelementStylingMap': r3.elementStylingMap, + 'ɵelementStylingProp': r3.elementStyleProp, + 'ɵelementStylingApply': r3.elementStylingApply, + 'ɵtext': r3.text, + 'ɵtextBinding': r3.textBinding, + 'ɵembeddedViewStart': r3.embeddedViewStart, + 'ɵembeddedViewEnd': r3.embeddedViewEnd, 'ɵzh': sanitization.sanitizeHtml, 'ɵzs': sanitization.sanitizeStyle, diff --git a/packages/core/test/render3/compiler_canonical/component_directives_spec.ts b/packages/core/test/render3/compiler_canonical/component_directives_spec.ts index 8667fd53dc..5b69592045 100644 --- a/packages/core/test/render3/compiler_canonical/component_directives_spec.ts +++ b/packages/core/test/render3/compiler_canonical/component_directives_spec.ts @@ -34,7 +34,7 @@ describe('components & directives', () => { factory: function ChildComponent_Factory() { return new ChildComponent(); }, template: function ChildComponent_Template(rf: $RenderFlags$, ctx: $ChildComponent$) { if (rf & 1) { - $r3$.ɵT(0, 'child-view'); + $r3$.ɵtext(0, 'child-view'); } } }); @@ -69,8 +69,8 @@ describe('components & directives', () => { factory: () => new MyComponent(), template: function(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵEe(0, 'child', $e0_attrs$); - $r3$.ɵT(1, '!'); + $r3$.ɵelement(0, 'child', $e0_attrs$); + $r3$.ɵtext(1, '!'); } } }); @@ -100,7 +100,8 @@ describe('components & directives', () => { selectors: [['', 'hostBindingDir', '']], factory: function HostBindingDir_Factory() { return new HostBindingDir(); }, hostBindings: function HostBindingDir_HostBindings(dirIndex: $number$, elIndex: $number$) { - $r3$.ɵp(elIndex, 'id', $r3$.ɵb($r3$.ɵd(dirIndex).dirId)); + $r3$.ɵelementProperty( + elIndex, 'id', $r3$.ɵbind($r3$.ɵloadDirective(dirIndex).dirId)); } }); // /NORMATIVE @@ -121,7 +122,7 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'div', $e0_attrs$); + $r3$.ɵelement(0, 'div', $e0_attrs$); } } }); @@ -149,7 +150,8 @@ describe('components & directives', () => { type: HostListenerDir, factory: function HostListenerDir_Factory() { const $dir$ = new HostListenerDir(); - $r3$.ɵL('click', function HostListenerDir_click_Handler(event: any) { $dir$.onClick(); }); + $r3$.ɵlistener( + 'click', function HostListenerDir_click_Handler(event: any) { $dir$.onClick(); }); return $dir$; }, }); @@ -171,9 +173,9 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'button', $e0_attrs$); - $r3$.ɵT(1, 'Click'); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'button', $e0_attrs$); + $r3$.ɵtext(1, 'Click'); + $r3$.ɵelementEnd(); } } }); @@ -218,7 +220,7 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'div', $e0_attrs$); + $r3$.ɵelement(0, 'div', $e0_attrs$); } } }); @@ -245,7 +247,9 @@ describe('components & directives', () => { selectors: [['', 'hostBindingDir', '']], factory: function HostBindingDir_Factory() { return new HostBindingDir(); }, hostBindings: function HostBindingDir_HostBindings(dirIndex: $number$, elIndex: $number$) { - $r3$.ɵa(elIndex, 'aria-label', $r3$.ɵb($r3$.ɵd(dirIndex).label)); + $r3$.ɵelementAttribute( + elIndex, 'aria-label', + $r3$.ɵbind($r3$.ɵloadDirective(dirIndex).label)); } }); // /NORMATIVE @@ -266,7 +270,7 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'div', $e0_attrs$); + $r3$.ɵelement(0, 'div', $e0_attrs$); } } }); @@ -302,9 +306,9 @@ describe('components & directives', () => { factory: function MyComp_Factory() { return new MyComp(); }, template: function MyComp_Template(rf: $RenderFlags$, ctx: $MyComp$) { if (rf & 1) { - $r3$.ɵT(0); + $r3$.ɵtext(0); } - $r3$.ɵt(0, $r3$.ɵb(ctx.name)); + $r3$.ɵtextBinding(0, $r3$.ɵbind(ctx.name)); }, inputs: {name: 'name'}, changeDetection: ChangeDetectionStrategy.OnPush @@ -327,10 +331,10 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-comp'); + $r3$.ɵelement(0, 'my-comp'); } if (rf & 2) { - $r3$.ɵp(0, 'name', $r3$.ɵb(ctx.name)); + $r3$.ɵelementProperty(0, 'name', $r3$.ɵbind(ctx.name)); } } }); @@ -378,24 +382,24 @@ describe('components & directives', () => { factory: () => new MyComponent(), template: function(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'ul', null, $e0_locals$); - $r3$.ɵC(2, C1, '', ['if', '']); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'ul', null, $e0_locals$); + $r3$.ɵcontainer(2, C1, '', ['if', '']); + $r3$.ɵelementEnd(); } - let $foo$ = $r3$.ɵld(1); + let $foo$ = $r3$.ɵload(1); if (rf & 2) { - $r3$.ɵcR(2); - $r3$.ɵcr(); + $r3$.ɵcontainerRefreshStart(2); + $r3$.ɵcontainerRefreshEnd(); } function C1(rf1: $RenderFlags$, ctx1: $any$) { if (rf1 & 1) { - $r3$.ɵE(0, 'li'); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'li'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } if (rf1 & 2) { - $r3$.ɵt(1, $r3$.ɵi2('', ctx.salutation, ' ', $foo$, '')); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation2('', ctx.salutation, ' ', $foo$, '')); } } } @@ -426,10 +430,10 @@ describe('components & directives', () => { factory: function MyArrayComp_Factory() { return new MyArrayComp(); }, template: function MyArrayComp_Template(rf: $RenderFlags$, ctx: $MyArrayComp$) { if (rf & 1) { - $r3$.ɵT(0); + $r3$.ɵtext(0); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵi2('', ctx.names[0], ' ', ctx.names[1], '')); + $r3$.ɵtextBinding(0, $r3$.ɵinterpolation2('', ctx.names[0], ' ', ctx.names[1], '')); } }, inputs: {names: 'names'} @@ -457,10 +461,10 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-array-comp'); + $r3$.ɵelement(0, 'my-array-comp'); } if (rf & 2) { - $r3$.ɵp(0, 'names', rf & 1 ? $e0_arr$ : $r3$.ɵNC); + $r3$.ɵelementProperty(0, 'names', rf & 1 ? $e0_arr$ : $r3$.ɵNO_CHANGE); } } }); @@ -501,11 +505,12 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-array-comp'); - $r3$.ɵrS(1); + $r3$.ɵelement(0, 'my-array-comp'); + $r3$.ɵreserveSlots(1); } if (rf & 2) { - $r3$.ɵp(0, 'names', $r3$.ɵb(ctx.someFn($r3$.ɵf0(1, $e0_ff$)))); + $r3$.ɵelementProperty( + 0, 'names', $r3$.ɵbind(ctx.someFn($r3$.ɵpureFunction0(1, $e0_ff$)))); } } }); @@ -535,13 +540,13 @@ describe('components & directives', () => { factory: function MyComp_Factory() { return new MyComp(); }, template: function MyComp_Template(rf: $RenderFlags$, ctx: $MyComp$) { if (rf & 1) { - $r3$.ɵT(0); + $r3$.ɵtext(0); } if (rf & 2) { // clang-format wants to break this line by changing the second 'ɵ' to an invalid // unicode sequence. // clang-format off - $r3$.ɵt(0, $r3$.ɵb(ctx.num)); + $r3$.ɵtextBinding(0, $r3$.ɵbind(ctx.num)); // clang-format on } }, @@ -567,11 +572,12 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-comp'); - $r3$.ɵrS(1); + $r3$.ɵelement(0, 'my-comp'); + $r3$.ɵreserveSlots(1); } if (rf & 2) { - $r3$.ɵp(0, 'num', $r3$.ɵb($r3$.ɵf0(1, $e0_ff$).length + 1)); + $r3$.ɵelementProperty( + 0, 'num', $r3$.ɵbind($r3$.ɵpureFunction0(1, $e0_ff$).length + 1)); } } }); @@ -610,11 +616,12 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-array-comp'); - $r3$.ɵrS(2); + $r3$.ɵelement(0, 'my-array-comp'); + $r3$.ɵreserveSlots(2); } if (rf & 2) { - $r3$.ɵp(0, 'names', $r3$.ɵb($r3$.ɵf1(2, $e0_ff$, ctx.customName))); + $r3$.ɵelementProperty( + 0, 'names', $r3$.ɵbind($r3$.ɵpureFunction1(2, $e0_ff$, ctx.customName))); } } }); @@ -658,32 +665,32 @@ describe('components & directives', () => { factory: function MyComp_Factory() { return new MyComp(); }, template: function MyComp_Template(rf: $RenderFlags$, ctx: $MyComp$) { if (rf & 1) { - $r3$.ɵT(0); - $r3$.ɵT(1); - $r3$.ɵT(2); - $r3$.ɵT(3); - $r3$.ɵT(4); - $r3$.ɵT(5); - $r3$.ɵT(6); - $r3$.ɵT(7); - $r3$.ɵT(8); - $r3$.ɵT(9); - $r3$.ɵT(10); - $r3$.ɵT(11); + $r3$.ɵtext(0); + $r3$.ɵtext(1); + $r3$.ɵtext(2); + $r3$.ɵtext(3); + $r3$.ɵtext(4); + $r3$.ɵtext(5); + $r3$.ɵtext(6); + $r3$.ɵtext(7); + $r3$.ɵtext(8); + $r3$.ɵtext(9); + $r3$.ɵtext(10); + $r3$.ɵtext(11); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵb(ctx.names[0])); - $r3$.ɵt(1, $r3$.ɵb(ctx.names[1])); - $r3$.ɵt(2, $r3$.ɵb(ctx.names[2])); - $r3$.ɵt(3, $r3$.ɵb(ctx.names[3])); - $r3$.ɵt(4, $r3$.ɵb(ctx.names[4])); - $r3$.ɵt(5, $r3$.ɵb(ctx.names[5])); - $r3$.ɵt(6, $r3$.ɵb(ctx.names[6])); - $r3$.ɵt(7, $r3$.ɵb(ctx.names[7])); - $r3$.ɵt(8, $r3$.ɵb(ctx.names[8])); - $r3$.ɵt(9, $r3$.ɵb(ctx.names[9])); - $r3$.ɵt(10, $r3$.ɵb(ctx.names[10])); - $r3$.ɵt(11, $r3$.ɵb(ctx.names[11])); + $r3$.ɵtextBinding(0, $r3$.ɵbind(ctx.names[0])); + $r3$.ɵtextBinding(1, $r3$.ɵbind(ctx.names[1])); + $r3$.ɵtextBinding(2, $r3$.ɵbind(ctx.names[2])); + $r3$.ɵtextBinding(3, $r3$.ɵbind(ctx.names[3])); + $r3$.ɵtextBinding(4, $r3$.ɵbind(ctx.names[4])); + $r3$.ɵtextBinding(5, $r3$.ɵbind(ctx.names[5])); + $r3$.ɵtextBinding(6, $r3$.ɵbind(ctx.names[6])); + $r3$.ɵtextBinding(7, $r3$.ɵbind(ctx.names[7])); + $r3$.ɵtextBinding(8, $r3$.ɵbind(ctx.names[8])); + $r3$.ɵtextBinding(9, $r3$.ɵbind(ctx.names[9])); + $r3$.ɵtextBinding(10, $r3$.ɵbind(ctx.names[10])); + $r3$.ɵtextBinding(11, $r3$.ɵbind(ctx.names[11])); } }, inputs: {names: 'names'} @@ -721,13 +728,13 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, c: $any$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-comp'); - $r3$.ɵrS(10); + $r3$.ɵelement(0, 'my-comp'); + $r3$.ɵreserveSlots(10); } if (rf & 2) { - $r3$.ɵp( + $r3$.ɵelementProperty( 0, 'names', - $r3$.ɵb($r3$.ɵfV( + $r3$.ɵbind($r3$.ɵpureFunctionV( 10, $e0_ff$, [c.n0, c.n1, c.n2, c.n3, c.n4, c.n5, c.n6, c.n7, c.n8]))); } } @@ -764,16 +771,16 @@ describe('components & directives', () => { factory: function ObjectComp_Factory() { return new ObjectComp(); }, template: function ObjectComp_Template(rf: $RenderFlags$, ctx: $ObjectComp$) { if (rf & 1) { - $r3$.ɵE(0, 'p'); - $r3$.ɵT(1); - $r3$.ɵe(); - $r3$.ɵE(2, 'p'); - $r3$.ɵT(3); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'p'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(2, 'p'); + $r3$.ɵtext(3); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵt(1, $r3$.ɵb(ctx.config['duration'])); - $r3$.ɵt(3, $r3$.ɵb(ctx.config.animation)); + $r3$.ɵtextBinding(1, $r3$.ɵbind(ctx.config['duration'])); + $r3$.ɵtextBinding(3, $r3$.ɵbind(ctx.config.animation)); } }, inputs: {config: 'config'} @@ -800,11 +807,12 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'object-comp'); - $r3$.ɵrS(2); + $r3$.ɵelement(0, 'object-comp'); + $r3$.ɵreserveSlots(2); } if (rf & 2) { - $r3$.ɵp(0, 'config', $r3$.ɵb($r3$.ɵf1(2, $e0_ff$, ctx.name))); + $r3$.ɵelementProperty( + 0, 'config', $r3$.ɵbind($r3$.ɵpureFunction1(2, $e0_ff$, ctx.name))); } } }); @@ -841,20 +849,20 @@ describe('components & directives', () => { factory: function NestedComp_Factory() { return new NestedComp(); }, template: function NestedComp_Template(rf: $RenderFlags$, ctx: $NestedComp$) { if (rf & 1) { - $r3$.ɵE(0, 'p'); - $r3$.ɵT(1); - $r3$.ɵe(); - $r3$.ɵE(2, 'p'); - $r3$.ɵT(3); - $r3$.ɵe(); - $r3$.ɵE(4, 'p'); - $r3$.ɵT(5); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'p'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(2, 'p'); + $r3$.ɵtext(3); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(4, 'p'); + $r3$.ɵtext(5); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵt(1, $r3$.ɵb(ctx.config.animation)); - $r3$.ɵt(3, $r3$.ɵb(ctx.config.actions[0].opacity)); - $r3$.ɵt(5, $r3$.ɵb(ctx.config.actions[1].duration)); + $r3$.ɵtextBinding(1, $r3$.ɵbind(ctx.config.animation)); + $r3$.ɵtextBinding(3, $r3$.ɵbind(ctx.config.actions[0].opacity)); + $r3$.ɵtextBinding(5, $r3$.ɵbind(ctx.config.actions[1].duration)); } }, inputs: {config: 'config'} @@ -886,14 +894,16 @@ describe('components & directives', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'nested-comp'); - $r3$.ɵrS(7); + $r3$.ɵelement(0, 'nested-comp'); + $r3$.ɵreserveSlots(7); } if (rf & 2) { - $r3$.ɵp( - 0, 'config', $r3$.ɵb($r3$.ɵf2( - 7, $e0_ff_2$, ctx.name, - $r3$.ɵf1(4, $e0_ff_1$, $r3$.ɵf1(2, $e0_ff$, ctx.duration))))); + $r3$.ɵelementProperty( + 0, 'config', + $r3$.ɵbind($r3$.ɵpureFunction2( + 7, $e0_ff_2$, ctx.name, + $r3$.ɵpureFunction1( + 4, $e0_ff_1$, $r3$.ɵpureFunction1(2, $e0_ff$, ctx.duration))))); } } }); diff --git a/packages/core/test/render3/compiler_canonical/content_projection_spec.ts b/packages/core/test/render3/compiler_canonical/content_projection_spec.ts index 328c32996c..40ad035d22 100644 --- a/packages/core/test/render3/compiler_canonical/content_projection_spec.ts +++ b/packages/core/test/render3/compiler_canonical/content_projection_spec.ts @@ -27,9 +27,9 @@ describe('content projection', () => { factory: () => new SimpleComponent(), template: function(rf: $RenderFlags$, ctx: $SimpleComponent$) { if (rf & 1) { - $r3$.ɵpD(); - $r3$.ɵEe(0, 'div'); - $r3$.ɵP(1); + $r3$.ɵprojectionDef(); + $r3$.ɵelement(0, 'div'); + $r3$.ɵprojection(1); } } }); @@ -56,11 +56,11 @@ describe('content projection', () => { factory: () => new ComplexComponent(), template: function(rf: $RenderFlags$, ctx: $ComplexComponent$) { if (rf & 1) { - $r3$.ɵpD($pD_0P$, $pD_0R$); - $r3$.ɵEe(0, 'div', ['id', 'first']); - $r3$.ɵP(1, 1); - $r3$.ɵEe(2, 'div', ['id', 'second']); - $r3$.ɵP(3, 2); + $r3$.ɵprojectionDef($pD_0P$, $pD_0R$); + $r3$.ɵelement(0, 'div', ['id', 'first']); + $r3$.ɵprojection(1, 1); + $r3$.ɵelement(2, 'div', ['id', 'second']); + $r3$.ɵprojection(3, 2); } } }); @@ -79,9 +79,9 @@ describe('content projection', () => { factory: () => new MyApp(), template: function(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'simple'); - $r3$.ɵT(1, 'content'); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'simple'); + $r3$.ɵtext(1, 'content'); + $r3$.ɵelementEnd(); } }, directives: () => [SimpleComponent] diff --git a/packages/core/test/render3/compiler_canonical/elements_spec.ts b/packages/core/test/render3/compiler_canonical/elements_spec.ts index 1eb490df7e..90a1cfd3f9 100644 --- a/packages/core/test/render3/compiler_canonical/elements_spec.ts +++ b/packages/core/test/render3/compiler_canonical/elements_spec.ts @@ -39,13 +39,13 @@ describe('elements', () => { factory: () => new MyComponent(), template: function(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div', $e0_attrs$); - $r3$.ɵT(1, 'Hello '); - $r3$.ɵE(2, 'b'); - $r3$.ɵT(3, 'World'); - $r3$.ɵe(); - $r3$.ɵT(4, '!'); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div', $e0_attrs$); + $r3$.ɵtext(1, 'Hello '); + $r3$.ɵelementStart(2, 'b'); + $r3$.ɵtext(3, 'World'); + $r3$.ɵelementEnd(); + $r3$.ɵtext(4, '!'); + $r3$.ɵelementEnd(); } } }); @@ -92,13 +92,14 @@ describe('elements', () => { let $tmp$: any; let $tmp_2$: any; if (rf & 1) { - $r3$.ɵEe(0, 'div', $e0_attrs$, $e0_locals$); - $r3$.ɵT(3); + $r3$.ɵelement(0, 'div', $e0_attrs$, $e0_locals$); + $r3$.ɵtext(3); } if (rf & 2) { - $tmp$ = $r3$.ɵld(1); - $tmp_2$ = $r3$.ɵld(2); - $r3$.ɵt(3, $r3$.ɵi2(' ', $tmp$.value, ' - ', $tmp_2$.tagName, '')); + $tmp$ = $r3$.ɵload(1); + $tmp_2$ = $r3$.ɵload(2); + $r3$.ɵtextBinding( + 3, $r3$.ɵinterpolation2(' ', $tmp$.value, ' - ', $tmp_2$.tagName, '')); } } }); @@ -134,14 +135,15 @@ describe('elements', () => { factory: function ListenerComp_Factory() { return new ListenerComp(); }, template: function ListenerComp_Template(rf: $RenderFlags$, ctx: $ListenerComp$) { if (rf & 1) { - $r3$.ɵE(0, 'button'); - $r3$.ɵL('click', function ListenerComp_click_Handler() { return ctx.onClick(); }); - $r3$.ɵL('keypress', function ListenerComp_keypress_Handler($event: $any$) { + $r3$.ɵelementStart(0, 'button'); + $r3$.ɵlistener( + 'click', function ListenerComp_click_Handler() { return ctx.onClick(); }); + $r3$.ɵlistener('keypress', function ListenerComp_keypress_Handler($event: $any$) { ctx.onPress($event); return ctx.onPress2($event); }); - $r3$.ɵT(1, 'Click'); - $r3$.ɵe(); + $r3$.ɵtext(1, 'Click'); + $r3$.ɵelementEnd(); } } }); @@ -188,13 +190,13 @@ describe('elements', () => { factory: () => new MyComponent(), template: function(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div', $e0_attrs$); - $r3$.ɵT(1, 'Hello '); - $r3$.ɵE(2, 'b'); - $r3$.ɵT(3, 'World'); - $r3$.ɵe(); - $r3$.ɵT(4, '!'); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div', $e0_attrs$); + $r3$.ɵtext(1, 'Hello '); + $r3$.ɵelementStart(2, 'b'); + $r3$.ɵtext(3, 'World'); + $r3$.ɵelementEnd(); + $r3$.ɵtext(4, '!'); + $r3$.ɵelementEnd(); } } }); @@ -220,10 +222,10 @@ describe('elements', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵEe(0, 'div'); + $r3$.ɵelement(0, 'div'); } if (rf & 2) { - $r3$.ɵp(0, 'id', $r3$.ɵb(ctx.someProperty)); + $r3$.ɵelementProperty(0, 'id', $r3$.ɵbind(ctx.someProperty)); } } }); @@ -251,10 +253,10 @@ describe('elements', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵEe(0, 'div'); + $r3$.ɵelement(0, 'div'); } if (rf & 2) { - $r3$.ɵa(0, 'title', $r3$.ɵb(ctx.someAttribute)); + $r3$.ɵelementAttribute(0, 'title', $r3$.ɵbind(ctx.someAttribute)); } } }); @@ -283,13 +285,13 @@ describe('elements', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵs(c1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStyling(c1); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵcp(0, 0, ctx.someFlag); - $r3$.ɵsa(0); + $r3$.ɵelementClassProp(0, 0, ctx.someFlag); + $r3$.ɵelementStylingApply(0); } } }); @@ -322,14 +324,14 @@ describe('elements', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵs(null, c0); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStyling(null, c0); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsp(0, 0, ctx.someColor); - $r3$.ɵsp(0, 1, ctx.someWidth, 'px'); - $r3$.ɵsa(0); + $r3$.ɵelementStylingProp(0, 0, ctx.someColor); + $r3$.ɵelementStylingProp(0, 1, ctx.someWidth, 'px'); + $r3$.ɵelementStylingApply(0); } } }); @@ -373,14 +375,14 @@ describe('elements', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵs(c0, c1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStyling(c0, c1); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(0, 'id', $r3$.ɵb(ctx.someString + 1)); - $r3$.ɵcp(0, 0, ctx.someString == 'initial'); - $r3$.ɵsa(0); + $r3$.ɵelementProperty(0, 'id', $r3$.ɵbind(ctx.someString + 1)); + $r3$.ɵelementClassProp(0, 0, ctx.someString == 'initial'); + $r3$.ɵelementStylingApply(0); } } }); @@ -411,13 +413,13 @@ describe('elements', () => { factory: function StyleComponent_Factory() { return new StyleComponent(); }, template: function StyleComponent_Template(rf: $RenderFlags$, ctx: $StyleComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵs(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStyling(); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵsm(0, ctx.classExp, ctx.styleExp); - $r3$.ɵsa(0); + $r3$.ɵelementStylingMap(0, ctx.classExp, ctx.styleExp); + $r3$.ɵelementStylingApply(0); } } }); diff --git a/packages/core/test/render3/compiler_canonical/i18n_spec.ts b/packages/core/test/render3/compiler_canonical/i18n_spec.ts index a27ddb89d2..ebdfa71f26 100644 --- a/packages/core/test/render3/compiler_canonical/i18n_spec.ts +++ b/packages/core/test/render3/compiler_canonical/i18n_spec.ts @@ -18,7 +18,7 @@ describe('i18n', () => { it('should support html', () => { type $MyApp$ = MyApp; const $msg_1$ = `{$START_P}contenu{$END_P}`; - const $i18n_1$ = $r3$.ɵiM($msg_1$, [{START_P: 1}]); + const $i18n_1$ = $r3$.ɵi18nMapping($msg_1$, [{START_P: 1}]); @Component({selector: 'my-app', template: `

content

`}) class MyApp { @@ -28,11 +28,11 @@ describe('i18n', () => { factory: () => new MyApp(), template: function(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵE(1, 'p'); - $r3$.ɵe(); - $r3$.ɵe(); - $r3$.ɵiA(1, $i18n_1$[0]); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStart(1, 'p'); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); + $r3$.ɵi18nApply(1, $i18n_1$[0]); } } }); @@ -42,7 +42,7 @@ describe('i18n', () => { it('should support expressions', () => { type $MyApp$ = MyApp; const $msg_1$ = `contenu: {$EXP_1}`; - const $i18n_1$ = $r3$.ɵiM($msg_1$, null, [{EXP_1: 1}]); + const $i18n_1$ = $r3$.ɵi18nMapping($msg_1$, null, [{EXP_1: 1}]); @Component({selector: 'my-app', template: `
content: {{exp1}}
`}) class MyApp { @@ -53,13 +53,13 @@ describe('i18n', () => { factory: () => new MyApp(), template: function(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵT(1); - $r3$.ɵe(); - $r3$.ɵiA(1, $i18n_1$[0]); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); + $r3$.ɵi18nApply(1, $i18n_1$[0]); } if (rf & 2) { - $r3$.ɵt(3, $r3$.ɵb(ctx.exp1)); + $r3$.ɵtextBinding(3, $r3$.ɵbind(ctx.exp1)); } } }); @@ -69,7 +69,7 @@ describe('i18n', () => { it('should support expressions in attributes', () => { type $MyApp$ = MyApp; const $msg_1$ = `titre: {$EXP_1}`; - const $i18n_1$ = $r3$.ɵiEM($msg_1$, {EXP_1: 1}); + const $i18n_1$ = $r3$.ɵi18nExpMapping($msg_1$, {EXP_1: 1}); @Component({selector: 'my-app', template: `

`}) class MyApp { @@ -80,13 +80,13 @@ describe('i18n', () => { factory: () => new MyApp(), template: function(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵE(1, 'p'); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStart(1, 'p'); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(0, 'title', $r3$.ɵiI1($i18n_1$, ctx.exp1)); + $r3$.ɵelementProperty(0, 'title', $r3$.ɵi18nInterpolation1($i18n_1$, ctx.exp1)); } } }); @@ -96,8 +96,8 @@ describe('i18n', () => { it('should support embedded templates', () => { type $MyApp$ = MyApp; const $msg_1$ = `{$START_LI}valeur: {$EXP_1}!{$END_LI}`; - const $i18n_1$ = - $r3$.ɵiM($msg_1$, [{START_LI: 1}, {START_LI: 0}], [null, {EXP_1: 1}], ['START_LI']); + const $i18n_1$ = $r3$.ɵi18nMapping( + $msg_1$, [{START_LI: 1}, {START_LI: 0}], [null, {EXP_1: 1}], ['START_LI']); @Component({ selector: 'my-app', @@ -111,24 +111,24 @@ describe('i18n', () => { selectors: [['my-app']], template: (rf: $RenderFlags$, myApp: $MyApp$) => { if (rf & 1) { - $r3$.ɵE(0, 'ul'); - $r3$.ɵC(1, liTemplate, null, ['ngForOf', '']); - $r3$.ɵe(); - $r3$.ɵiA(1, $i18n_1$[0]); + $r3$.ɵelementStart(0, 'ul'); + $r3$.ɵcontainer(1, liTemplate, null, ['ngForOf', '']); + $r3$.ɵelementEnd(); + $r3$.ɵi18nApply(1, $i18n_1$[0]); } if (rf & 2) { - $r3$.ɵp(1, 'ngForOf', $r3$.ɵb(myApp.items)); + $r3$.ɵelementProperty(1, 'ngForOf', $r3$.ɵbind(myApp.items)); } function liTemplate(rf1: $RenderFlags$, row: NgForOfContext) { if (rf1 & 1) { - $r3$.ɵE(0, 'li'); - $r3$.ɵT(1); - $r3$.ɵe(); - $r3$.ɵiA(0, $i18n_1$[1]); + $r3$.ɵelementStart(0, 'li'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); + $r3$.ɵi18nApply(0, $i18n_1$[1]); } if (rf1 & 2) { - $r3$.ɵt(1, $r3$.ɵb(row.$implicit)); + $r3$.ɵtextBinding(1, $r3$.ɵbind(row.$implicit)); } } }, diff --git a/packages/core/test/render3/compiler_canonical/injection_spec.ts b/packages/core/test/render3/compiler_canonical/injection_spec.ts index 9dc873476a..6ce6345c8e 100644 --- a/packages/core/test/render3/compiler_canonical/injection_spec.ts +++ b/packages/core/test/render3/compiler_canonical/injection_spec.ts @@ -36,10 +36,10 @@ describe('injection', () => { }, template: function MyComp_Template(rf: $RenderFlags$, ctx: $MyComp$) { if (rf & 1) { - $r3$.ɵT(0); + $r3$.ɵtext(0); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵb(ctx.value)); + $r3$.ɵtextBinding(0, $r3$.ɵbind(ctx.value)); } } }); @@ -54,7 +54,7 @@ describe('injection', () => { /** */ template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-comp'); + $r3$.ɵelement(0, 'my-comp'); } }, directives: () => [MyComp] @@ -82,10 +82,10 @@ describe('injection', () => { factory: function MyComp_Factory() { return new MyComp($r3$.ɵinjectAttribute('title')); }, template: function MyComp_Template(rf: $RenderFlags$, ctx: $MyComp$) { if (rf & 1) { - $r3$.ɵT(0); + $r3$.ɵtext(0); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵb(ctx.title)); + $r3$.ɵtextBinding(0, $r3$.ɵbind(ctx.title)); } } }); @@ -100,7 +100,7 @@ describe('injection', () => { /** */ template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵEe(0, 'my-comp', e0_attrs); + $r3$.ɵelement(0, 'my-comp', e0_attrs); } }, directives: () => [MyComp] diff --git a/packages/core/test/render3/compiler_canonical/life_cycle_spec.ts b/packages/core/test/render3/compiler_canonical/life_cycle_spec.ts index c3bda43937..bc20719008 100644 --- a/packages/core/test/render3/compiler_canonical/life_cycle_spec.ts +++ b/packages/core/test/render3/compiler_canonical/life_cycle_spec.ts @@ -71,12 +71,12 @@ describe('lifecycle hooks', () => { factory: function SimpleLayout_Factory() { return simpleLayout = new SimpleLayout(); }, template: function SimpleLayout_Template(rf: $RenderFlags$, ctx: $SimpleLayout$) { if (rf & 1) { - $r3$.ɵEe(0, 'lifecycle-comp'); - $r3$.ɵEe(1, 'lifecycle-comp'); + $r3$.ɵelement(0, 'lifecycle-comp'); + $r3$.ɵelement(1, 'lifecycle-comp'); } if (rf & 2) { - $r3$.ɵp(0, 'name', $r3$.ɵb(ctx.name1)); - $r3$.ɵp(1, 'name', $r3$.ɵb(ctx.name2)); + $r3$.ɵelementProperty(0, 'name', $r3$.ɵbind(ctx.name1)); + $r3$.ɵelementProperty(1, 'name', $r3$.ɵbind(ctx.name2)); } } }); diff --git a/packages/core/test/render3/compiler_canonical/local_reference_spec.ts b/packages/core/test/render3/compiler_canonical/local_reference_spec.ts index 6e092590c5..ce0bf7484c 100644 --- a/packages/core/test/render3/compiler_canonical/local_reference_spec.ts +++ b/packages/core/test/render3/compiler_canonical/local_reference_spec.ts @@ -28,12 +28,12 @@ describe('local references', () => { template: function(rf: $RenderFlags$, ctx: $MyComponent$) { let l1_user: any; if (rf & 1) { - $r3$.ɵEe(0, 'input', ['value', 'World'], ['user', '']); - $r3$.ɵT(2); + $r3$.ɵelement(0, 'input', ['value', 'World'], ['user', '']); + $r3$.ɵtext(2); } if (rf & 2) { - l1_user = $r3$.ɵr(1); - $r3$.ɵt(2, $r3$.ɵi1('Hello, ', l1_user.value, '!')); + l1_user = $r3$.ɵreference(1); + $r3$.ɵtextBinding(2, $r3$.ɵinterpolation1('Hello, ', l1_user.value, '!')); } } }); diff --git a/packages/core/test/render3/compiler_canonical/pipes_spec.ts b/packages/core/test/render3/compiler_canonical/pipes_spec.ts index 90bf0ff7e0..00a1561059 100644 --- a/packages/core/test/render3/compiler_canonical/pipes_spec.ts +++ b/packages/core/test/render3/compiler_canonical/pipes_spec.ts @@ -85,15 +85,17 @@ describe('pipes', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵT(0); - $r3$.ɵPp(1, 'myPipe'); - $r3$.ɵPp(2, 'myPurePipe'); - $r3$.ɵrS(6); + $r3$.ɵtext(0); + $r3$.ɵpipe(1, 'myPipe'); + $r3$.ɵpipe(2, 'myPurePipe'); + $r3$.ɵreserveSlots(6); } if (rf & 2) { - $r3$.ɵt( + $r3$.ɵtextBinding( 0, - $r3$.ɵi1('', $r3$.ɵpb2(1, 6, $r3$.ɵpb2(2, 3, ctx.name, ctx.size), ctx.size), '')); + $r3$.ɵinterpolation1( + '', $r3$.ɵpipeBind2(1, 6, $r3$.ɵpipeBind2(2, 3, ctx.name, ctx.size), ctx.size), + '')); } } }); @@ -164,31 +166,34 @@ describe('pipes', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵT(0); - $r3$.ɵPp(1, 'myPurePipe'); - $r3$.ɵT(2); - $r3$.ɵPp(3, 'myPurePipe'); - $r3$.ɵC(4, C4, '', ['oneTimeIf', '']); - $r3$.ɵrS(6); + $r3$.ɵtext(0); + $r3$.ɵpipe(1, 'myPurePipe'); + $r3$.ɵtext(2); + $r3$.ɵpipe(3, 'myPurePipe'); + $r3$.ɵcontainer(4, C4, '', ['oneTimeIf', '']); + $r3$.ɵreserveSlots(6); } if (rf & 2) { - $r3$.ɵt(0, $r3$.ɵi1('', $r3$.ɵpb2(1, 3, ctx.name, ctx.size), '')); - $r3$.ɵt(2, $r3$.ɵi1('', $r3$.ɵpb2(3, 6, ctx.name, ctx.size), '')); - $r3$.ɵp(4, 'oneTimeIf', $r3$.ɵb(ctx.more)); - $r3$.ɵcR(4); - $r3$.ɵcr(); + $r3$.ɵtextBinding( + 0, $r3$.ɵinterpolation1('', $r3$.ɵpipeBind2(1, 3, ctx.name, ctx.size), '')); + $r3$.ɵtextBinding( + 2, $r3$.ɵinterpolation1('', $r3$.ɵpipeBind2(3, 6, ctx.name, ctx.size), '')); + $r3$.ɵelementProperty(4, 'oneTimeIf', $r3$.ɵbind(ctx.more)); + $r3$.ɵcontainerRefreshStart(4); + $r3$.ɵcontainerRefreshEnd(); } function C4(rf: $RenderFlags$, ctx1: $any$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵT(1); - $r3$.ɵPp(2, 'myPurePipe'); - $r3$.ɵe(); - $r3$.ɵrS(3); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵtext(1); + $r3$.ɵpipe(2, 'myPurePipe'); + $r3$.ɵelementEnd(); + $r3$.ɵreserveSlots(3); } if (rf & 2) { - $r3$.ɵt(1, $r3$.ɵi1('', $r3$.ɵpb2(2, 3, ctx.name, ctx.size), '')); + $r3$.ɵtextBinding( + 1, $r3$.ɵinterpolation1('', $r3$.ɵpipeBind2(2, 3, ctx.name, ctx.size), '')); } } } diff --git a/packages/core/test/render3/compiler_canonical/query_spec.ts b/packages/core/test/render3/compiler_canonical/query_spec.ts index a3e85d4459..9046ac1a6a 100644 --- a/packages/core/test/render3/compiler_canonical/query_spec.ts +++ b/packages/core/test/render3/compiler_canonical/query_spec.ts @@ -57,18 +57,19 @@ describe('queries', () => { template: function ViewQueryComponent_Template( rf: $RenderFlags$, ctx: $ViewQueryComponent$) { if (rf & 1) { - $r3$.ɵEe(2, 'div', $e1_attrs$); + $r3$.ɵelement(2, 'div', $e1_attrs$); } }, viewQuery: function ViewQueryComponent_Query(rf: $RenderFlags$, ctx: $ViewQueryComponent$) { if (rf & 1) { - $r3$.ɵQ(0, SomeDirective, false); - $r3$.ɵQ(1, SomeDirective, false); + $r3$.ɵquery(0, SomeDirective, false); + $r3$.ɵquery(1, SomeDirective, false); } if (rf & 2) { let $tmp$: any; - $r3$.ɵqR($tmp$ = $r3$.ɵld>(0)) && (ctx.someDir = $tmp$.first); - $r3$.ɵqR($tmp$ = $r3$.ɵld>(1)) && + $r3$.ɵqueryRefresh($tmp$ = $r3$.ɵload>(0)) && + (ctx.someDir = $tmp$.first); + $r3$.ɵqueryRefresh($tmp$ = $r3$.ɵload>(1)) && (ctx.someDirList = $tmp$ as QueryList); } } @@ -110,23 +111,25 @@ describe('queries', () => { selectors: [['content-query-component']], factory: function ContentQueryComponent_Factory() { return new ContentQueryComponent(); }, contentQueries: function ContentQueryComponent_ContentQueries() { - $r3$.ɵQr($r3$.ɵQ(null, SomeDirective, false)); - $r3$.ɵQr($r3$.ɵQ(null, SomeDirective, false)); + $r3$.ɵregisterContentQuery($r3$.ɵquery(null, SomeDirective, false)); + $r3$.ɵregisterContentQuery($r3$.ɵquery(null, SomeDirective, false)); }, contentQueriesRefresh: function ContentQueryComponent_ContentQueriesRefresh( dirIndex: $number$, queryStartIndex: $number$) { let $tmp$: any; - const $instance$ = $r3$.ɵd(dirIndex); - $r3$.ɵqR($tmp$ = $r3$.ɵql(queryStartIndex)) && ($instance$.someDir = $tmp$.first); - $r3$.ɵqR($tmp$ = $r3$.ɵql(queryStartIndex + 1)) && ($instance$.someDirList = $tmp$); + const $instance$ = $r3$.ɵloadDirective(dirIndex); + $r3$.ɵqueryRefresh($tmp$ = $r3$.ɵloadQueryList(queryStartIndex)) && + ($instance$.someDir = $tmp$.first); + $r3$.ɵqueryRefresh($tmp$ = $r3$.ɵloadQueryList(queryStartIndex + 1)) && + ($instance$.someDirList = $tmp$); }, template: function ContentQueryComponent_Template( rf: $number$, ctx: $ContentQueryComponent$) { if (rf & 1) { - $r3$.ɵpD(); - $r3$.ɵE(0, 'div'); - $r3$.ɵP(1); - $r3$.ɵe(); + $r3$.ɵprojectionDef(); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵprojection(1); + $r3$.ɵelementEnd(); } } }); @@ -151,10 +154,10 @@ describe('queries', () => { factory: function MyApp_Factory() { return new MyApp(); }, template: function MyApp_Template(rf: $RenderFlags$, ctx: $MyApp$) { if (rf & 1) { - $r3$.ɵE(0, 'content-query-component'); - contentQueryComp = $r3$.ɵd(0); - $r3$.ɵEe(1, 'div', $e2_attrs$); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'content-query-component'); + contentQueryComp = $r3$.ɵloadDirective(0); + $r3$.ɵelement(1, 'div', $e2_attrs$); + $r3$.ɵelementEnd(); } } }); diff --git a/packages/core/test/render3/compiler_canonical/sanitize_spec.ts b/packages/core/test/render3/compiler_canonical/sanitize_spec.ts index dd2e4b11cb..b8915f65dd 100644 --- a/packages/core/test/render3/compiler_canonical/sanitize_spec.ts +++ b/packages/core/test/render3/compiler_canonical/sanitize_spec.ts @@ -43,18 +43,18 @@ describe('compiler sanitization', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'div'); - $r3$.ɵs(['background-image']); - $r3$.ɵe(); - $r3$.ɵEe(1, 'img'); + $r3$.ɵelementStart(0, 'div'); + $r3$.ɵelementStyling(['background-image']); + $r3$.ɵelementEnd(); + $r3$.ɵelement(1, 'img'); } if (rf & 2) { - $r3$.ɵp(0, 'innerHTML', $r3$.ɵb(ctx.innerHTML), $r3$.ɵsanitizeHtml); - $r3$.ɵp(0, 'hidden', $r3$.ɵb(ctx.hidden)); - $r3$.ɵsp(0, 0, ctx.style); - $r3$.ɵsa(0); - $r3$.ɵp(1, 'src', $r3$.ɵb(ctx.url), $r3$.ɵsanitizeUrl); - $r3$.ɵa(1, 'srcset', $r3$.ɵb(ctx.url), $r3$.ɵsanitizeUrl); + $r3$.ɵelementProperty(0, 'innerHTML', $r3$.ɵbind(ctx.innerHTML), $r3$.ɵsanitizeHtml); + $r3$.ɵelementProperty(0, 'hidden', $r3$.ɵbind(ctx.hidden)); + $r3$.ɵelementStylingProp(0, 0, ctx.style); + $r3$.ɵelementStylingApply(0); + $r3$.ɵelementProperty(1, 'src', $r3$.ɵbind(ctx.url), $r3$.ɵsanitizeUrl); + $r3$.ɵelementAttribute(1, 'srcset', $r3$.ɵbind(ctx.url), $r3$.ɵsanitizeUrl); } } }); diff --git a/packages/core/test/render3/compiler_canonical/small_app_spec.ts b/packages/core/test/render3/compiler_canonical/small_app_spec.ts index 04f45904c7..78e4407d3d 100644 --- a/packages/core/test/render3/compiler_canonical/small_app_spec.ts +++ b/packages/core/test/render3/compiler_canonical/small_app_spec.ts @@ -69,26 +69,26 @@ class ToDoAppComponent { const ToDoAppComponent_NgForOf_Template = function ToDoAppComponent_NgForOf_Template( rf: $RenderFlags$, ctx1: NgForOfContext) { if (rf & 1) { - r3.E(0, 'todo'); - r3.L('archive', ctx.onArchive.bind(ctx)); - r3.e(); + r3.elementStart(0, 'todo'); + r3.listener('archive', ctx.onArchive.bind(ctx)); + r3.elementEnd(); } if (rf & 2) { - r3.p(0, 'todo', r3.b(ctx1.$implicit)); + r3.elementProperty(0, 'todo', r3.bind(ctx1.$implicit)); } }; - r3.E(0, 'h1'); - r3.T(1, 'ToDo Application'); - r3.e(); - r3.E(2, 'div'); - r3.C(3, ToDoAppComponent_NgForOf_Template, '', ['ngForOf', '']); - r3.e(); - r3.E(4, 'span'); - r3.T(5); - r3.e(); + r3.elementStart(0, 'h1'); + r3.text(1, 'ToDo Application'); + r3.elementEnd(); + r3.elementStart(2, 'div'); + r3.container(3, ToDoAppComponent_NgForOf_Template, '', ['ngForOf', '']); + r3.elementEnd(); + r3.elementStart(4, 'span'); + r3.text(5); + r3.elementEnd(); } if (rf & 2) { - r3.t(5, r3.i1('count: ', ctx.appState.todos.length, '')); + r3.textBinding(5, r3.interpolation1('count: ', ctx.appState.todos.length, '')); } } }); @@ -133,22 +133,22 @@ class ToDoItemComponent { factory: function ToDoItemComponent_Factory() { return new ToDoItemComponent(); }, template: function ToDoItemComponent_Template(rf: $RenderFlags$, ctx: ToDoItemComponent) { if (rf & 1) { - r3.E(0, 'div'); - r3.E(1, 'input', e1_attrs); - r3.L('click', ctx.onCheckboxClick.bind(ctx)); - r3.e(); - r3.E(2, 'span'); - r3.T(3); - r3.e(); - r3.E(4, 'button'); - r3.L('click', ctx.onArchiveClick.bind(ctx)); - r3.T(5, 'archive'); - r3.e(); - r3.e(); + r3.elementStart(0, 'div'); + r3.elementStart(1, 'input', e1_attrs); + r3.listener('click', ctx.onCheckboxClick.bind(ctx)); + r3.elementEnd(); + r3.elementStart(2, 'span'); + r3.text(3); + r3.elementEnd(); + r3.elementStart(4, 'button'); + r3.listener('click', ctx.onArchiveClick.bind(ctx)); + r3.text(5, 'archive'); + r3.elementEnd(); + r3.elementEnd(); } if (rf & 2) { - r3.p(1, 'value', r3.b(ctx.todo.done)); - r3.t(3, r3.b(ctx.todo.text)); + r3.elementProperty(1, 'value', r3.bind(ctx.todo.done)); + r3.textBinding(3, r3.bind(ctx.todo.text)); } }, inputs: {todo: 'todo'}, diff --git a/packages/core/test/render3/compiler_canonical/template_variables_spec.ts b/packages/core/test/render3/compiler_canonical/template_variables_spec.ts index 5b0bc8fcfe..3d646e915b 100644 --- a/packages/core/test/render3/compiler_canonical/template_variables_spec.ts +++ b/packages/core/test/render3/compiler_canonical/template_variables_spec.ts @@ -99,26 +99,26 @@ describe('template variables', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'ul'); - $r3$.ɵC(1, MyComponent_ForOfDirective_Template_1, '', ['forOf', '']); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'ul'); + $r3$.ɵcontainer(1, MyComponent_ForOfDirective_Template_1, '', ['forOf', '']); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(1, 'forOf', $r3$.ɵb(ctx.items)); - $r3$.ɵcR(1); - $r3$.ɵcr(); + $r3$.ɵelementProperty(1, 'forOf', $r3$.ɵbind(ctx.items)); + $r3$.ɵcontainerRefreshStart(1); + $r3$.ɵcontainerRefreshEnd(); } function MyComponent_ForOfDirective_Template_1(rf: $RenderFlags$, ctx1: $any$) { if (rf & 1) { - $r3$.ɵE(0, 'li'); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'li'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } let $l0_item$: any; if (rf & 2) { $l0_item$ = ctx1.$implicit; - $r3$.ɵt(1, $r3$.ɵi1('', $l0_item$.name, '')); + $r3$.ɵtextBinding(1, $r3$.ɵinterpolation1('', $l0_item$.name, '')); } } } @@ -173,47 +173,49 @@ describe('template variables', () => { factory: function MyComponent_Factory() { return new MyComponent(); }, template: function MyComponent_Template(rf: $RenderFlags$, ctx: $MyComponent$) { if (rf & 1) { - $r3$.ɵE(0, 'ul'); - $r3$.ɵC(1, MyComponent_ForOfDirective_Template_1, '', ['forOf', '']); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'ul'); + $r3$.ɵcontainer(1, MyComponent_ForOfDirective_Template_1, '', ['forOf', '']); + $r3$.ɵelementEnd(); } if (rf & 2) { - $r3$.ɵp(1, 'forOf', $r3$.ɵb(ctx.items)); - $r3$.ɵcR(1); - $r3$.ɵcr(); + $r3$.ɵelementProperty(1, 'forOf', $r3$.ɵbind(ctx.items)); + $r3$.ɵcontainerRefreshStart(1); + $r3$.ɵcontainerRefreshEnd(); } function MyComponent_ForOfDirective_Template_1(rf1: $RenderFlags$, ctx1: $any$) { if (rf & 1) { - $r3$.ɵE(0, 'li'); - $r3$.ɵE(1, 'div'); - $r3$.ɵT(2); - $r3$.ɵe(); - $r3$.ɵE(3, 'ul'); - $r3$.ɵC(4, MyComponent_ForOfDirective_ForOfDirective_Template_3, '', ['forOf', '']); - $r3$.ɵe(); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'li'); + $r3$.ɵelementStart(1, 'div'); + $r3$.ɵtext(2); + $r3$.ɵelementEnd(); + $r3$.ɵelementStart(3, 'ul'); + $r3$.ɵcontainer( + 4, MyComponent_ForOfDirective_ForOfDirective_Template_3, '', ['forOf', '']); + $r3$.ɵelementEnd(); + $r3$.ɵelementEnd(); } let $l0_item$: any; if (rf & 2) { $l0_item$ = ctx1.$implicit; - $r3$.ɵp(4, 'forOf', $r3$.ɵb($l0_item$.infos)); - $r3$.ɵt(2, $r3$.ɵi1('', $l0_item$.name, '')); - $r3$.ɵcR(4); - $r3$.ɵcr(); + $r3$.ɵelementProperty(4, 'forOf', $r3$.ɵbind($l0_item$.infos)); + $r3$.ɵtextBinding(2, $r3$.ɵinterpolation1('', $l0_item$.name, '')); + $r3$.ɵcontainerRefreshStart(4); + $r3$.ɵcontainerRefreshEnd(); } function MyComponent_ForOfDirective_ForOfDirective_Template_3( rf2: $number$, ctx2: $any$) { if (rf & 1) { - $r3$.ɵE(0, 'li'); - $r3$.ɵT(1); - $r3$.ɵe(); + $r3$.ɵelementStart(0, 'li'); + $r3$.ɵtext(1); + $r3$.ɵelementEnd(); } let $l0_info$: any; if (rf & 2) { $l0_info$ = ctx2.$implicit; - $r3$.ɵt(1, $r3$.ɵi2(' ', $l0_item$.name, ': ', $l0_info$.description, ' ')); + $r3$.ɵtextBinding( + 1, $r3$.ɵinterpolation2(' ', $l0_item$.name, ': ', $l0_info$.description, ' ')); } } }