Formatter: Fix ERB quote misplacement in HTML attributes (#331)

This pull request fixes the formatter to correctly handle ERB
expressions within HTML attribute values. Previously, the formatter
would incorrectly move closing tags inside quoted attribute values.

**Input:**
```erb
<data value="<%= @post.external %>"></data>
```

**Before:**
```erb
<data value="<%= @post.external %></data>">
```

**After:**
```erb
<data value="<%= @post.external %>"></data>
```

The fix uses AST-based tag construction instead of string manipulation
to ensure proper quote boundaries.

Resolves #250

Author: marcoroth

javascript/packages/formatter/src/printer.ts

@@ -307,7 +307,34 @@ export class Printer extends Visitor {
         } else if (node.is_void) {
           this.push(indent + inline)
         } else {
-          this.push(indent + inline.replace('>', `></${tagName}>`))
+          let result = `<${tagName}`
+
+          if (attributes.length > 0) {
+            result += ` ${attributes.map(attr => this.renderAttribute(attr)).join(" ")}`
+          }
+
+          if (inlineNodes.length > 0) {
+            const currentIndentLevel = this.indentLevel
+            this.indentLevel = 0
+            const tempLines = this.lines
+            this.lines = []
+
+            inlineNodes.forEach(node => {
+              const wasInlineMode = this.inlineMode
+              this.inlineMode = true
+              this.visit(node)
+              this.inlineMode = wasInlineMode
+            })
+
+            const inlineContent = this.lines.join("")
+            this.lines = tempLines
+            this.indentLevel = currentIndentLevel
+
+            result += inlineContent
+          }
+
+          result += `></${tagName}>`
+          this.push(indent + result)
         }
 
         return

javascript/packages/formatter/test/html/attributes.test.ts

@@ -199,4 +199,64 @@ describe("@herb-tools/formatter", () => {
       </div>
     `)
   })
+
+  test("handles ERB content in attribute values correctly (issue #250)", () => {
+    const source = dedent`
+      <data value="<%= @post.external %>"></data>
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <data value="<%= @post.external %>"></data>
+    `)
+  })
+
+  test("handles complex ERB expressions in attribute values", () => {
+    const source = dedent`
+      <div class="<%= user.admin? ? 'admin' : 'user' %>"></div>
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <div class="<%= user.admin? ? 'admin' : 'user' %>"></div>
+    `)
+  })
+
+  test("handles multiple ERB expressions in single attribute", () => {
+    const source = dedent`
+      <div class="prefix-<%= @id %>-<%= @type %>-suffix"></div>
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <div class="prefix-<%= @id %>-<%= @type %>-suffix"></div>
+    `)
+  })
+
+  test("handles ERB in attribute with nested quotes", () => {
+    const source = dedent`
+      <img src="<%= asset_path('icons/user.png') %>" alt="User">
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <img src="<%= asset_path('icons/user.png') %>" alt="User">
+    `)
+  })
+
+  test("handles ERB in self-closing tags with attributes", () => {
+    const source = dedent`
+      <input type="text" value="<%= @user.name %>" />
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <input type="text" value="<%= @user.name %>" />
+    `)
+  })
+
+  test("handles ERB in void elements", () => {
+    const source = dedent`
+      <input type="text" value="<%= @user.name %>">
+    `
+    const result = formatter.format(source)
+    expect(result).toEqual(dedent`
+      <input type="text" value="<%= @user.name %>">
+    `)
+  })
 })