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 681a7ac6c7..5044fa56b9 100644 --- a/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts @@ -309,7 +309,7 @@ describe('compiler compliance', () => { const factory = 'factory: function MyComponent_Factory(t) { return new (t || MyComponent)(); }'; const template = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "id"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "id"]; … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { @@ -863,7 +863,7 @@ describe('compiler compliance', () => { }; const MyAppDeclaration = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "names"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "names"]; const $e0_ff$ = function ($v$) { return ["Nancy", $v$]; }; … MyApp.ngComponentDef = $r3$.ɵdefineComponent({ @@ -943,7 +943,7 @@ describe('compiler compliance', () => { }; const MyAppDefinition = ` - const $e0_attr$ = [${AttributeMarker.SelectOnly}, "names"]; + const $e0_attr$ = [${AttributeMarker.Bindings}, "names"]; const $e0_ff$ = function ($v0$, $v1$, $v2$, $v3$, $v4$, $v5$, $v6$, $v7$, $v8$) { return ["start-", $v0$, $v1$, $v2$, $v3$, $v4$, "-middle-", $v5$, $v6$, $v7$, $v8$, "-end"]; } @@ -1009,7 +1009,7 @@ describe('compiler compliance', () => { }; const MyAppDefinition = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "config"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "config"]; const $e0_ff$ = function ($v$) { return {"duration": 500, animation: $v$}; }; … MyApp.ngComponentDef = $r3$.ɵdefineComponent({ @@ -1074,7 +1074,7 @@ describe('compiler compliance', () => { }; const MyAppDefinition = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "config"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "config"]; const $c0$ = {opacity: 0, duration: 0}; const $e0_ff$ = function ($v$) { return {opacity: 1, duration: $v$}; }; const $e0_ff_1$ = function ($v$) { return [$c0$, $v$]; }; @@ -1223,7 +1223,7 @@ describe('compiler compliance', () => { } }; const output = ` - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $_c1$ = ["id", "second"]; function Cmp_div_0_Template(rf, ctx) { if (rf & 1) { $r3$.ɵelementStart(0, "div", $_c1$); @@ -2203,9 +2203,9 @@ describe('compiler compliance', () => { }; const template = ` - const $c0$ = ["ngFor", "" , ${AttributeMarker.SelectOnly}, "ngForOf"]; + const $c0$ = ["ngFor", "" , ${AttributeMarker.Bindings}, "ngForOf"]; const $c1$ = ["foo", ""]; - const $c2$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $c2$ = [${AttributeMarker.Bindings}, "ngIf"]; function MyComponent_div_0_span_3_Template(rf, ctx) { if (rf & 1) { @@ -2430,7 +2430,7 @@ describe('compiler compliance', () => { `; const MyComponentDefinition = ` - const $t1_attrs$ = ["for", "", ${AttributeMarker.SelectOnly}, "forOf"]; + const $t1_attrs$ = ["for", "", ${AttributeMarker.Bindings}, "forOf"]; function MyComponent__svg_g_1_Template(rf, ctx) { if (rf & 1) { $r3$.ɵnamespaceSVG(); @@ -2509,7 +2509,7 @@ describe('compiler compliance', () => { `; const MyComponentDefinition = ` - const $t1_attrs$ = ["for", "", ${AttributeMarker.SelectOnly}, "forOf"]; + const $t1_attrs$ = ["for", "", ${AttributeMarker.Bindings}, "forOf"]; function MyComponent_li_1_Template(rf, ctx) { if (rf & 1) { $r3$.ɵelementStart(0, "li"); @@ -2591,7 +2591,7 @@ describe('compiler compliance', () => { }; const MyComponentDefinition = ` - const $t4_attrs$ = ["for", "", ${AttributeMarker.SelectOnly}, "forOf"]; + const $t4_attrs$ = ["for", "", ${AttributeMarker.Bindings}, "forOf"]; function MyComponent_li_1_li_4_Template(rf, ctx) { if (rf & 1) { $r3$.ɵelementStart(0, "li"); 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 7b922505cb..1f53bce95f 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 @@ -74,7 +74,7 @@ describe('compiler compliance: bindings', () => { }; const template = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "title"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "title"]; … template:function MyComponent_Template(rf, $ctx$){ if (rf & 1) { @@ -108,7 +108,7 @@ describe('compiler compliance: bindings', () => { }; const template = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "title"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "title"]; … template:function MyComponent_Template(rf, $ctx$){ if (rf & 1) { @@ -162,7 +162,7 @@ describe('compiler compliance: bindings', () => { }; const template = ` - const $c0$ = [${AttributeMarker.SelectOnly}, "for"]; + const $c0$ = [${AttributeMarker.Bindings}, "for"]; // ... diff --git a/packages/compiler-cli/test/compliance/r3_view_compiler_directives_spec.ts b/packages/compiler-cli/test/compliance/r3_view_compiler_directives_spec.ts index 45bf4feaa0..567ea99b76 100644 --- a/packages/compiler-cli/test/compliance/r3_view_compiler_directives_spec.ts +++ b/packages/compiler-cli/test/compliance/r3_view_compiler_directives_spec.ts @@ -130,7 +130,7 @@ describe('compiler compliance: directives', () => { // MyComponent definition should be: const MyComponentDefinition = ` … - const _c0 = [${AttributeMarker.SelectOnly}, "someDirective"]; + const _c0 = [${AttributeMarker.Bindings}, "someDirective"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ … @@ -236,7 +236,7 @@ describe('compiler compliance: directives', () => { const MyComponentDefinition = ` … - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $_c1$ = ["directiveA", ""]; function MyComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) { @@ -291,7 +291,7 @@ describe('compiler compliance: directives', () => { // MyComponent definition should be: const MyComponentDefinition = ` … - const $c0_a0$ = [${AttributeMarker.SelectOnly}, "someDirective"]; + const $c0_a0$ = [${AttributeMarker.Bindings}, "someDirective"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ … @@ -388,7 +388,7 @@ describe('compiler compliance: directives', () => { // MyComponent definition should be: const MyComponentDefinition = ` … - const $c0_a0$ = [${AttributeMarker.SelectOnly}, "someDirective"]; + const $c0_a0$ = [${AttributeMarker.Bindings}, "someDirective"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ … 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 6216bcc15b..461e6b8f3d 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 @@ -417,7 +417,7 @@ describe('i18n support in the view compiler', () => { `; const output = String.raw ` - const $_c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; + const $_c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; /** * @desc d * @meaning m @@ -548,7 +548,7 @@ describe('i18n support in the view compiler', () => { `; const output = String.raw ` - const $_c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; + const $_c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; /** * @desc d * @meaning m @@ -1011,7 +1011,7 @@ describe('i18n support in the view compiler', () => { `; const output = String.raw ` - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $MSG_EXTERNAL_7679414751795588050$$APP_SPEC_TS__1$ = goog.getMsg(" Some other content {$interpolation} {$startTagDiv} More nested levels with bindings {$interpolation_1} {$closeTagDiv}", { "interpolation": "\uFFFD0\uFFFD", "startTagDiv": "\uFFFD#3\uFFFD", @@ -1067,7 +1067,7 @@ describe('i18n support in the view compiler', () => { const output = String.raw ` const $_c0$ = ["src", "logo.png"]; - const $_c1$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c1$ = [${AttributeMarker.Bindings}, "ngIf"]; function MyComponent_img_1_Template(rf, ctx) { if (rf & 1) { $r3$.ɵelement(0, "img", $_c0$); @@ -1136,7 +1136,7 @@ describe('i18n support in the view compiler', () => { `; const output = String.raw ` - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; function MyComponent_div_2_div_4_Template(rf, ctx) { if (rf & 1) { $r3$.ɵi18nStart(0, $I18N_EXTERNAL_1221890473527419724$$APP_SPEC_TS_0$, 2); @@ -1232,7 +1232,7 @@ describe('i18n support in the view compiler', () => { `; const output = String.raw ` - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $MSG_EXTERNAL_119975189388320493$$APP_SPEC_TS__1$ = goog.getMsg("Some other content {$startTagSpan}{$interpolation}{$closeTagSpan}", { "startTagSpan": "\uFFFD#2\uFFFD", "interpolation": "\uFFFD0\uFFFD", @@ -1864,7 +1864,7 @@ describe('i18n support in the view compiler', () => { const $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS_0$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_7842238767399919809$$APP_SPEC_TS_0$, { "VAR_SELECT": "\uFFFD0\uFFFD" }); - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $_c1$ = ["title", "icu only"]; const $MSG_EXTERNAL_8806993169187953163$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} other {other}}"); const $I18N_EXTERNAL_8806993169187953163$$APP_SPEC_TS__3$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_8806993169187953163$$APP_SPEC_TS__3$, { @@ -2113,7 +2113,7 @@ describe('i18n support in the view compiler', () => { const $I18N_APP_SPEC_TS_2$ = $r3$.ɵi18nPostprocess($MSG_APP_SPEC_TS_2$, { "VAR_SELECT": "\uFFFD1\uFFFD" }); - const $_c3$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c3$ = [${AttributeMarker.Bindings}, "ngIf"]; const $MSG_APP_SPEC_TS__4$ = goog.getMsg("{VAR_SELECT, select, male {male} female {female} other {other}}"); const $I18N_APP_SPEC_TS__4$ = $r3$.ɵi18nPostprocess($MSG_APP_SPEC_TS__4$, { "VAR_SELECT": "\uFFFD0:1\uFFFD" @@ -2223,7 +2223,7 @@ describe('i18n support in the view compiler', () => { const $I18N_EXTERNAL_7842238767399919809$$APP_SPEC_TS_1$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_7842238767399919809$$APP_SPEC_TS_1$, { "VAR_SELECT": "\uFFFD0\uFFFD" }); - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $MSG_EXTERNAL_7068143081688428291$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} 30 {thirty} other {other}}"); const $I18N_EXTERNAL_7068143081688428291$$APP_SPEC_TS__3$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_7068143081688428291$$APP_SPEC_TS__3$, { "VAR_SELECT": "\uFFFD0:1\uFFFD" @@ -2287,7 +2287,7 @@ describe('i18n support in the view compiler', () => { const $I18N_EXTERNAL_7825031864601787094$$APP_SPEC_TS_1$ = $r3$.ɵi18nPostprocess($MSG_EXTERNAL_7825031864601787094$$APP_SPEC_TS_1$, { "VAR_SELECT": "\uFFFD0\uFFFD" }); - const $_c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $_c0$ = [${AttributeMarker.Bindings}, "ngIf"]; const $MSG_EXTERNAL_2310343208266678305$$APP_SPEC_TS__3$ = goog.getMsg("{VAR_SELECT, select, 10 {ten} 20 {twenty} 30 {thirty} other {other: {$interpolation}}}", { "interpolation": "\uFFFD1:1\uFFFD" }); 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 207a0e2cb6..6fb133db67 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 @@ -41,7 +41,7 @@ describe('compiler compliance: listen()', () => { // The template should look like this (where IDENT is a wild card for an identifier): const template = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "click"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"]; … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { @@ -87,7 +87,7 @@ describe('compiler compliance: listen()', () => { }; const template = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "click"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"]; … template: function MyComponent_Template(rf, ctx) { if (rf & 1) { @@ -133,8 +133,8 @@ describe('compiler compliance: listen()', () => { }; const template = ` - const $t0_attrs$ = [${AttributeMarker.SelectOnly}, "ngIf"]; - const $e_attrs$ = [${AttributeMarker.SelectOnly}, "click"]; + const $t0_attrs$ = [${AttributeMarker.Bindings}, "ngIf"]; + const $e_attrs$ = [${AttributeMarker.Bindings}, "click"]; function MyComponent_div_0_Template(rf, ctx) { if (rf & 1) { @@ -195,7 +195,7 @@ describe('compiler compliance: listen()', () => { }; const MyComponentDefinition = ` - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "click"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "click"]; const $e2_refs$ = ["user", ""]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ 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 a98686358f..e1eb6b02b5 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 @@ -518,7 +518,7 @@ describe('compiler compliance: styling', () => { }; const template = ` - const $_c0$ = [${AttributeMarker.Styles}, "opacity", "1", ${AttributeMarker.SelectOnly}, "style"]; + const $_c0$ = [${AttributeMarker.Styles}, "opacity", "1", ${AttributeMarker.Bindings}, "style"]; const $_c1$ = ["width", "height"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ @@ -715,7 +715,7 @@ describe('compiler compliance: styling', () => { }; const template = ` - const $e0_attrs$ = [${AttributeMarker.Classes}, "grape", ${AttributeMarker.SelectOnly}, "class"]; + const $e0_attrs$ = [${AttributeMarker.Classes}, "grape", ${AttributeMarker.Bindings}, "class"]; const $e0_bindings$ = ["apple", "orange"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ @@ -771,7 +771,7 @@ describe('compiler compliance: styling', () => { }; const template = ` - const $e0_attrs$ = [${AttributeMarker.Classes}, "foo", ${AttributeMarker.Styles}, "width", "100px", ${AttributeMarker.SelectOnly}, "class", "style"]; + const $e0_attrs$ = [${AttributeMarker.Classes}, "foo", ${AttributeMarker.Styles}, "width", "100px", ${AttributeMarker.Bindings}, "class", "style"]; … MyComponent.ngComponentDef = $r3$.ɵdefineComponent({ type: MyComponent, 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 8f56fbe23a..294b71f86b 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 @@ -50,8 +50,8 @@ describe('compiler compliance: template', () => { // The template should look like this (where IDENT is a wild card for an identifier): const template = ` - const $c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; - const $e0_attrs$ = [${AttributeMarker.SelectOnly}, "title", "click"]; + const $c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; + const $e0_attrs$ = [${AttributeMarker.Bindings}, "title", "click"]; function MyComponent_ul_0_li_1_div_1_Template(rf, ctx) { if (rf & 1) { @@ -144,8 +144,8 @@ describe('compiler compliance: template', () => { }; const template = ` - const $t0_attrs$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; - const $e_attrs$ = [${AttributeMarker.SelectOnly}, "click"]; + const $t0_attrs$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; + const $e_attrs$ = [${AttributeMarker.Bindings}, "click"]; function MyComponent_div_0_Template(rf, ctx) { if (rf & 1) { @@ -199,7 +199,7 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; + const $c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; function MyComponent_span_0_Template(rf, ctx) { if (rf & 1) { @@ -253,8 +253,8 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; - const $c1$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; + const $c1$ = [${AttributeMarker.Bindings}, "ngIf"]; function MyComponent_div_0_span_1_Template(rf, ctx) { if (rf & 1) { @@ -326,7 +326,7 @@ describe('compiler compliance: template', () => { // The template should look like this (where IDENT is a wild card for an identifier): const template = ` - const $c0$ = ["ngFor", "", ${AttributeMarker.SelectOnly}, "ngForOf"]; + const $c0$ = ["ngFor", "", ${AttributeMarker.Bindings}, "ngForOf"]; function MyComponent_div_0_div_1_div_1_Template(rf, ctx) { if (rf & 1) { $i0$.ɵelementStart(0, "div"); @@ -403,7 +403,7 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = ["attr", "l", ${AttributeMarker.SelectOnly}, "boundAttr"]; + const $c0$ = ["attr", "l", ${AttributeMarker.Bindings}, "boundAttr"]; function MyComponent_ng_template_0_Template(rf, ctx) { if (rf & 1) { @@ -488,7 +488,7 @@ describe('compiler compliance: template', () => { }; const template = ` - const $t0_attrs$ = [${AttributeMarker.SelectOnly}, "outDirective"]; + const $t0_attrs$ = [${AttributeMarker.Bindings}, "outDirective"]; function MyComponent_ng_template_0_Template(rf, ctx) { } @@ -645,7 +645,7 @@ describe('compiler compliance: template', () => { }; const template = ` - const $c0$ = [${AttributeMarker.SelectOnly}, "ngIf"]; + const $c0$ = [${AttributeMarker.Bindings}, "ngIf"]; function MyComponent_div_0_Template(rf, ctx) { if (rf & 1) { diff --git a/packages/compiler/src/core.ts b/packages/compiler/src/core.ts index bb7de3cea7..8c3e9e4216 100644 --- a/packages/compiler/src/core.ts +++ b/packages/compiler/src/core.ts @@ -435,10 +435,19 @@ export const enum AttributeMarker { Styles = 2, /** - * This marker indicates that the following attribute names were extracted from bindings (ex.: - * [foo]="exp") and / or event handlers (ex. (bar)="doSth()"). - * Taking the above bindings and outputs as an example an attributes array could look as follows: - * ['class', 'fade in', AttributeMarker.SelectOnly, 'foo', 'bar'] + * Signals that the following attribute names were extracted from input or output bindings. + * + * For example, given the following HTML: + * + * ``` + *
+ * ``` + * + * the generated code is: + * + * ``` + * var _c1 = ['moo', 'car', AttributeMarker.Bindings, 'foo', 'bar']; + * ``` */ - SelectOnly = 3, + Bindings = 3, } diff --git a/packages/compiler/src/render3/view/template.ts b/packages/compiler/src/render3/view/template.ts index 751d89eda4..9ac5181ec7 100644 --- a/packages/compiler/src/render3/view/template.ts +++ b/packages/compiler/src/render3/view/template.ts @@ -578,8 +578,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver // this will build the instructions so that they fall into the following syntax // add attributes for directive matching purposes - attributes.push( - ...this.prepareSelectOnlyAttrs(allOtherInputs, element.outputs, stylingBuilder)); + attributes.push(...this.prepareBindingsAttrs(allOtherInputs, element.outputs, stylingBuilder)); parameters.push(this.toAttrsParam(attributes)); // local refs (ex.:
) @@ -801,7 +800,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver const attrsExprs: o.Expression[] = []; template.attributes.forEach( (a: t.TextAttribute) => { attrsExprs.push(asLiteral(a.name), asLiteral(a.value)); }); - attrsExprs.push(...this.prepareSelectOnlyAttrs(template.inputs, template.outputs)); + attrsExprs.push(...this.prepareBindingsAttrs(template.inputs, template.outputs)); parameters.push(this.toAttrsParam(attrsExprs)); // local refs (ex.: ) @@ -1045,13 +1044,13 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver * attrs = [prop, value, prop2, value2, * CLASSES, class1, class2, * STYLES, style1, value1, style2, value2, - * SELECT_ONLY, name1, name2, name2, ...] + * BINDINGS, name1, name2, name3, ...] * ``` * * Note that this function will fully ignore all synthetic (@foo) attribute values * because those values are intended to always be generated as property instructions. */ - private prepareSelectOnlyAttrs( + private prepareBindingsAttrs( inputs: t.BoundAttribute[], outputs: t.BoundEvent[], styles?: StylingBuilder): o.Expression[] { const alreadySeen = new Set(); @@ -1069,8 +1068,8 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver } } - // it's important that this occurs before SelectOnly because once `elementStart` - // comes across the SelectOnly marker then it will continue reading each value as + // it's important that this occurs before BINDINGS because once `elementStart` + // comes across the BINDINGS marker then it will continue reading each value as // as single property value cell by cell. if (styles) { styles.populateInitialStylingAttrs(attrExprs); @@ -1098,7 +1097,7 @@ export class TemplateDefinitionBuilder implements t.Visitor, LocalResolver // to the expressions. The marker is important because it tells the runtime // code that this is where attributes without values start... if (attrExprs.length) { - attrExprs.splice(attrsStartIndex, 0, o.literal(core.AttributeMarker.SelectOnly)); + attrExprs.splice(attrsStartIndex, 0, o.literal(core.AttributeMarker.Bindings)); } } diff --git a/packages/core/src/render3/di.ts b/packages/core/src/render3/di.ts index 6d94a78756..571733e2c4 100644 --- a/packages/core/src/render3/di.ts +++ b/packages/core/src/render3/di.ts @@ -272,7 +272,9 @@ export function injectAttributeImpl(tNode: TNode, attrNameToInject: string): str if (attrs) { for (let i = 0; i < attrs.length; i = i + 2) { const attrName = attrs[i]; - if (attrName === AttributeMarker.SelectOnly) break; + if (attrName === AttributeMarker.Bindings) break; + // TODO: What happens here if an attribute has a namespace? + // TODO: What happens here if the attribute name happens to match a CSS class or style? if (attrName == attrNameToInject) { return attrs[i + 1] as string; } diff --git a/packages/core/src/render3/instructions.ts b/packages/core/src/render3/instructions.ts index 224b21e78c..5516ab0b7b 100644 --- a/packages/core/src/render3/instructions.ts +++ b/packages/core/src/render3/instructions.ts @@ -2126,15 +2126,15 @@ function generateInitialInputs( let i = 0; while (i < attrs.length) { const attrName = attrs[i]; - // If we hit Select-Only, Classes or Styles, we're done anyway. None of those are valid inputs. - if (attrName === AttributeMarker.SelectOnly || attrName === AttributeMarker.Classes || - attrName === AttributeMarker.Styles) - break; if (attrName === AttributeMarker.NamespaceURI) { // We do not allow inputs on namespaced attributes. i += 4; continue; } + + // If we hit any other attribute markers, we're done anyway. None of those are valid inputs. + if (typeof attrName === 'number') break; + const minifiedInputName = inputs[attrName]; const attrValue = attrs[i + 1]; diff --git a/packages/core/src/render3/interfaces/node.ts b/packages/core/src/render3/interfaces/node.ts index 7e4af970fc..1350085948 100644 --- a/packages/core/src/render3/interfaces/node.ts +++ b/packages/core/src/render3/interfaces/node.ts @@ -107,12 +107,21 @@ export const enum AttributeMarker { Styles = 2, /** - * This marker indicates that the following attribute names were extracted from bindings (ex.: - * [foo]="exp") and / or event handlers (ex. (bar)="doSth()"). - * Taking the above bindings and outputs as an example an attributes array could look as follows: - * ['class', 'fade in', AttributeMarker.SelectOnly, 'foo', 'bar'] + * Signals that the following attribute names were extracted from input or output bindings. + * + * For example, given the following HTML: + * + * ``` + *
+ * ``` + * + * the generated code is: + * + * ``` + * var _c1 = ['moo', 'car', AttributeMarker.Bindings, 'foo', 'bar']; + * ``` */ - SelectOnly = 3, + Bindings = 3, } /** diff --git a/packages/core/src/render3/node_selector_matcher.ts b/packages/core/src/render3/node_selector_matcher.ts index aabd4d61e9..f85c15b28d 100644 --- a/packages/core/src/render3/node_selector_matcher.ts +++ b/packages/core/src/render3/node_selector_matcher.ts @@ -60,8 +60,8 @@ export function isNodeMatchingSelector( tNode: TNode, selector: CssSelector, isProjectionMode: boolean): boolean { ngDevMode && assertDefined(selector[0], 'Selector should have a tag name'); let mode: SelectorFlags = SelectorFlags.ELEMENT; - const nodeAttrs = tNode.attrs !; - const selectOnlyMarkerIdx = nodeAttrs ? nodeAttrs.indexOf(AttributeMarker.SelectOnly) : -1; + const nodeAttrs = tNode.attrs || []; + const nameOnlyMarkerIdx = nodeAttrs.indexOf(AttributeMarker.Bindings); // When processing ":not" selectors, we skip to the next ":not" if the // current one doesn't match @@ -116,7 +116,7 @@ export function isNodeMatchingSelector( if (selectorAttrValue !== '') { let nodeAttrValue: string; const maybeAttrName = nodeAttrs[attrIndexInNode]; - if (selectOnlyMarkerIdx > -1 && attrIndexInNode > selectOnlyMarkerIdx) { + if (attrIndexInNode > nameOnlyMarkerIdx) { nodeAttrValue = ''; } else { ngDevMode && assertNotEqual( @@ -154,7 +154,7 @@ function readClassValueFromTNode(tNode: TNode): string { } /** - * Examines an attributes definition array from a node to find the index of the + * Examines an attribute's definition array from a node to find the index of the * attribute with the specified name. * * NOTE: Will not find namespaced attributes. @@ -164,7 +164,7 @@ function readClassValueFromTNode(tNode: TNode): string { */ function findAttrIndexInNode(name: string, attrs: TAttributes | null): number { if (attrs === null) return -1; - let selectOnlyMode = false; + let nameOnlyMode = false; let i = 0; while (i < attrs.length) { const maybeAttrName = attrs[i]; @@ -174,10 +174,10 @@ function findAttrIndexInNode(name: string, attrs: TAttributes | null): number { // NOTE(benlesh): will not find namespaced attributes. This is by design. i += 4; } else { - if (maybeAttrName === AttributeMarker.SelectOnly) { - selectOnlyMode = true; + if (maybeAttrName === AttributeMarker.Bindings) { + nameOnlyMode = true; } - i += selectOnlyMode ? 1 : 2; + i += nameOnlyMode ? 1 : 2; } } diff --git a/packages/core/test/render3/common_integration_spec.ts b/packages/core/test/render3/common_integration_spec.ts index 9acd912e89..d50d4b8acd 100644 --- a/packages/core/test/render3/common_integration_spec.ts +++ b/packages/core/test/render3/common_integration_spec.ts @@ -973,7 +973,7 @@ describe('@angular/common integration', () => { } }, 1, 0, 'ng-template', undefined, ['tpl', ''], templateRefExtractor); template( - 2, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngTemplateOutlet']); + 2, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'ngTemplateOutlet']); } if (rf & RenderFlags.Update) { const tplRef = load(1); @@ -1016,7 +1016,7 @@ describe('@angular/common integration', () => { text(0, 'from tpl'); } }, 1, 0, 'ng-template', undefined, ['tpl', ''], templateRefExtractor); - elementContainerStart(2, [AttributeMarker.SelectOnly, 'ngTemplateOutlet']); + elementContainerStart(2, [AttributeMarker.Bindings, 'ngTemplateOutlet']); elementContainerEnd(); } if (rf & RenderFlags.Update) { diff --git a/packages/core/test/render3/component_spec.ts b/packages/core/test/render3/component_spec.ts index 863754af0c..6a4064d6fc 100644 --- a/packages/core/test/render3/component_spec.ts +++ b/packages/core/test/render3/component_spec.ts @@ -186,7 +186,7 @@ it('should not invoke renderer destroy method for embedded views', () => { elementStart(0, 'div'); text(1, 'Root view'); elementEnd(); - template(2, MyComponent_div_Template_2, 2, 0, null, [AttributeMarker.SelectOnly, 'ngIf']); + template(2, MyComponent_div_Template_2, 2, 0, null, [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(2, 'ngIf', bind(ctx.visible)); @@ -514,8 +514,8 @@ describe('recursive components', () => { if (rf & RenderFlags.Create) { text(0); - template(1, IfTemplate, 1, 1, 'ng-if-tree', [AttributeMarker.SelectOnly, 'ngIf']); - template(2, IfTemplate2, 1, 1, 'ng-if-tree', [AttributeMarker.SelectOnly, 'ngIf']); + template(1, IfTemplate, 1, 1, 'ng-if-tree', [AttributeMarker.Bindings, 'ngIf']); + template(2, IfTemplate2, 1, 1, 'ng-if-tree', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { textBinding(0, bind(ctx.data.value)); diff --git a/packages/core/test/render3/content_spec.ts b/packages/core/test/render3/content_spec.ts index 235a932d0e..c2cfe38ae2 100644 --- a/packages/core/test/render3/content_spec.ts +++ b/packages/core/test/render3/content_spec.ts @@ -815,7 +815,7 @@ describe('content projection', () => { if (rf & RenderFlags.Create) { projectionDef(); text(0, 'Before-'); - template(1, IfTemplate, 1, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngIf']); + template(1, IfTemplate, 1, 0, 'ng-template', [AttributeMarker.Bindings, 'ngIf']); text(2, '-After'); } if (rf & RenderFlags.Update) { @@ -879,7 +879,7 @@ describe('content projection', () => { if (rf & RenderFlags.Create) { projectionDef(); text(0, 'Before-'); - template(1, IfTemplate, 1, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngIf']); + template(1, IfTemplate, 1, 0, 'ng-template', [AttributeMarker.Bindings, 'ngIf']); text(2, '-After'); } if (rf & RenderFlags.Update) { @@ -945,7 +945,7 @@ describe('content projection', () => { projectionDef([[['div']]], ['div']); projection(0); text(1, 'Before-'); - template(2, IfTemplate, 1, 0, '', [AttributeMarker.SelectOnly, 'ngIf']); + template(2, IfTemplate, 1, 0, '', [AttributeMarker.Bindings, 'ngIf']); text(3, '-After'); } if (rf & RenderFlags.Update) { @@ -1058,7 +1058,7 @@ describe('content projection', () => { */ const App = createComponent('app', (rf: RenderFlags, ctx: any) => { if (rf & RenderFlags.Create) { - element(0, 'button', [AttributeMarker.SelectOnly, 'trigger']); + element(0, 'button', [AttributeMarker.Bindings, 'trigger']); elementStart(1, 'comp', null, ['comp', '']); { text(3, 'Some content'); } elementEnd(); @@ -1370,7 +1370,7 @@ describe('content projection', () => { content - + `; const Parent = createComponent('parent', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { @@ -1419,7 +1419,7 @@ describe('content projection', () => { content - + `; const Parent = createComponent('parent', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { @@ -1590,7 +1590,7 @@ describe('content projection', () => { if (rf & RenderFlags.Create) { elementStart(0, 'child'); { - elementStart(1, 'span', [AttributeMarker.SelectOnly, 'title']); + elementStart(1, 'span', [AttributeMarker.Bindings, 'title']); { text(2, 'Has title'); } elementEnd(); } @@ -2089,7 +2089,7 @@ describe('content projection', () => { const Parent = createComponent('parent', function(rf: RenderFlags, ctx: {value: any}) { if (rf & RenderFlags.Create) { elementStart(0, 'child'); - { template(1, IfTemplate, 2, 0, 'div', [AttributeMarker.SelectOnly, 'ngIf']); } + { template(1, IfTemplate, 2, 0, 'div', [AttributeMarker.Bindings, 'ngIf']); } elementEnd(); } if (rf & RenderFlags.Update) { diff --git a/packages/core/test/render3/di_spec.ts b/packages/core/test/render3/di_spec.ts index 2f2b514320..bbd6952bea 100644 --- a/packages/core/test/render3/di_spec.ts +++ b/packages/core/test/render3/di_spec.ts @@ -490,7 +490,7 @@ describe('di', () => { const App = createComponent('app', (rf: RenderFlags, ctx: any) => { if (rf & RenderFlags.Create) { elementStart(0, 'div', ['dirB', '']); - { template(1, IfTemplate, 4, 1, 'div', [AttributeMarker.SelectOnly, 'ngIf', '']); } + { template(1, IfTemplate, 4, 1, 'div', [AttributeMarker.Bindings, 'ngIf', '']); } elementEnd(); } if (rf & RenderFlags.Update) { @@ -2135,7 +2135,7 @@ describe('di', () => { const MyApp = createComponent('my-app', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - elementStart(0, 'div', ['exist', 'existValue', AttributeMarker.SelectOnly, 'nonExist']); + elementStart(0, 'div', ['exist', 'existValue', AttributeMarker.Bindings, 'nonExist']); exist = injectAttribute('exist'); nonExist = injectAttribute('nonExist'); } @@ -2153,7 +2153,7 @@ describe('di', () => { const MyApp = createComponent('my-app', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { elementStart(0, 'div', [ - 'exist', 'existValue', AttributeMarker.SelectOnly, 'binding1', 'nonExist', 'binding2' + 'exist', 'existValue', AttributeMarker.Bindings, 'binding1', 'nonExist', 'binding2' ]); exist = injectAttribute('exist'); nonExist = injectAttribute('nonExist'); diff --git a/packages/core/test/render3/directive_spec.ts b/packages/core/test/render3/directive_spec.ts index 63bc33692c..045bbcf373 100644 --- a/packages/core/test/render3/directive_spec.ts +++ b/packages/core/test/render3/directive_spec.ts @@ -53,7 +53,7 @@ describe('directive', () => { */ function createTemplate() { // using 2 bindings to show example shape of attributes array - element(0, 'span', ['class', 'fade', AttributeMarker.SelectOnly, 'test', 'other']); + element(0, 'span', ['class', 'fade', AttributeMarker.Bindings, 'test', 'other']); } function updateTemplate() { elementProperty(0, 'test', bind(false)); } @@ -105,7 +105,7 @@ describe('directive', () => { function createTemplate() { // putting name (test) in the "usual" value position element( - 0, 'span', ['class', 'fade', AttributeMarker.SelectOnly, 'prop1', 'test', 'prop2']); + 0, 'span', ['class', 'fade', AttributeMarker.Bindings, 'prop1', 'test', 'prop2']); } function updateTemplate() { @@ -208,7 +208,7 @@ describe('directive', () => { if (rf & RenderFlags.Create) { template( 0, MyComponent_ng_container_Template_0, 2, 0, 'ng-container', - [AttributeMarker.SelectOnly, 'ngIf']); + [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(0, 'ngIf', bind(ctx.visible)); @@ -240,7 +240,7 @@ describe('directive', () => { * */ function createTemplate() { - elementStart(0, 'span', [AttributeMarker.SelectOnly, 'out']); + elementStart(0, 'span', [AttributeMarker.Bindings, 'out']); { listener('out', () => {}); } elementEnd(); } @@ -274,7 +274,7 @@ describe('directive', () => { */ const Cmpt = createComponent('Cmpt', function(rf: RenderFlags, ctx: {value: any}) { if (rf & RenderFlags.Create) { - template(0, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'out']); + template(0, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'out']); listener('out', () => { ctx.value = true; }); } }, 1, 0, [Directive]); @@ -295,7 +295,7 @@ describe('directive', () => { */ const Cmpt = createComponent('Cmpt', function(rf: RenderFlags, ctx: {value: any}) { if (rf & RenderFlags.Create) { - elementContainerStart(0, [AttributeMarker.SelectOnly, 'out']); + elementContainerStart(0, [AttributeMarker.Bindings, 'out']); { listener('out', () => { ctx.value = true; }); } diff --git a/packages/core/test/render3/exports_spec.ts b/packages/core/test/render3/exports_spec.ts index c8cab82482..4e3b8d0ff9 100644 --- a/packages/core/test/render3/exports_spec.ts +++ b/packages/core/test/render3/exports_spec.ts @@ -232,7 +232,7 @@ describe('exports', () => { if (rf & RenderFlags.Create) { elementStart(0, 'input', ['value', 'one'], ['outerInput', '']); elementEnd(); - template(2, outerTemplate, 5, 2, 'div', [AttributeMarker.SelectOnly, 'ngIf']); + template(2, outerTemplate, 5, 2, 'div', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(2, 'ngIf', bind(app.outer)); @@ -246,7 +246,7 @@ describe('exports', () => { text(1); elementStart(2, 'input', ['value', 'two'], ['innerInput', '']); elementEnd(); - template(4, innerTemplate, 2, 2, 'div', [AttributeMarker.SelectOnly, 'ngIf']); + template(4, innerTemplate, 2, 2, 'div', [AttributeMarker.Bindings, 'ngIf']); } elementEnd(); } diff --git a/packages/core/test/render3/host_binding_spec.ts b/packages/core/test/render3/host_binding_spec.ts index a1af92fe26..9bb9813c05 100644 --- a/packages/core/test/render3/host_binding_spec.ts +++ b/packages/core/test/render3/host_binding_spec.ts @@ -107,7 +107,7 @@ describe('host bindings', () => { }); } - function Template() { element(0, 'span', [AttributeMarker.SelectOnly, 'dir']); } + function Template() { element(0, 'span', [AttributeMarker.Bindings, 'dir']); } const fixture = new TemplateFixture(Template, () => {}, 1, 0, [Directive]); expect(fixture.html).toEqual(''); diff --git a/packages/core/test/render3/i18n_spec.ts b/packages/core/test/render3/i18n_spec.ts index 89c6cadfe5..2a43416bbc 100644 --- a/packages/core/test/render3/i18n_spec.ts +++ b/packages/core/test/render3/i18n_spec.ts @@ -1392,19 +1392,19 @@ describe('Runtime i18n', () => { directives: [Directive], template: (rf: RenderFlags, ctx: MyApp) => { if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'dir']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'dir']); { i18nAttributes(1, MSG_DIV_1_ATTR_1); i18nStart(2, MSG_DIV_1); { - elementStart(3, 'b', [AttributeMarker.SelectOnly, 'dir']); // Will be removed + elementStart(3, 'b', [AttributeMarker.Bindings, 'dir']); // Will be removed { i18nAttributes(4, MSG_DIV_1_ATTR_1); } elementEnd(); } i18nEnd(); } elementEnd(); - element(5, 'div', [AttributeMarker.SelectOnly, 'dir']); + element(5, 'div', [AttributeMarker.Bindings, 'dir']); } if (rf & RenderFlags.Update) { i18nExp(bind(ctx.exp1)); diff --git a/packages/core/test/render3/inherit_definition_feature_spec.ts b/packages/core/test/render3/inherit_definition_feature_spec.ts index 1ec9214fbd..c2f7553814 100644 --- a/packages/core/test/render3/inherit_definition_feature_spec.ts +++ b/packages/core/test/render3/inherit_definition_feature_spec.ts @@ -600,7 +600,7 @@ describe('InheritDefinitionFeature', () => { */ const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'sub-dir']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'sub-dir']); { element(1, 'span', null, ['foo', '']); element(3, 'span', null, ['bar', '']); diff --git a/packages/core/test/render3/integration_spec.ts b/packages/core/test/render3/integration_spec.ts index 5e396bee48..6e825ebd0f 100644 --- a/packages/core/test/render3/integration_spec.ts +++ b/packages/core/test/render3/integration_spec.ts @@ -722,7 +722,7 @@ describe('render3 integration test', () => { createComponent('test-cmpt', function(rf: RenderFlags, ctx: {value: any}) { if (rf & RenderFlags.Create) { template( - 0, ngIfTemplate, 2, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngIf']); + 0, ngIfTemplate, 2, 0, 'ng-template', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(0, 'ngIf', bind(ctx.value)); @@ -782,7 +782,7 @@ describe('render3 integration test', () => { if (rf & RenderFlags.Create) { template( 0, embeddedTemplate, 2, 0, 'ng-template', - [AttributeMarker.SelectOnly, 'testDirective']); + [AttributeMarker.Bindings, 'testDirective']); } }, 1, 0, [TestDirective]); @@ -899,7 +899,7 @@ describe('render3 integration test', () => { if (rf & RenderFlags.Create) { template( 0, embeddedTemplate, 4, 0, 'ng-template', - [AttributeMarker.SelectOnly, 'testDirective']); + [AttributeMarker.Bindings, 'testDirective']); } }, 1, 0, [TestDirective]); @@ -941,7 +941,7 @@ describe('render3 integration test', () => { function Template() { elementStart(0, 'div'); { - elementContainerStart(1, [AttributeMarker.SelectOnly, 'dir']); + elementContainerStart(1, [AttributeMarker.Bindings, 'dir']); elementContainerEnd(); } elementEnd(); @@ -986,7 +986,7 @@ describe('render3 integration test', () => { */ const App = createComponent('app', function(rf: RenderFlags) { if (rf & RenderFlags.Create) { - elementContainerStart(0, [AttributeMarker.SelectOnly, 'dir']); + elementContainerStart(0, [AttributeMarker.Bindings, 'dir']); template( 1, ContentTemplate, 1, 0, 'ng-template', null, ['content', ''], templateRefExtractor); elementContainerEnd(); @@ -1044,7 +1044,7 @@ describe('render3 integration test', () => { if (rf & RenderFlags.Create) { elementContainerStart(0); template( - 1, ContentTemplate, 1, 0, 'ng-template', [AttributeMarker.SelectOnly, 'dir'], [], + 1, ContentTemplate, 1, 0, 'ng-template', [AttributeMarker.Bindings, 'dir'], [], templateRefExtractor); elementContainerEnd(); } @@ -2269,7 +2269,7 @@ describe('component animations', () => { factory: () => new AnimComp(), template: (rf: RenderFlags, ctx: AnimComp) => { if (rf & RenderFlags.Create) { - element(0, 'div', [AttributeMarker.SelectOnly, '@fooAnimation']); + element(0, 'div', [AttributeMarker.Bindings, '@fooAnimation']); } if (rf & RenderFlags.Update) { elementAttribute(0, '@fooAnimation', bind(ctx.animationValue)); diff --git a/packages/core/test/render3/lifecycle_spec.ts b/packages/core/test/render3/lifecycle_spec.ts index 72ebed8263..eb9c497948 100644 --- a/packages/core/test/render3/lifecycle_spec.ts +++ b/packages/core/test/render3/lifecycle_spec.ts @@ -2970,7 +2970,7 @@ describe('lifecycles', () => { function conditionTpl(rf: RenderFlags, ctx: Cmpt) { if (rf & RenderFlags.Create) { template( - 0, null, 0, 1, 'ng-template', [AttributeMarker.SelectOnly, 'onDestroyDirective']); + 0, null, 0, 1, 'ng-template', [AttributeMarker.Bindings, 'onDestroyDirective']); } } @@ -2981,7 +2981,7 @@ describe('lifecycles', () => { */ function cmptTpl(rf: RenderFlags, cmpt: Cmpt) { if (rf & RenderFlags.Create) { - template(0, conditionTpl, 1, 1, 'ng-template', [AttributeMarker.SelectOnly, 'ngIf']); + template(0, conditionTpl, 1, 1, 'ng-template', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(0, 'ngIf', bind(cmpt.showing)); diff --git a/packages/core/test/render3/node_selector_matcher_spec.ts b/packages/core/test/render3/node_selector_matcher_spec.ts index 0b55dd306d..1af7bfeb80 100644 --- a/packages/core/test/render3/node_selector_matcher_spec.ts +++ b/packages/core/test/render3/node_selector_matcher_spec.ts @@ -181,14 +181,14 @@ describe('css selector matching', () => { }); it('should take optional binding attribute names into account', () => { - expect(isMatching('span', [AttributeMarker.SelectOnly, 'directive'], [ + expect(isMatching('span', [AttributeMarker.Bindings, 'directive'], [ '', 'directive', '' ])).toBeTruthy(`Selector '[directive]' should match `); }); it('should not match optional binding attribute names if attribute selector has value', () => { - expect(isMatching('span', [AttributeMarker.SelectOnly, 'directive'], [ + expect(isMatching('span', [AttributeMarker.Bindings, 'directive'], [ '', 'directive', 'value' ])).toBeFalsy(`Selector '[directive=value]' should not match `); }); @@ -196,7 +196,7 @@ describe('css selector matching', () => { it('should not match optional binding attribute names if attribute selector has value and next name equals to value', () => { expect(isMatching( - 'span', [AttributeMarker.SelectOnly, 'directive', 'value'], + 'span', [AttributeMarker.Bindings, 'directive', 'value'], ['', 'directive', 'value'])) .toBeFalsy( `Selector '[directive=value]' should not match `); diff --git a/packages/core/test/render3/pure_function_spec.ts b/packages/core/test/render3/pure_function_spec.ts index 81e4a3519e..73e3566d6b 100644 --- a/packages/core/test/render3/pure_function_spec.ts +++ b/packages/core/test/render3/pure_function_spec.ts @@ -87,7 +87,7 @@ describe('array literals', () => { */ const App = createComponent('app', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - template(0, IfTemplate, 1, 3, 'my-comp', [AttributeMarker.SelectOnly, 'ngIf']); + template(0, IfTemplate, 1, 3, 'my-comp', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(0, 'ngIf', bind(ctx.showing)); diff --git a/packages/core/test/render3/query_spec.ts b/packages/core/test/render3/query_spec.ts index 5362544d1a..eccb58954e 100644 --- a/packages/core/test/render3/query_spec.ts +++ b/packages/core/test/render3/query_spec.ts @@ -1540,7 +1540,7 @@ describe('query', () => { template( 4, Cmpt_Template_5, 2, 1, 'ng-template', null, ['tpl2', ''], templateRefExtractor); - template(6, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'vc']); + template(6, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'vc']); } if (rf & RenderFlags.Update) { @@ -1637,8 +1637,8 @@ describe('query', () => { template( 0, Cmpt_Template_1, 2, 1, 'ng-template', [], ['tpl', ''], templateRefExtractor); - template(2, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'vc']); - template(3, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'vc']); + template(2, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'vc']); + template(3, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'vc']); } if (rf & RenderFlags.Update) { @@ -1711,7 +1711,7 @@ describe('query', () => { 0, MyApp_Template_1, 2, 0, 'ng-template', undefined, ['tpl', ''], templateRefExtractor); template( - 2, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngTemplateOutlet']); + 2, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'ngTemplateOutlet']); } if (rf & RenderFlags.Update) { const tplRef = reference(1); @@ -2207,7 +2207,7 @@ describe('query', () => { function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { template( - 0, AppComponent_Template_1, 1, 0, 'div', [AttributeMarker.SelectOnly, 'someDir']); + 0, AppComponent_Template_1, 1, 0, 'div', [AttributeMarker.Bindings, 'someDir']); element(1, 'div', null, ['foo', '']); } }, @@ -2295,7 +2295,7 @@ describe('query', () => { */ const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'with-content']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'with-content']); { element(1, 'span', null, ['foo', '']); } elementEnd(); } @@ -2334,7 +2334,7 @@ describe('query', () => { for (let i = 0; i < 3; i++) { let rf = embeddedViewStart(1, 3, 0); if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'with-content']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'with-content']); { element(1, 'span', null, ['foo', '']); } elementEnd(); } @@ -2392,7 +2392,7 @@ describe('query', () => { const AppComponent = createComponent('app-component', function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { elementStart(0, 'shallow-comp'); - { template(1, IfTemplate, 2, 0, 'div', [AttributeMarker.SelectOnly, 'ngIf', '']); } + { template(1, IfTemplate, 2, 0, 'div', [AttributeMarker.Bindings, 'ngIf', '']); } elementEnd(); } if (rf & RenderFlags.Update) { @@ -2531,10 +2531,10 @@ describe('query', () => { */ function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'query'], ['out', 'query']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'query'], ['out', 'query']); { element(2, 'span', ['id', 'foo'], ['foo', '']); - elementStart(4, 'div', [AttributeMarker.SelectOnly, 'query'], ['in', 'query']); + elementStart(4, 'div', [AttributeMarker.Bindings, 'query'], ['in', 'query']); { element(6, 'span', ['id', 'bar'], ['bar', '']); } elementEnd(); element(8, 'span', ['id', 'baz'], ['baz', '']); @@ -2732,7 +2732,7 @@ describe('query', () => { function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { elementStart( - 0, 'div', [AttributeMarker.SelectOnly, 'shallow-query', 'deep-query'], + 0, 'div', [AttributeMarker.Bindings, 'shallow-query', 'deep-query'], ['shallow', 'shallow-query', 'deep', 'deep-query']); { element(3, 'span', null, ['foo', '']); diff --git a/packages/core/test/render3/template_ref_spec.ts b/packages/core/test/render3/template_ref_spec.ts index 6abede7cef..8afc300055 100644 --- a/packages/core/test/render3/template_ref_spec.ts +++ b/packages/core/test/render3/template_ref_spec.ts @@ -108,7 +108,7 @@ describe('TemplateRef', () => { function embeddedTemplate(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - template(0, ngIfTemplate, 1, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngIf']); + template(0, ngIfTemplate, 1, 0, 'ng-template', [AttributeMarker.Bindings, 'ngIf']); } if (rf & RenderFlags.Update) { elementProperty(0, 'ngIf', bind(ctx.showing)); diff --git a/packages/core/test/render3/view_container_ref_spec.ts b/packages/core/test/render3/view_container_ref_spec.ts index a3f6eb29dd..f2b1890da8 100644 --- a/packages/core/test/render3/view_container_ref_spec.ts +++ b/packages/core/test/render3/view_container_ref_spec.ts @@ -542,7 +542,7 @@ describe('ViewContainerRef', () => { vars: 2, template: function(rf: RenderFlags, ctx: any) { if (rf & RenderFlags.Create) { - elementStart(0, 'div', [AttributeMarker.SelectOnly, 'tplDir']); + elementStart(0, 'div', [AttributeMarker.Bindings, 'tplDir']); { text(1); } elementEnd(); } @@ -628,7 +628,7 @@ describe('ViewContainerRef', () => { vars: 2, template: function(rf: RenderFlags, loop: any) { if (rf & RenderFlags.Create) { - template(0, null, 0, 0, 'ng-template', [AttributeMarker.SelectOnly, 'ngForOf']); + template(0, null, 0, 0, 'ng-template', [AttributeMarker.Bindings, 'ngForOf']); } if (rf & RenderFlags.Update) {