== should format html in html`...` ==
let htmlString = html`<body><header>HEADER</header><main>Hello there!</main><footer>FOOTER</footer></body>`;
[expect]
let htmlString = html`
    <body>
        <header>HEADER</header>
        <main>Hello there!</main>
        <footer>FOOTER</footer>
    </body>
`;

== should format html in html`...` with multiple quasis ==
htmlString = html`<body><header>${header}</header><main>${main}</main><footer>${footer}</footer></body>`;
[expect]
htmlString = html`
    <body>
        <header>${header}</header>
        <main>${main}</main>
        <footer>${footer}</footer>
    </body>
`;

== should format nested html templates with correct indent level ==
export const Layout = (props: Props) => html`
  <html>
    <body>
      ${props.title.endsWith("example")
        ? html`
            <a href="/">Reactive Mastro examples</a>
            <h1>${props.title}</h1>
            `
        : ""}
      <main>${props.children}</main>
    </body>
  </html>
  `;
[expect]
export const Layout = (props: Props) =>
    html`
        <html>
            <body>
                ${props.title.endsWith("example")
                    ? html`
                        <a href="/">Reactive Mastro examples</a>
                        <h1>${props.title}</h1>
                    `
                    : ""}
                <main>${props.children}</main>
            </body>
        </html>
    `;

== should format html with multi-level indent jumps (regression for deno#29963) ==
const a = html`<a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
  <path d="" />
</svg></a>`;
[expect]
const a = html`
    <a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
            <path d="" />
        </svg></a>
`;

== should format html with multi-level indent jumps and an expression placeholder ==
const a = html`<a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
  <path d="${pathData}" />
</svg></a>`;
[expect]
const a = html`
    <a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
            <path d="${pathData}" />
        </svg></a>
`;

== should format html with three-level indent jump in a single transition ==
const a = html`<a><b><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
  <path d="" />
</svg></b></a>`;
[expect]
const a = html`
    <a><b><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
                <path d="" />
            </svg></b></a>
`;

== should format html with multiple multi-level indent jumps in the same template ==
const a = html`<a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
  <path d="" />
</svg><svg viewBox="0 0 32 32" width="30" height="30" fill="blue">
  <circle r="5" />
</svg></a>`;
[expect]
const a = html`
    <a><svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
            <path d="" />
        </svg><svg viewBox="0 0 32 32" width="30" height="30" fill="blue">
            <circle r="5" />
        </svg></a>
`;
