Skip to content

Commit dd08150

Browse files
benleshmatsko
benlesh
authored and
matsko
committed
feat(ivy): add ɵɵtextInterpolateX instructions (angular#30011)
- `ɵɵtextBinding(..., ɵɵinterpolationX())` instructions will now just be `ɵɵtextInterpolate(...)` instructions PR Close angular#30011
1 parent 4809382 commit dd08150

22 files changed

+864
-328
lines changed

‎packages/compiler-cli/ngcc/test/rendering/renderer_spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,7 @@ describe('Renderer', () => {
168168
ɵngcc0.ɵɵtext(0);
169169
} if (rf & 2) {
170170
ɵngcc0.ɵɵselect(0);
171-
ɵngcc0.ɵɵtextBinding(0, ɵngcc0.ɵɵinterpolation1("", ctx.person.name, ""));
171+
ɵngcc0.ɵɵtextInterpolate(ctx.person.name);
172172
} }, encapsulation: 2 });
173173
/*@__PURE__*/ ɵngcc0.ɵsetClassMetadata(A, [{
174174
type: Component,

‎packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts

+13-15
Original file line numberDiff line numberDiff line change
@@ -810,7 +810,7 @@ describe('compiler compliance', () => {
810810
const $myComp$ = $r3$.ɵɵnextContext();
811811
const $foo$ = $r3$.ɵɵreference(1);
812812
$r3$.ɵɵselect(1);
813-
$r3$.ɵɵtextBinding(1, $r3$.ɵɵinterpolation2("", $myComp$.salutation, " ", $foo$, ""));
813+
$r3$.ɵɵtextInterpolate2("", $myComp$.salutation, " ", $foo$, "");
814814
}
815815
}
816816
…
@@ -2074,9 +2074,9 @@ describe('compiler compliance', () => {
20742074
}
20752075
if (rf & 2) {
20762076
$r3$.ɵɵselect(0);
2077-
$r3$.ɵɵtextBinding(0, $r3$.ɵɵinterpolation1("", $r3$.ɵɵpipeBind2(1, 3, $r3$.ɵɵpipeBind2(2, 6, ctx.name, ctx.size), ctx.size), ""));
2077+
$r3$.ɵɵtextInterpolate($r3$.ɵɵpipeBind2(1, 3, $r3$.ɵɵpipeBind2(2, 6, ctx.name, ctx.size), ctx.size));
20782078
$r3$.ɵɵselect(4);
2079-
$r3$.ɵɵtextBinding(4, $r3$.ɵɵinterpolation2("", $r3$.ɵɵpipeBindV(5, 9, $r3$.ɵɵpureFunction1(18, $c0$, ctx.name)), " ", ctx.name ? 1 : $r3$.ɵɵpipeBind1(6, 16, 2), ""));
2079+
$r3$.ɵɵtextInterpolate2("", $r3$.ɵɵpipeBindV(5, 9, $r3$.ɵɵpureFunction1(18, $c0$, ctx.name)), " ", ctx.name ? 1 : $r3$.ɵɵpipeBind1(6, 16, 2), "");
20802080
}
20812081
},
20822082
pipes: [MyPurePipe, MyPipe],
@@ -2139,14 +2139,14 @@ describe('compiler compliance', () => {
21392139
}
21402140
if (rf & 2) {
21412141
$r3$.ɵɵselect(0);
2142-
$r3$.ɵɵtextBinding(0, $r3$.ɵɵinterpolation5(
2142+
$r3$.ɵɵtextInterpolate5(
21432143
"0:", i0.ɵɵpipeBind1(1, 5, ctx.name),
21442144
"1:", i0.ɵɵpipeBind2(2, 7, ctx.name, 1),
21452145
"2:", i0.ɵɵpipeBind3(3, 10, ctx.name, 1, 2),
21462146
"3:", i0.ɵɵpipeBind4(4, 14, ctx.name, 1, 2, 3),
21472147
"4:", i0.ɵɵpipeBindV(5, 19, $r3$.ɵɵpureFunction1(25, $c0$, ctx.name)),
21482148
""
2149-
));
2149+
);
21502150
}
21512151
},
21522152
pipes: [MyPipe],
@@ -2192,7 +2192,7 @@ describe('compiler compliance', () => {
21922192
if (rf & 2) {
21932193
const $user$ = $r3$.ɵɵreference(1);
21942194
$r3$.ɵɵselect(2);
2195-
$r3$.ɵɵtextBinding(2, $r3$.ɵɵinterpolation1("Hello ", $user$.value, "!"));
2195+
$r3$.ɵɵtextInterpolate1("Hello ", $user$.value, "!");
21962196
}
21972197
},
21982198
encapsulation: 2
@@ -2255,7 +2255,7 @@ describe('compiler compliance', () => {
22552255
const $foo$ = $r3$.ɵɵreference(1);
22562256
const $baz$ = $r3$.ɵɵreference(5);
22572257
$r3$.ɵɵselect(1);
2258-
$r3$.ɵɵtextBinding(1, $r3$.ɵɵinterpolation3("", $foo$, "-", $bar$, "-", $baz$, ""));
2258+
$r3$.ɵɵtextInterpolate3("", $foo$, "-", $bar$, "-", $baz$, "");
22592259
}
22602260
}
22612261
function MyComponent_div_3_Template(rf, ctx) {
@@ -2271,7 +2271,7 @@ describe('compiler compliance', () => {
22712271
$r3$.ɵɵnextContext();
22722272
const $foo$ = $r3$.ɵɵreference(1);
22732273
$r3$.ɵɵselect(1);
2274-
$r3$.ɵɵtextBinding(1, $r3$.ɵɵinterpolation2(" ", $foo$, "-", $bar$, " "));
2274+
$r3$.ɵɵtextInterpolate2(" ", $foo$, "-", $bar$, " ");
22752275
}
22762276
}
22772277
…
@@ -2291,7 +2291,7 @@ describe('compiler compliance', () => {
22912291
if (rf & 2) {
22922292
const $foo$ = $r3$.ɵɵreference(1);
22932293
$r3$.ɵɵselect(2);
2294-
$r3$.ɵɵtextBinding(2, $r3$.ɵɵinterpolation1(" ", $foo$, " "));
2294+
$r3$.ɵɵtextInterpolate1(" ", $foo$, " ");
22952295
}
22962296
},
22972297
directives:[IfDirective],
@@ -2300,9 +2300,7 @@ describe('compiler compliance', () => {
23002300

23012301
const result = compile(files, angularFiles);
23022302
const source = result.source;
2303-
23042303
expectEmit(source, MyComponentDefinition, 'Incorrect MyComponent.ngComponentDef');
2305-
23062304
});
23072305

23082306
it('should support local refs mixed with context assignments', () => {
@@ -2344,7 +2342,7 @@ describe('compiler compliance', () => {
23442342
const $item$ = $i0$.ɵɵnextContext().$implicit;
23452343
const $foo$ = $i0$.ɵɵreference(2);
23462344
$r3$.ɵɵselect(1);
2347-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation2(" ", $foo$, " - ", $item$, " "));
2345+
$i0$.ɵɵtextInterpolate2(" ", $foo$, " - ", $item$, " ");
23482346
}
23492347
}
23502348
@@ -2648,7 +2646,7 @@ describe('compiler compliance', () => {
26482646
if (rf & 2) {
26492647
const $item$ = ctx.$implicit;
26502648
$r3$.ɵɵselect(1);
2651-
$r3$.ɵɵtextBinding(1, $r3$.ɵɵinterpolation1("", $item$.name, ""));
2649+
$r3$.ɵɵtextInterpolate($item$.name);
26522650
}
26532651
}
26542652
…
@@ -2731,7 +2729,7 @@ describe('compiler compliance', () => {
27312729
const $info$ = ctx.$implicit;
27322730
const $item$ = $r3$.ɵɵnextContext().$implicit;
27332731
$r3$.ɵɵselect(1);
2734-
$r3$.ɵɵtextBinding(1, $r3$.ɵɵinterpolation2(" ", $item$.name, ": ", $info$.description, " "));
2732+
$r3$.ɵɵtextInterpolate2(" ", $item$.name, ": ", $info$.description, " ");
27352733
}
27362734
}
27372735
@@ -2749,7 +2747,7 @@ describe('compiler compliance', () => {
27492747
if (rf & 2) {
27502748
const $item$ = ctx.$implicit;
27512749
$r3$.ɵɵselect(2);
2752-
$r3$.ɵɵtextBinding(2, $r3$.ɵɵinterpolation1("", IDENT.name, ""));
2750+
$r3$.ɵɵtextInterpolate(IDENT.name);
27532751
$r3$.ɵɵselect(4);
27542752
$r3$.ɵɵproperty("forOf", IDENT.infos);
27552753
}

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ describe('compiler compliance: bindings', () => {
4545
}
4646
if (rf & 2) {
4747
$r3$.ɵɵselect(1);
48-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation1("Hello ", $ctx$.name, ""));
48+
$i0$.ɵɵtextInterpolate1("Hello ", $ctx$.name, "");
4949
}
5050
}`;
5151
const result = compile(files, angularFiles);
@@ -567,7 +567,7 @@ describe('compiler compliance: bindings', () => {
567567
if (rf & 2) {
568568
const $_r0$ = $i0$.ɵɵreference(1);
569569
$r3$.ɵɵselect(4);
570-
$i0$.ɵɵtextBinding(4, $i0$.ɵɵinterpolation1(" ", $_r0$.id, " "));
570+
$i0$.ɵɵtextInterpolate1(" ", $_r0$.id, " ");
571571
}
572572
}
573573
`;

‎packages/compiler-cli/test/compliance/r3_view_compiler_spec.ts

+14-5
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ describe('r3_view_compiler', () => {
9393

9494
describe('interpolations', () => {
9595
// Regression #21927
96-
it('should generate a correct call to bV with more than 8 interpolations', () => {
96+
it('should generate a correct call to textInterpolateV with more than 8 interpolations', () => {
9797
const files: MockDirectory = {
9898
app: {
9999
'example.ts': `
@@ -112,10 +112,19 @@ describe('r3_view_compiler', () => {
112112
}
113113
};
114114

115-
const bV_call =
116-
`$r3$.ɵɵinterpolationV([" ",ctx.list[0]," ",ctx.list[1]," ",ctx.list[2]," ",ctx.list[3],
117-
" ",ctx.list[4]," ",ctx.list[5]," ",ctx.list[6]," ",ctx.list[7]," ",ctx.list[8],
118-
" "])`;
115+
const bV_call = `
116+
…
117+
function MyApp_Template(rf, ctx) {
118+
if (rf & 1) {
119+
$i0$.ɵɵtext(0);
120+
}
121+
if (rf & 2) {
122+
$i0$.ɵɵselect(0);
123+
$i0$.ɵɵtextInterpolateV([" ", 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], " "]);
124+
}
125+
}
126+
…
127+
`;
119128
const result = compile(files, angularFiles);
120129
expectEmit(result.source, bV_call, 'Incorrect bV call');
121130
});

‎packages/compiler-cli/test/compliance/r3_view_compiler_styling_spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -999,7 +999,7 @@ describe('compiler compliance: styling', () => {
999999
$r3$.ɵɵclassProp(0, $r3$.ɵɵpipeBind2(4, 10, $ctx$.fooExp, 2000));
10001000
$r3$.ɵɵstylingApply();
10011001
$r3$.ɵɵselect(5);
1002-
$r3$.ɵɵtextBinding(5, $r3$.ɵɵinterpolation1(" ", $ctx$.item, ""));
1002+
$r3$.ɵɵtextInterpolate1(" ", $ctx$.item, "");
10031003
}
10041004
}
10051005
`;

‎packages/compiler-cli/test/compliance/r3_view_compiler_template_spec.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ describe('compiler compliance: template', () => {
7878
$i0$.ɵɵselect(0);
7979
$i0$.ɵɵproperty("title", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component));
8080
$r3$.ɵɵselect(1);
81-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation1(" ", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component), " "));
81+
$i0$.ɵɵtextInterpolate1(" ", $myComp1$.format($outer1$, $middle1$, $inner1$, $myComp1$.component), " ");
8282
}
8383
}
8484
@@ -215,7 +215,7 @@ describe('compiler compliance: template', () => {
215215
const $item$ = ctx.$implicit;
216216
const $i$ = ctx.index;
217217
$r3$.ɵɵselect(1);
218-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation2(" ", $i$, " - ", $item$, " "));
218+
$i0$.ɵɵtextInterpolate2(" ", $i$, " - ", $item$, " ");
219219
}
220220
}
221221
// ...
@@ -272,7 +272,7 @@ describe('compiler compliance: template', () => {
272272
const $i$ = $div$.index;
273273
const $item$ = $div$.$implicit;
274274
$r3$.ɵɵselect(1);
275-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation2(" ", $i$, " - ", $item$, " "));
275+
$i0$.ɵɵtextInterpolate2(" ", $i$, " - ", $item$, " ");
276276
}
277277
}
278278
@@ -343,7 +343,7 @@ describe('compiler compliance: template', () => {
343343
const $middle$ = $i0$.ɵɵnextContext().$implicit;
344344
const $myComp$ = $i0$.ɵɵnextContext(2);
345345
$r3$.ɵɵselect(1);
346-
$i0$.ɵɵtextBinding(1, $i0$.ɵɵinterpolation2(" ", $middle$.value, " - ", $myComp$.name, " "));
346+
$i0$.ɵɵtextInterpolate2(" ", $middle$.value, " - ", $myComp$.name, " ");
347347
}
348348
}
349349

‎packages/compiler-cli/test/ngtsc/ngtsc_spec.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1961,7 +1961,7 @@ describe('ngtsc behavioral tests', () => {
19611961

19621962
env.driveMain();
19631963
const jsContents = env.getContents('test.js');
1964-
expect(jsContents).toContain('interpolation1("", ctx.text, "")');
1964+
expect(jsContents).toContain('ɵɵtextInterpolate(ctx.text)');
19651965
});
19661966

19671967
it('should handle `encapsulation` field', () => {

‎packages/compiler-cli/test/ngtsc/template_mapping_spec.ts

+10-11
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ describe('template source-mapping', () => {
4444
{source: '<h3>', generated: 'i0.ɵɵelementStart(0, "h3")', sourceUrl: '../test.ts'});
4545
expect(mappings).toContain({
4646
source: 'Hello {{ name }}',
47-
generated: 'i0.ɵɵtextBinding(1, i0.ɵɵinterpolation1("Hello ", ctx.name, ""))',
47+
generated: 'i0.ɵɵtextInterpolate1("Hello ", ctx.name, "")',
4848
sourceUrl: '../test.ts'
4949
});
5050
expect(mappings).toContain(
@@ -57,8 +57,7 @@ describe('template source-mapping', () => {
5757
{source: '<h2>', generated: 'i0.ɵɵelementStart(0, "h2")', sourceUrl: '../test.ts'});
5858
expect(mappings).toContain({
5959
source: '{{ greeting + " " + name }}',
60-
generated:
61-
'i0.ɵɵtextBinding(1, i0.ɵɵinterpolation1("", ctx.greeting + " " + ctx.name, ""))',
60+
generated: 'i0.ɵɵtextInterpolate(ctx.greeting + " " + ctx.name)',
6261
sourceUrl: '../test.ts'
6362
});
6463
expect(mappings).toContain(
@@ -85,8 +84,7 @@ describe('template source-mapping', () => {
8584
{source: '<div>', generated: 'i0.ɵɵelementStart(0, "div")', sourceUrl: '../test.ts'});
8685
expect(mappings).toContain({
8786
source: '{{200.3 | percent : 2 }}',
88-
generated:
89-
'i0.ɵɵtextBinding(1, i0.ɵɵinterpolation1("", i0.ɵɵpipeBind2(2, 1, 200.3, 2), ""))',
87+
generated: 'i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, 200.3, 2))',
9088
sourceUrl: '../test.ts'
9189
});
9290
expect(mappings).toContain(
@@ -270,7 +268,7 @@ describe('template source-mapping', () => {
270268

271269
// expect(mappings).toContain({
272270
// source: '{{ name }}',
273-
// generated: 'i0.ɵɵtextBinding(1, i0.ɵɵinterpolation1("", ctx_r0.name, ""))',
271+
// generated: 'i0.ɵɵtextInterpolate(ctx_r0.name)',
274272
// sourceUrl: '../test.ts'
275273
// });
276274
});
@@ -294,7 +292,7 @@ describe('template source-mapping', () => {
294292

295293
// expect(mappings).toContain({
296294
// source: '{{ name }}',
297-
// generated: 'i0.ɵɵtextBinding(1, i0.ɵɵinterpolation1("", ctx_r0.name, ""))',
295+
// generated: 'i0.ɵɵtextInterpolate(ctx_r0.name)',
298296
// sourceUrl: '../test.ts'
299297
// });
300298
});
@@ -370,7 +368,7 @@ describe('template source-mapping', () => {
370368

371369
// Update mode
372370
expect(mappings).toContain({
373-
generated: 'i0.ɵɵtextBinding(3, i0.ɵɵinterpolation1("", 1 + 2, ""))',
371+
generated: 'i0.ɵɵtextInterpolate(1 + 2)',
374372
source: '{{ 1 + 2 }}',
375373
sourceUrl: '../test.ts'
376374
});
@@ -396,9 +394,10 @@ describe('template source-mapping', () => {
396394
expect(mappings).toContain(
397395
{generated: 'i0.ɵɵelementEnd()', source: '</div>', sourceUrl: '../test.ts'});
398396

397+
// TODO(benlesh): We need to circle back and prevent the extra parens from being generated.
399398
// Update mode
400399
expect(mappings).toContain({
401-
generated: 'i0.ɵɵtextBinding(3, i0.ɵɵinterpolation1("", 1 + 2, ""))',
400+
generated: 'i0.ɵɵtextInterpolate(1 + 2)',
402401
source: '{{ 1 + 2 }}',
403402
sourceUrl: '../test.ts'
404403
});
@@ -452,7 +451,7 @@ describe('template source-mapping', () => {
452451

453452
// Update mode
454453
expect(mappings).toContain({
455-
generated: 'i0.ɵɵtextBinding(3, i0.ɵɵinterpolation1("", 1 + 2, ""))',
454+
generated: 'i0.ɵɵtextInterpolate(1 + 2)',
456455
source: '{{ 1 + 2 }}',
457456
sourceUrl: '../dir/test.html'
458457
});
@@ -496,7 +495,7 @@ describe('template source-mapping', () => {
496495

497496
// Update mode
498497
expect(mappings).toContain({
499-
generated: 'i0.ɵɵtextBinding(3, i0.ɵɵinterpolation1("", 1 + 2, ""))',
498+
generated: 'i0.ɵɵtextInterpolate(1 + 2)',
500499
source: '{{ 1 + 2 }}',
501500
sourceUrl: '../extraRootDir/test.html'
502501
});

‎packages/compiler/src/output/output_jit.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export class JitEvaluator {
5656
evaluateCode(
5757
sourceUrl: string, ctx: EmitterVisitorContext, vars: {[key: string]: any},
5858
createSourceMap: boolean): any {
59-
let fnBody = `${ctx.toSource()}\n//# sourceURL=${sourceUrl}`;
59+
let fnBody = `"use strict";${ctx.toSource()}\n//# sourceURL=${sourceUrl}`;
6060
const fnArgNames: string[] = [];
6161
const fnArgValues: any[] = [];
6262
for (const argName in vars) {

‎packages/compiler/src/render3/r3_identifiers.ts

+11
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,17 @@ export class Identifiers {
102102

103103
static getCurrentView: o.ExternalReference = {name: 'ɵɵgetCurrentView', moduleName: CORE};
104104

105+
static textInterpolate: o.ExternalReference = {name: 'ɵɵtextInterpolate', moduleName: CORE};
106+
static textInterpolate1: o.ExternalReference = {name: 'ɵɵtextInterpolate1', moduleName: CORE};
107+
static textInterpolate2: o.ExternalReference = {name: 'ɵɵtextInterpolate2', moduleName: CORE};
108+
static textInterpolate3: o.ExternalReference = {name: 'ɵɵtextInterpolate3', moduleName: CORE};
109+
static textInterpolate4: o.ExternalReference = {name: 'ɵɵtextInterpolate4', moduleName: CORE};
110+
static textInterpolate5: o.ExternalReference = {name: 'ɵɵtextInterpolate5', moduleName: CORE};
111+
static textInterpolate6: o.ExternalReference = {name: 'ɵɵtextInterpolate6', moduleName: CORE};
112+
static textInterpolate7: o.ExternalReference = {name: 'ɵɵtextInterpolate7', moduleName: CORE};
113+
static textInterpolate8: o.ExternalReference = {name: 'ɵɵtextInterpolate8', moduleName: CORE};
114+
static textInterpolateV: o.ExternalReference = {name: 'ɵɵtextInterpolateV', moduleName: CORE};
115+
105116
static restoreView: o.ExternalReference = {name: 'ɵɵrestoreView', moduleName: CORE};
106117

107118
static interpolation1: o.ExternalReference = {name: 'ɵɵinterpolation1', moduleName: CORE};

0 commit comments

Comments
 (0)