Allow html void tags (#73)

* Add instruction for installing husky

* Add failing test for void elements

* Allow parsing and formatting for unclosed void elements

Author: rdimartino

Gemfile.lock

@@ -23,6 +23,7 @@ GEM
 
 PLATFORMS
   arm64-darwin-21
+  arm64-darwin-23
   x86_64-darwin-21
   x86_64-darwin-22
   x86_64-linux

README.md

@@ -79,6 +79,12 @@ puts failures
 
 ## Development
 
+Install `husky`:
+
+```sh
+npm i -g husky
+```
+
 Setup linting:
 
 ```sh

lib/syntax_tree/erb/format.rb

@@ -203,6 +203,10 @@ def visit_opening_tag(node)
             q.text(" ")
           end
 
+          # If element is a valid void element, but not currently self-closing
+          # format to be self-closing
+          q.text(" /") if node.is_void_element? and node.closing.value == ">"
+
           visit(node.closing)
         end
       end

lib/syntax_tree/erb/nodes.rb

@@ -185,6 +185,25 @@ def deconstruct_keys(keys)
     # potentially contain an opening tag that self-closes, in which case the
     # content and closing tag will be nil.
     class HtmlNode < Block
+      # These elements do not require a closing tag
+      # https://developer.mozilla.org/en-US/docs/Glossary/Void_element
+      HTML_VOID_ELEMENTS = %w[
+        area
+        base
+        br
+        col
+        embed
+        hr
+        img
+        input
+        link
+        meta
+        param
+        source
+        track
+        wbr
+      ]
+
       # The opening tag of an element. It contains the opening character (<),
       # the name of the element, any optional attributes, and the closing
       # token (either > or />).
@@ -214,6 +233,10 @@ def child_nodes
           [opening, name, *attributes, closing]
         end
 
+        def is_void_element?
+          HTML_VOID_ELEMENTS.include?(name.value)
+        end
+
         alias deconstruct child_nodes
 
         def deconstruct_keys(keys)
@@ -253,6 +276,10 @@ def deconstruct_keys(keys)
         end
       end
 
+      def is_void_element?
+        false
+      end
+
       def without_new_line
         self.class.new(
           **deconstruct_keys([]).merge(

lib/syntax_tree/erb/parser.rb

@@ -419,7 +419,11 @@ def parse_html_closing
       def parse_html_element
         opening = parse_html_opening_tag
 
-        if opening.closing.value == ">"
+        if opening.closing.value == "/>"
+          HtmlNode.new(opening: opening, location: opening.location)
+        elsif opening.is_void_element?
+          HtmlNode.new(opening: opening, location: opening.location)
+        else
           elements = many { parse_any_tag }
           closing = maybe { parse_html_closing }
 
@@ -443,8 +447,6 @@ def parse_html_element
             closing: closing,
             location: opening.location.to(closing.location)
           )
-        else
-          HtmlNode.new(opening: opening, location: opening.location)
         end
       end
 

test/html_test.rb

@@ -205,5 +205,12 @@ def test_self_closing_group
 
       assert_formatting(source, expected)
     end
+
+    def test_self_closing_for_void_elements
+      source =  "<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" >"
+      expected = "<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\" />\n"
+
+      assert_formatting(source, expected)
+    end
   end
 end