[@lit/localize] A translation of "2 > 1" results in "2 > 1" when using `msg("2 > 1")`

[BenjaminMaxdoro]

Which package(s) are affected?

Localize (@lit/localize)

Description

When adding translations containing the > char (didn't test any others), the char is HTML escaped when rendering in that translation (not when rendering the source language).

Reproduction

When defining a translation like this:

return html`<span>${msg("2 > 1")}</span>`;

And add a translation:

<trans-unit id="s59704991b8b78e98">
  <source>2 &gt; 1</source>
  <target>2 &gt; 1</target>
</trans-unit>

The rendered text is 2 > 1 instead of 2 > 1.

Workaround

Did not test any workaround but I would guess that using

msg(html`2 > 1`)

would work.

Is this a regression?

No or unsure. This never worked, or I haven't tried before.

Affected versions

Tested with @lit/localize 0.12.2 and @lit/localize-tools 0.8.0

Browser/OS/Node environment

Browser: Firefox 139.0.1
OS: Windows 11 (24H2)

[IIIMADDINIII]

I just had the same problem. I temporarly solved it by replacing "=>" with "⇒".
I think the offending code is the following:

lit/packages/localize-tools/src/typescript.ts

Lines 86 to 96 in 945f5aa

	export function escapeTextContentToEmbedInTemplateLiteral(
	unescaped: string
	): string {
	return unescaped
	.replace(/\\/g, `\\\\`)
	.replace(/`/g, '\\`')
	.replace(/\$/g, '\\$')
	.replace(/&/g, '&')
	.replace(/</g, '&lt;')
	.replace(/>/g, '&gt;');
	}

If i understand it correctly, only the first tree replacements are correct. The other tree are not specific to template strings.
If i remove the three last replacements, it works as expected.

I think it is the job of the author of the code and translations to escape the "&", "<" and ">" signs.