prettier-plugin-astro
prettier-plugin-astro copied to clipboard
Published
20 hours ago •
withastro
withastro
🐛 BUG: Expression causes closing tag to move
Describe the Bug
When formatting expressions, Prettier reorders closing tags before their contents. In addition, it also entirely removes later tags.
Input
---
export interface Props {
title?: string
article?: {
publishedTime?: string
modifiedTime?: string
}
}
const {
title = 'Title',
article,
} = Astro.props as Props
---
<!DOCTYPE html>
<html lang="en">
<head>
<title>{title}</title>
{article && (
<>
<meta property="article:published_time" content={article.publishedTime} />
<meta property="article:modified_time" content={article.modifiedTime} />
</>
)}
</head>
<body>
<slot />
</body>
</html>
Output
---
export interface Props {
title?: string
article?: {
publishedTime?: string
modifiedTime?: string
}
}
const { title = 'Title', article } = Astro.props as Props
---
<!DOCTYPE html>
<html lang="en">
<head>
<title>{title}</title>
</head>{
article && (
<>
<meta
property="article:published_time"
content={article.publishedTime}
/>
<meta property="article:modified_time" content={article.modifiedTime} />
</>
)
}
<slot />
</html>
In this case, the </head> tag should remain after the expression, and the body tag should not be removed.
This bug happens regardless of whether or not the expression is the last thing before the closing tag (i.e. adding another meta tag right before the </html> doesn't change anything, and that later tag ends up outside the head as well)
Steps to Reproduce
See code example in description
