Formatter: Don't space children of text-level elements

javascript/packages/formatter/src/format-helpers.ts

@@ -77,6 +77,15 @@ export const SPACEABLE_CONTAINERS = new Set([
   'figure', 'details', 'summary', 'dialog', 'fieldset'
 ])
 
+/**
+ * Elements whose content is a run of phrasing content rather than a list of
+ * blocks. Their children render as one continuous piece of text, so a blank
+ * line between them would split a single sentence in the source.
+ */
+export const TEXT_LEVEL_CONTAINERS = new Set([
+  'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p'
+])
+
 
 // --- Node Utility Functions ---
 
@@ -227,6 +236,16 @@ export function isInlineElement(tagName: string): boolean {
   return INLINE_ELEMENTS.has(tagName.toLowerCase())
 }
 
+/**
+ * Check if an element holds phrasing content, so its children render as one
+ * continuous run of text and must not be split apart by blank lines.
+ */
+export function isTextLevelContainer(tagName: string): boolean {
+  const normalized = tagName.toLowerCase()
+
+  return TEXT_LEVEL_CONTAINERS.has(normalized) || INLINE_ELEMENTS.has(normalized)
+}
+
 /**
  * Check if the current inline element is adjacent to a previous inline element (no whitespace between)
  */

javascript/packages/formatter/src/spacing-analyzer.ts

@@ -1,6 +1,6 @@
 import { Node, HTMLTextNode, HTMLElementNode, HTMLDoctypeNode, ERBContentNode, WhitespaceNode, XMLDeclarationNode } from "@herb-tools/core"
 import { isNode, getTagName, isERBNode, isERBOutputNode, isERBCommentNode, isCommentNode, isERBControlFlowNode } from "@herb-tools/core"
-import { findPreviousMeaningfulSibling, findNextMeaningfulSibling, isBlockLevelNode, isContentPreserving, isNonWhitespaceNode } from "./format-helpers.js"
+import { findPreviousMeaningfulSibling, findNextMeaningfulSibling, isBlockLevelNode, isContentPreserving, isNonWhitespaceNode, isTextLevelContainer } from "./format-helpers.js"
 
 import { INLINE_ELEMENTS, SPACEABLE_CONTAINERS } from "./format-helpers.js"
 
@@ -52,6 +52,8 @@ export class SpacingAnalyzer {
 
     if (hasMixedContent) return false
 
+    if (parentElement && isTextLevelContainer(getTagName(parentElement))) return false
+
     const isCurrentComment = isCommentNode(currentNode)
     const isPreviousComment = previousNode ? isCommentNode(previousNode) : false
     const isCurrentMultiline = this.isMultilineElement(currentNode)

javascript/packages/formatter/test/erb/erb.test.ts

@@ -843,7 +843,6 @@ describe("@herb-tools/formatter", () => {
                     data-column="<%= column[:name] %>"
                     <%= 'checked' if column[:default_visible] %>
                   >
-
                   <span class="label-text text-muted-foreground">
                     <%= column[:label] %>
                   </span>

javascript/packages/formatter/test/spacing.test.ts

@@ -389,6 +389,132 @@ describe("Spacing", () => {
     })
   })
 
+  describe("Text-level container Tests", () => {
+    test("does not space ERB output from a following ERB block inside a heading", () => {
+      const source = dedent`
+        <h3>
+          <%= pluralize(events.count, "event") %>
+          <% if channels.any? %>
+            - <%= channels.join(", ") %>
+          <% end %>
+        </h3>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <h3>
+          <%= pluralize(events.count, "event") %>
+          <% if channels.any? %>
+            - <%= channels.join(", ") %>
+          <% end %>
+        </h3>
+      `)
+    })
+
+    test("does not space children of a paragraph", () => {
+      const source = dedent`
+        <p>
+          <%= user.name %>
+          <% if user.admin? %>
+            (admin)
+          <% end %>
+        </p>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <p>
+          <%= user.name %>
+          <% if user.admin? %>
+            (admin)
+          <% end %>
+        </p>
+      `)
+    })
+
+    test("does not space an input from its text inside a label", () => {
+      const source = dedent`
+        <label>
+          <input type="checkbox" name="agree">
+          <span class="label-text">
+            <%= label %>
+          </span>
+        </label>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <label>
+          <input type="checkbox" name="agree">
+          <span class="label-text">
+            <%= label %>
+          </span>
+        </label>
+      `)
+    })
+
+    test("still spaces block-level siblings inside a container", () => {
+      const source = dedent`
+        <div>
+          <p>one</p>
+          <% if channels.any? %>
+            <p>two</p>
+          <% end %>
+        </div>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <div>
+          <p>one</p>
+
+          <% if channels.any? %>
+            <p>two</p>
+          <% end %>
+        </div>
+      `)
+    })
+
+    test("still separates ERB code from ERB output inside a container", () => {
+      const source = dedent`
+        <div>
+          <% user = current_user %>
+          <% time = Time.now %>
+          <%= user.name %>
+          <%= time.strftime("%Y") %>
+        </div>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <div>
+          <% user = current_user %>
+          <% time = Time.now %>
+
+          <%= user.name %>
+          <%= time.strftime("%Y") %>
+        </div>
+      `)
+    })
+
+    test("keeps a blank line the author put inside a heading", () => {
+      const source = dedent`
+        <h3>
+          <%= pluralize(events.count, "event") %>
+
+          <% if channels.any? %>
+            - <%= channels.join(", ") %>
+          <% end %>
+        </h3>
+      `
+      const result = formatter.format(source)
+      expect(result).toEqual(dedent`
+        <h3>
+          <%= pluralize(events.count, "event") %>
+
+          <% if channels.any? %>
+            - <%= channels.join(", ") %>
+          <% end %>
+        </h3>
+      `)
+    })
+  })
+
   describe("Inline Element Tests", () => {
     test("inline elements (span, em, strong) don't get spaced", () => {
       const source = dedent`
@@ -406,7 +532,6 @@ describe("Spacing", () => {
           <span>Span 1</span>
           <span>Span 2</span>
           <span>Span 3</span>
-
           <em>Emphasis</em>
           <strong>Strong</strong>
         </p>