Links within template Elements cause wrong HTML parsing/output

[diesieben07]

Astro Info

Astro                    v4.4.1
Node                     v20.11.1
System                   Linux (x64)
Package Manager          npm
Output                   static
Adapter                  none
Integrations             none

If this issue only occurs in one browser, which browser is a problem?

n/a

Describe the Bug

Astro fails to parse a elements within template elements correctly in certain situations. If the content of the a element is an expression, Astro emits the a element again after the template element. The following is not handled correctly:

<template>
    <a href="https://example.com">{text}</a>.
</template>
<p>Some text</p>

The emitted HTML is equivalent to the following:

<template>
    <a href="https://example.com">Text</a>.
</template>
<a href="https://example.com">
<p>Some text</p>
</a>

This problem does not occur if the a Element only contains plain text (i.e. not an expression).

What's the expected result?

Astro should parse/emit a elements within template elements correctly.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-5amjgj?file=src%2Fpages%2Findex.astro

Participation

• [ ] I am willing to submit a pull request for this issue.

[diesieben07]

@Princesseuh I saw that you moved this issue to the compiler project. I threw together a quick test with @astrojs/compiler and it seems it generates the correct AST. I have shared the code here. So the issue might be elsewhere.

Edit: The transformed output of the compiler (transform) has the issue. So the issue is with printing, not parsing.

[MoustaphaDev]

Thanks for investigating @diesieben07! This looks similars to https://github.com/withastro/compiler/issues/958, I'll make sure to look at this when I go through the issues next week.