prettier: HTML tags should not be automatically closed in template partials

Remember the good ol’ days when we had server-side rendering with template engines, using HTML partials (especially for headers and footers)… They sometimes contained HTML tags that were closed in other files.

Today, Prettier automatically closes all tags in a file, breaking the “partiality” of those partials.

Prettier 1.15.3 Playground link

Input:

<!DOCTYPE html>
<html>
  <head></head>
  <body>

Output:

<!DOCTYPE html>
<html>
  <head></head>
  <body></body>
</html>

Expected behavior:

Let the unclosed HTML tags be unclosed (maybe with an option).

About this issue

Original URL
State: open
Created 6 years ago
Reactions: 21
Comments: 15 (4 by maintainers)

Most upvoted comments

The example code in the first post is literally the same issue → it takes a complete, valid HTML document as input and adds in tags (</body> and </html>) where they weren’t present originally, never needed to be present. In that case the output is still valid HTML, but the original commenter still thought it was enough of an issue to file a bug report. Now I’ve got the same thing happening a month later and it’s actually making all of the HTML on my website invalid.

How about Prettier just never tries to do this sort of thing in the first place. There can’t be any bugs relating to it doing it wrongly if it never tries to inject HTML tags in the first place. I don’t mind a formatter being opinionated, but it shouldn’t make assumptions.

tomhodgins on Jan 23, 2019

Just wanted to chime in to say this is a massive problem with the way Hugo handles its partials.

kolaente on Jan 29, 2022

Adding to @kolaente, this is stopping me from fixing #59 on prettier-plugin-go-template which is using the embed API of prettier.

Would be neat if we’d have an option to disable this! If someone from the Prettier team can confirm this, I’d be glad to open a PR.

NiklasPor on Mar 30, 2022

The example in the OP is a valid transformation, but in your example Prettier changed the meaning of the code. Those are different things to me (although similar). Let’s fix the more obvious case while thinking about the other one.

lydell on Jan 23, 2019

I’m also running into this issue while trying to make an <ol> element that is opened on one line and closed on another.

Before:

html`
  ${numberPosts ? html`<ol class="mb4">` : ""}
  ${posts}
  ${numberPosts ? html`</ol>` : ""}
`

After:

html`
  ${numberPosts ? html`<ol class="mb4"></ol>` : ""}
  ${posts}
  ${numberPosts ? html`</ol>` : ""}
`

Prettier closes the <ol> tag, leading to invalid HTML. I wish I could disable this option!

mbforbes on Nov 13, 2023

--parser html is supposed to be used for complete html files. Personally, I think the “partial” formatting is out of scope since it looks like you just treat them as pure text, not HTML. Is it a common practice for server-side rendering? If so, can you share a reference?

Regarding those template languages:

handlebars: it’s tracked in #5340.
pure template language (e.g., ejs, nunjucks, etc.): see https://github.com/prettier/prettier/issues/5286#issuecomment-442061386.

ikatyang on Dec 21, 2018