refactor(ivy): ensure new attribute instructons are available in JIT (#30503)

PR Close #30503

packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts

@@ -533,7 +533,7 @@ describe('compiler compliance: bindings', () => {
           i0.ɵɵselect(8);
           i0.ɵɵattributeInterpolate1("title", "a", ctx.one, "b");
           i0.ɵɵselect(9);
-          i0.ɵɵattributeInterpolate("title", ctx.one);
+          i0.ɵɵattribute("title", ctx.one);
       }
       …
       `;

packages/compiler/src/render3/r3_identifiers.ts

@@ -43,8 +43,6 @@ export class Identifiers {
 
   static attribute: o.ExternalReference = {name: 'ɵɵattribute', moduleName: CORE};
 
-  static attributeInterpolate:
-      o.ExternalReference = {name: 'ɵɵattributeInterpolate', moduleName: CORE};
   static attributeInterpolate1:
       o.ExternalReference = {name: 'ɵɵattributeInterpolate1', moduleName: CORE};
   static attributeInterpolate2:

packages/compiler/src/render3/view/template.ts

@@ -763,15 +763,16 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
                   R3.property, elementIndex, attrName, input, implicit, value, params);
             }
           } else if (inputType === BindingType.Attribute) {
-            if (value instanceof Interpolation) {
-              // attr.name="{{value}}" and friends
+            if (value instanceof Interpolation && getInterpolationArgsLength(value) > 1) {
+              // attr.name="text{{value}}" and friends
               this.interpolatedUpdateInstruction(
                   getAttributeInterpolationExpression(value), elementIndex, attrName, input, value,
                   params);
             } else {
-              // [attr.name]="value"
+              const boundValue = value instanceof Interpolation ? value.expressions[0] : value;
+              // [attr.name]="value" or attr.name="{{value}}"
               this.boundUpdateInstruction(
-                  R3.attribute, elementIndex, attrName, input, implicit, value, params);
+                  R3.attribute, elementIndex, attrName, input, implicit, boundValue, params);
             }
           } else {
             // class prop
@@ -1714,8 +1715,6 @@ function getPropertyInterpolationExpression(interpolation: Interpolation) {
  */
 function getAttributeInterpolationExpression(interpolation: Interpolation) {
   switch (getInterpolationArgsLength(interpolation)) {
-    case 1:
-      return R3.attributeInterpolate;
     case 3:
       return R3.attributeInterpolate1;
     case 5:

packages/core/src/core_render3_private_export.ts

@@ -9,7 +9,6 @@
 // clang-format off
 export {
   ɵɵattribute,
-  ɵɵattributeInterpolate,
   ɵɵattributeInterpolate1,
   ɵɵattributeInterpolate2,
   ɵɵattributeInterpolate3,

packages/core/src/render3/index.ts

@@ -25,7 +25,6 @@ export {
   ɵɵallocHostVars,
 
   ɵɵattribute,
-  ɵɵattributeInterpolate,
   ɵɵattributeInterpolate1,
   ɵɵattributeInterpolate2,
   ɵɵattributeInterpolate3,

packages/core/src/render3/instructions/attribute.ts

@@ -8,8 +8,8 @@
 import {SanitizerFn} from '../interfaces/sanitization';
 import {getSelectedIndex} from '../state';
 
-import {ΔelementAttribute} from './element';
-import {Δbind} from './property';
+import {ɵɵelementAttribute} from './element';
+import {ɵɵbind} from './property';
 
 /**
  * Updates the value of or removes a bound attribute on an Element.
@@ -24,8 +24,9 @@ import {Δbind} from './property';
  *
  * @codeGenApi
  */
-export function Δattribute(
+export function ɵɵattribute(
     name: string, value: any, sanitizer?: SanitizerFn | null, namespace?: string) {
   const index = getSelectedIndex();
-  return ΔelementAttribute(index, name, Δbind(value), sanitizer, namespace);
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  return ɵɵelementAttribute(index, name, ɵɵbind(value), sanitizer, namespace);
 }

packages/core/src/render3/instructions/attribute_interpolation.ts

@@ -7,40 +7,10 @@
  */
 import {SanitizerFn} from '../interfaces/sanitization';
 import {getSelectedIndex} from '../state';
-import {ΔelementAttribute} from './element';
-import {Δinterpolation1, Δinterpolation2, Δinterpolation3, Δinterpolation4, Δinterpolation5, Δinterpolation6, Δinterpolation7, Δinterpolation8, ΔinterpolationV} from './property_interpolation';
+import {ɵɵelementAttribute} from './element';
+import {ɵɵinterpolation1, ɵɵinterpolation2, ɵɵinterpolation3, ɵɵinterpolation4, ɵɵinterpolation5, ɵɵinterpolation6, ɵɵinterpolation7, ɵɵinterpolation8, ɵɵinterpolationV} from './property_interpolation';
 import {TsickleIssue1009} from './shared';
 
-/**
- *
- * Update an interpolated attribute on an element with a lone bound value
- *
- * Used when the value passed to a property has 1 interpolated value in it, an no additional text
- * surrounds that interpolated value:
- *
- * ```html
- * <div attr.title="{{v0}}"></div>
- * ```
- *
- * Its compiled representation is::
- *
- * ```ts
- * ΔattributeInterpolate('title', v0);
- * ```
- *
- * @param attrName The name of the attribute to update
- * @param prefix Static value used for concatenation only.
- * @param v0 Value checked for change.
- * @param suffix Static value used for concatenation only.
- * @param sanitizer An optional sanitizer function
- * @returns itself, so that it may be chained.
- * @codeGenApi
- */
-export function ΔattributeInterpolate(
-    attrName: string, v0: any, sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
-  ΔattributeInterpolate1(attrName, '', v0, '', sanitizer);
-  return ΔattributeInterpolate;
-}
 
 
 /**
@@ -56,7 +26,7 @@ export function ΔattributeInterpolate(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate1('title', 'prefix', v0, 'suffix');
+ * ɵɵattributeInterpolate1('title', 'prefix', v0, 'suffix');
  * ```
  *
  * @param attrName The name of the attribute to update
@@ -67,15 +37,17 @@ export function ΔattributeInterpolate(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate1(
+export function ɵɵattributeInterpolate1(
     attrName: string, prefix: string, v0: any, suffix: string, sanitizer?: SanitizerFn,
     namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  const interpolatedValue = Δinterpolation1(prefix, v0, suffix);
 
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  const interpolatedValue = ɵɵinterpolation1(prefix, v0, suffix);
 
-  return ΔattributeInterpolate1;
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+
+  return ɵɵattributeInterpolate1;
 }
 
 /**
@@ -91,7 +63,7 @@ export function ΔattributeInterpolate1(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate2('title', 'prefix', v0, '-', v1, 'suffix');
+ * ɵɵattributeInterpolate2('title', 'prefix', v0, '-', v1, 'suffix');
  * ```
  *
  * @param attrName The name of the attribute to update
@@ -104,13 +76,15 @@ export function ΔattributeInterpolate1(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate2(
+export function ɵɵattributeInterpolate2(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, suffix: string,
     sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  const interpolatedValue = Δinterpolation2(prefix, v0, i0, v1, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate2;
+
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  const interpolatedValue = ɵɵinterpolation2(prefix, v0, i0, v1, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate2;
 }
 
 /**
@@ -126,7 +100,7 @@ export function ΔattributeInterpolate2(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate3(
+ * ɵɵattributeInterpolate3(
  * 'title', 'prefix', v0, '-', v1, '-', v2, 'suffix');
  * ```
  *
@@ -142,13 +116,15 @@ export function ΔattributeInterpolate2(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate3(
+export function ɵɵattributeInterpolate3(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any,
     suffix: string, sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  const interpolatedValue = Δinterpolation3(prefix, v0, i0, v1, i1, v2, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate3;
+
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  const interpolatedValue = ɵɵinterpolation3(prefix, v0, i0, v1, i1, v2, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate3;
 }
 
 /**
@@ -164,7 +140,7 @@ export function ΔattributeInterpolate3(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate4(
+ * ɵɵattributeInterpolate4(
  * 'title', 'prefix', v0, '-', v1, '-', v2, '-', v3, 'suffix');
  * ```
  *
@@ -182,13 +158,15 @@ export function ΔattributeInterpolate3(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate4(
+export function ɵɵattributeInterpolate4(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string,
     v3: any, suffix: string, sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  const interpolatedValue = Δinterpolation4(prefix, v0, i0, v1, i1, v2, i2, v3, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate4;
+
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  const interpolatedValue = ɵɵinterpolation4(prefix, v0, i0, v1, i1, v2, i2, v3, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate4;
 }
 
 /**
@@ -204,7 +182,7 @@ export function ΔattributeInterpolate4(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate5(
+ * ɵɵattributeInterpolate5(
  * 'title', 'prefix', v0, '-', v1, '-', v2, '-', v3, '-', v4, 'suffix');
  * ```
  *
@@ -224,14 +202,16 @@ export function ΔattributeInterpolate4(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate5(
+export function ɵɵattributeInterpolate5(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string,
     v3: any, i3: string, v4: any, suffix: string, sanitizer?: SanitizerFn,
     namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  const interpolatedValue = Δinterpolation5(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate5;
+
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  const interpolatedValue = ɵɵinterpolation5(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate5;
 }
 
 /**
@@ -247,7 +227,7 @@ export function ΔattributeInterpolate5(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate6(
+ * ɵɵattributeInterpolate6(
  *    'title', 'prefix', v0, '-', v1, '-', v2, '-', v3, '-', v4, '-', v5, 'suffix');
  * ```
  *
@@ -269,15 +249,16 @@ export function ΔattributeInterpolate5(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate6(
+export function ɵɵattributeInterpolate6(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string,
     v3: any, i3: string, v4: any, i4: string, v5: any, suffix: string, sanitizer?: SanitizerFn,
     namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
   const interpolatedValue =
-      Δinterpolation6(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate6;
+      ɵɵinterpolation6(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate6;
 }
 
 /**
@@ -293,7 +274,7 @@ export function ΔattributeInterpolate6(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate7(
+ * ɵɵattributeInterpolate7(
  *    'title', 'prefix', v0, '-', v1, '-', v2, '-', v3, '-', v4, '-', v5, '-', v6, 'suffix');
  * ```
  *
@@ -317,15 +298,16 @@ export function ΔattributeInterpolate6(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate7(
+export function ɵɵattributeInterpolate7(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string,
     v3: any, i3: string, v4: any, i4: string, v5: any, i5: string, v6: any, suffix: string,
     sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
   const interpolatedValue =
-      Δinterpolation7(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, i5, v6, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate7;
+      ɵɵinterpolation7(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, i5, v6, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate7;
 }
 
 /**
@@ -341,7 +323,7 @@ export function ΔattributeInterpolate7(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolate8(
+ * ɵɵattributeInterpolate8(
  *  'title', 'prefix', v0, '-', v1, '-', v2, '-', v3, '-', v4, '-', v5, '-', v6, '-', v7, 'suffix');
  * ```
  *
@@ -367,15 +349,16 @@ export function ΔattributeInterpolate7(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolate8(
+export function ɵɵattributeInterpolate8(
     attrName: string, prefix: string, v0: any, i0: string, v1: any, i1: string, v2: any, i2: string,
     v3: any, i3: string, v4: any, i4: string, v5: any, i5: string, v6: any, i6: string, v7: any,
     suffix: string, sanitizer?: SanitizerFn, namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
   const interpolatedValue =
-      Δinterpolation8(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, i5, v6, i6, v7, suffix);
-  ΔelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
-  return ΔattributeInterpolate8;
+      ɵɵinterpolation8(prefix, v0, i0, v1, i1, v2, i2, v3, i3, v4, i4, v5, i5, v6, i6, v7, suffix);
+  ɵɵelementAttribute(index, attrName, interpolatedValue, sanitizer, namespace);
+  return ɵɵattributeInterpolate8;
 }
 
 /**
@@ -391,7 +374,7 @@ export function ΔattributeInterpolate8(
  * Its compiled representation is::
  *
  * ```ts
- * ΔattributeInterpolateV(
+ * ɵɵattributeInterpolateV(
  *  'title', ['prefix', v0, '-', v1, '-', v2, '-', v3, '-', v4, '-', v5, '-', v6, '-', v7, '-', v9,
  *  'suffix']);
  * ```
@@ -404,10 +387,11 @@ export function ΔattributeInterpolate8(
  * @returns itself, so that it may be chained.
  * @codeGenApi
  */
-export function ΔattributeInterpolateV(
+export function ɵɵattributeInterpolateV(
     attrName: string, values: any[], sanitizer?: SanitizerFn,
     namespace?: string): TsickleIssue1009 {
   const index = getSelectedIndex();
-  ΔelementAttribute(index, attrName, ΔinterpolationV(values), sanitizer, namespace);
-  return ΔattributeInterpolateV;
+  // TODO(FW-1340): Refactor to remove the use of other instructions here.
+  ɵɵelementAttribute(index, attrName, ɵɵinterpolationV(values), sanitizer, namespace);
+  return ɵɵattributeInterpolateV;
 }

packages/core/src/render3/jit/environment.ts

@@ -21,6 +21,15 @@ import * as r3 from '../index';
 export const angularCoreEnv: {[name: string]: Function} =
     (() => ({
        'ɵɵattribute': r3.ɵɵattribute,
+       'ɵɵattributeInterpolate1': r3.ɵɵattributeInterpolate1,
+       'ɵɵattributeInterpolate2': r3.ɵɵattributeInterpolate2,
+       'ɵɵattributeInterpolate3': r3.ɵɵattributeInterpolate3,
+       'ɵɵattributeInterpolate4': r3.ɵɵattributeInterpolate4,
+       'ɵɵattributeInterpolate5': r3.ɵɵattributeInterpolate5,
+       'ɵɵattributeInterpolate6': r3.ɵɵattributeInterpolate6,
+       'ɵɵattributeInterpolate7': r3.ɵɵattributeInterpolate7,
+       'ɵɵattributeInterpolate8': r3.ɵɵattributeInterpolate8,
+       'ɵɵattributeInterpolateV': r3.ɵɵattributeInterpolateV,
        'ɵɵdefineBase': r3.ɵɵdefineBase,
        'ɵɵdefineComponent': r3.ɵɵdefineComponent,
        'ɵɵdefineDirective': r3.ɵɵdefineDirective,