Pre tag indentation/whitespace

[ghandy-dev]

Is your feature request related to a problem? Please describe.
Certain HTML tags display content based on how the child content is already formatted - e.g., the <pre> tag takes preformatted text and displays as is.
Currently the function that generates the HTML always indents the child content that is to follow. So when we have a <pre> element several levels deep in the document tree, we get this extra space prepended, which then renders on the page with the extra indentation, as well as the indentation appended at the end of the content.

      <div>
        <div>
          <div>
            <pre>
              - Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- In eleifend purus non magna consectetur, bibendum rhoncus nunc rhoncus.
- Quisque sit amet massa at sapien pellentesque cursus.
- Aenean eleifend metus ac volutpat auctor.
            </pre>
          <div>
        <div>
      <div>

The <textarea> tag is the only other tag I can think of that cares about the whitespace of it's contents.

Describe the solution you'd like

Add a condition to determine whether the content should be indented, and then not insert any whitespace before or after the contents of the tag if it should not be indented.

static member ToString tag =
    let attributes (props: HtmlProperties list) = 
        if props.Length > 0 then
            " " + (props |> List.map (HtmlProperties.ToString) |> String.concat " ")
        else ""
            
    let rec format tag (props : HtmlProperties list) (children : HtmlElement list) level shouldIndent =
        let cnt =
            if children.Length > 0 then
                if shouldIndent then
                    "\n" + (children |> List.map (fun n -> (String.replicate level "  ")  + helper (level + 1) n) |> String.concat "\n")  + "\n" + (String.replicate (level - 1) "  ")
                else 
                    "\n" + (children |> List.map (fun n -> helper 1 n) |> String.concat "\n") 
            else ""

        let attrs = attributes props
        sprintf "<%s%s>%s</%s>" tag attrs cnt tag

    and formatVoid tag (props : HtmlProperties list) level =
        let attrs = attributes props
        sprintf "<%s%s/>" tag attrs

    // Pre/Textarea/any other indentified tags set shouldIndent to false, the rest true
    and helper level tag =
        match tag with
        ...
        | Pre (props, children) -> format "pre" props children level false
        ...
        | Textarea (props, children) -> format "textarea" props children level false

Resulting in this:

      <div>
        <div>
          <div>
            <pre>
- Lorem ipsum dolor sit amet, consectetur adipiscing elit.
- In eleifend purus non magna consectetur, bibendum rhoncus nunc rhoncus.
- Quisque sit amet massa at sapien pellentesque cursus.
- Aenean eleifend metus ac volutpat auctor.</pre>
          <div>
        <div>
      <div>

Describe alternatives you've considered
You could also do a match statement on those specific tags instead of the shouldIndent condition, or use a separate format function.

Additional context
Before

After