`<pre>` tags contains tabs after

[evrpress]

• Maizzle Version: 4.7.2
• Node.js Version: 21.5.0

Adding a <pre> tag with content in a component causes unexpected tabs in the closing tag.

component.html

<pre>
    Content
</pre>

output

        <pre>
    Content
</pre
        >

I think most clients render that just fine but we know how email clients may react.

[cossssmin]

This is with prettify: true, right?

[evrpress]

Yes, actually my settings is

prettify: {
    useTabs: true,
}

but the result is the same

[cossssmin]

Yeah, it's a prettier bug unfortunately, here's a reproduction.

Only way around it will be through a regex that corrects this, will add it to the backlog for the other issue with embeddedLanguageFormatting, will fix them both in the next release.

[cossssmin]

Using parser: 'glimmer' helps, but that removes the doctype form the HTML, which is unacceptable.

[cossssmin]

Reported the issue in the prettier repo: https://github.com/prettier/prettier/issues/15982

[evrpress]

Thanks Cosmin, I think this issue is not critical. I will submit the issue to the correct repo next time. I'm still not sure which tool in Maizzle is responsible for what 😄

[cossssmin]

Don’t worry about it, I actually prefer knowing of something not working in Maizzle and then taking it upstream if needed :)

[evrpress]

I use this line in afterTransformers for now:

html = html.replaceAll(/<\/pre([\s\t]+)>/gi, '$1</pre>');

This also preserves any indention.

[cossssmin]

Yup, doing something similar now:

html.replace(/(<\/pre)\s+>/g, '$1>')

[cossssmin]

Should be fixed in v4.7.3 now 👍