Repository: angular
Issue: extract-i18n: Broken parsing of interpolated values with es2020
Labels: area: i18n

### Command

extract-i18n

### Is this a regression?

- [X] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

Angular 13 / es2015

### Description

After upgrading our app to Angular 14, we noticed odd values in our .xlf files when running extract-i18n.  (We actually use the [ng-extract-i18-merge](https://github.com/daniel-sc/ng-extract-i18n-merge) package but it doesn't matter -- I was able to reproduce this with the standard `ng extract-i18n` command).

It seems like the change from `"target": "es2015"` to `"target": "es2020"` in `tsconfig.json` is causing some messages with interpolated values in them to be parsed incorrectly, resulting in broken/incorrect messages.  **If I change the value back to "es2015", everything works as it did before.**

There is something weird where having text inside the message with the interpolated value affects it in different ways depending on where that text is.  

### Minimal Reproduction

Below you'll see cases 2 and 4 get broken in es2020:

_Example HTML:_
```
<span i18n="@@something.test1">Before {{ someVar }}</span>
<span i18n="@@something.test2">{{ someVar }} After</span>
<span i18n="@@something.test3">Before and {{ someVar }} After</span>
<span i18n="@@something.test4">{{ someVar }}</span>

<p>Next element</p>
```

_**Working** .xlf output using es2015:_
```
<trans-unit id="something.test1" datatype="html">
    <source>Before <x id="INTERPOLATION" equiv-text="{{ someVar }}"/></source>
</trans-unit>
<trans-unit id="something.test2" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="{{ someVar }}"/> After</source>
</trans-unit>
<trans-unit id="something.test3" datatype="html">
    <source>Before and <x id="INTERPOLATION" equiv-text="{{ someVar }}"/> After</source>
</trans-unit>
<trans-unit id="something.test4" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="{{ someVar }}"/></source>
</trans-unit>
```

_**Broken** .xlf output using es2020:_
```
<trans-unit id="something.test1" datatype="html">
    <source>Before <x id="INTERPOLATION" equiv-text="{{ someVar }}"/></source>
</trans-unit>
<trans-unit id="something.test2" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="After&lt;/span&gt;
&lt;"/> After</source>
</trans-unit>
<trans-unit id="something.test3" datatype="html">
    <source>Before and <x id="INTERPOLATION" equiv-text="{{ someVar }}"/> After</source>
</trans-unit>
<trans-unit id="something.test4" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="&lt;/span&gt;

&lt;p&gt;Nex"/></source>
</trans-unit>
```

Note that test 2 and test 4 are broken.  Rather than having the correct variable, it pulls in an encoded version of the beginning of the next element after the one tagged for i18n.

What's also strange is that is **just changing the length of the IDs** causes it to parse differently...

_Example HTML 2 with shorter IDs:_
```
<span i18n="@@test1">Before {{ someVar }}</span>
<span i18n="@@test2">{{ someVar }} After</span>
<span i18n="@@test3">Before and {{ someVar }} After</span>
<span i18n="@@test4">{{ someVar }}</span>

<p>Next element</p>
```

_**Different broken** .xlf output using es2020:_
```
<trans-unit id="test1" datatype="html">
    <source>Before <x id="INTERPOLATION" equiv-text="{{ someVar }}"/></source>
</trans-unit>
<trans-unit id="test2" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="Afte"/> After</source>
</trans-unit>
<trans-unit id="test3" datatype="html">
    <source>Before and <x id="INTERPOLATION" equiv-text="{{ someVar }}"/> After</source>
</trans-unit>
<trans-unit id="test4" datatype="html">
    <source><x id="INTERPOLATION" equiv-text="&lt;/spa"/></source>
</trans-unit>
```

### Exception or Error

_No response_

### Your Environment

```text
Angular CLI: 14.2.10
Node: 16.15.0
Package Manager: npm 8.5.5
OS: win32 x64

Angular: 14.2.12
... animations, common, compiler, compiler-cli, core, elements
... forms, localize, platform-browser, platform-browser-dynamic
... router, service-worker

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1402.10
@angular-devkit/build-angular     14.2.10
@angular-devkit/core              13.3.7
@angular-devkit/schematics        13.3.7
@angular/cdk                      14.2.7
@angular/cli                      14.2.10
@angular/flex-layout              14.0.0-beta.41
@angular/material                 14.2.7
@angular/material-luxon-adapter   14.2.7
@schematics/angular               13.3.7
rxjs                              7.4.0
typescript                        4.6.2
```


### Anything else relevant?

_No response_