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: + * + * ``` + *