prettier-plugin-astro icon indicating copy to clipboard operation
prettier-plugin-astro copied to clipboard

πŸ› BUG: Plugin changes order of HTML elements when one inner element has no closing tag

Open trueberryless opened this issue 9 months ago β€’ 0 comments

Describe the Bug

When you unintentionally create not well-formed HTML the plugin will change the order of the closing tags, which will mess up the HTML even more.

Expected behaviour

First of all, I need to mention that it is my own fault that I wrote malformed HTML in the first place, so it makes total sense if this plugin doesn't account such scenarios...

However, it would be very cool if the plugin also handles such cases write and just adds the missing closing tags in the right place.

Example

The HTML before prettier:

<div>
   <main>
      <section>
         <h2 class="section-title">Origin of trueberryless</h2>
         <div class="content">
            <p>
               Ever wondered how I came up with my unique username? It’s a story of boredom, ambition, and three long days of brainstorming during my 2022 internship. Curious about the journey? <a href="/username/">Read the full tale here.</a>
            </p>
         // missing closing tag
      </section>
   </main>
   <ContactCTA />
</div>

The HTML after prettier:

<div>
   <main>
      <section>
         <h2 class="section-title">Origin of trueberryless</h2>
         <div class="content">
            <p>
               Ever wondered how I came up with my unique username? It’s a story of
               boredom, ambition, and three long days of brainstorming during my
               2022 internship. Curious about the journey? <a href="/username/"
                  >Read the full tale here.</a
                  >
            </p>
         </div>
      </section>
      <ContactCTA /> // this element must be after main closing tag
   </main>
</div>

Reference:

  • Opening <div> tag which is not closed (my mistake): https://github.com/trueberryless-org/trueberryless/blob/90cf193e9e9268900a4c2d2495b1bca7a8b3cdc6/src/src/pages/about.astro#L67
  • <ContentCTA> element is before </main> closing tag after autofix with this prettier plugin runs: https://github.com/trueberryless-org/trueberryless/blob/2fc4c3e3b43c7aa3d865a738b6dc9fe650f27827/src/src/pages/about.astro#L108

trueberryless avatar Mar 16 '25 19:03 trueberryless