mjml-rb 0.4.3 → 0.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a143101aa0a18f9aa1e77160d0810561f9b5e58fe6dbf8c68d9f809b91421d8d
-  data.tar.gz: b3fb93b17518384e6ce03e96162a30ef870ab4534bfc3c0fe62775b5db21c594
+  metadata.gz: 5b2c747b6f5afbc288db3ddc0afec65b3f0ff5a208bb2958abf8c9869a76790c
+  data.tar.gz: edd5d4b07c99bfd971bafadf42b11a66c0ace207cdfe835fa2643c64fc4297f9
 SHA512:
-  metadata.gz: a811a85d468e8332b29c533efe918038c68fccb9f7383d82bfceff42954cbe7c9faeccbe72dde57380b422881b620a358db2d6032bef62928053a6b25c001d71
-  data.tar.gz: c04f1e1df5835cbf5d0c2f81835ba942aa6f9d3149e592662cffeec22ece7c2841d89f44d4834e5ba29ef8b2891070c402a9da277b04363a7f59541740f2c785
+  metadata.gz: 8989b98cecdb8b63d843f87dd980c409581fe11220cbb439d183768259027a04536799e1d9bc43f5f8760aef216c208ff4e0d74d01e13008f65c749f190fc99c
+  data.tar.gz: 83d310d5e9f5f92bf97da53086c56bca1baed0e9bd7495f7c8595f888b6343621e76b6dc98292db801a28c169a85720be6e8afcd674928ec9a3a4a5947d727fd

data/lib/mjml-rb/components/accordion.rb

@@ -173,7 +173,7 @@ module MjmlRb
             when "mj-accordion-element"
               render_accordion_element(child, context, accordion_attrs)
             when "mj-raw"
-              raw_inner(child)
+              raw_inner_for_body(child)
             else
               render_node(child, context, parent: "mj-accordion")
             end
@@ -210,7 +210,7 @@ module MjmlRb
               child_attrs = attrs.merge(resolved_attributes(child, context))
               content << render_accordion_text(child, child_attrs)
             when "mj-raw"
-              content << raw_inner(child)
+              content << raw_inner_for_body(child)
             end
           end
         end
@@ -249,7 +249,7 @@ module MjmlRb
           "width" => "100%",
           "border-bottom" => title_attrs["border"] || DEFAULTS["border"]
         )
-        title_content = node ? raw_inner(node) : ""
+        title_content = node ? raw_inner_for_body(node) : ""
         title_cell = %(<td style="#{td_style}">#{title_content}</td>)
         icon_cell = %(<td class="mj-accordion-ico" style="#{td2_style}"><img src="#{escape_attr(title_attrs["icon-wrapped-url"] || DEFAULTS["icon-wrapped-url"])}" alt="#{escape_attr(title_attrs["icon-wrapped-alt"] || DEFAULTS["icon-wrapped-alt"])}" class="mj-accordion-more" style="#{icon_style}" /><img src="#{escape_attr(title_attrs["icon-unwrapped-url"] || DEFAULTS["icon-unwrapped-url"])}" alt="#{escape_attr(title_attrs["icon-unwrapped-alt"] || DEFAULTS["icon-unwrapped-alt"])}" class="mj-accordion-less" style="#{icon_style}" /></td>)
         cells = title_attrs["icon-position"] == "left" ? "#{icon_cell}#{title_cell}" : "#{title_cell}#{icon_cell}"
@@ -277,7 +277,7 @@ module MjmlRb
           "width" => "100%",
           "border-bottom" => text_attrs["border"] || DEFAULTS["border"]
         )
-        content = node ? raw_inner(node) : ""
+        content = node ? raw_inner_for_body(node) : ""
         css_class = text_attrs["css-class"] ? %( class="#{escape_attr(text_attrs["css-class"])}") : ""
 
         %(<div class="mj-accordion-content"><table role="presentation" width="100%" cellspacing="0" cellpadding="0" style="#{table_style}"><tbody><tr><td#{css_class} style="#{td_style}">#{content}</td></tr></tbody></table></div>)

data/lib/mjml-rb/components/base.rb

@@ -50,6 +50,10 @@ module MjmlRb
         renderer.send(:raw_inner, node)
       end
 
+      def raw_inner_for_body(node)
+        renderer.send(:annotate_raw_html, raw_inner(node))
+      end
+
       # Like raw_inner but HTML-escapes text nodes. Use for components such as
       # mj-text where the inner content is treated as HTML but bare text must
       # be properly encoded (e.g. & -> &).

data/lib/mjml-rb/components/button.rb

@@ -143,7 +143,7 @@ module MjmlRb
           link_attrs["title"] = a["title"]
         end
 
-        content = raw_inner(node)
+        content = raw_inner_for_body(node)
         inner_tag = %(<#{tag}#{html_attrs(link_attrs)}>#{content}</#{tag}>)
         table = %(<table border="0" cellpadding="0" cellspacing="0" role="presentation" style="#{table_style}"><tbody><tr><td#{html_attrs(td_attrs)}>#{inner_tag}</td></tr></tbody></table>)
 

data/lib/mjml-rb/components/navbar.rb

@@ -205,7 +205,7 @@ module MjmlRb
           "style" => anchor_style
         }
 
-        content = raw_inner(node)
+        content = raw_inner_for_body(node)
         link = %(<a#{html_attrs(link_attrs)}>#{content}</a>)
         return link unless parent == "mj-navbar"
 

data/lib/mjml-rb/components/raw.rb

@@ -10,7 +10,7 @@ module MjmlRb
       }.freeze
 
       def render(tag_name:, node:, context:, attrs:, parent:)
-        raw_inner(node)
+        raw_inner_for_body(node)
       end
 
       def handle_head(node, context)

data/lib/mjml-rb/components/text.rb

@@ -72,7 +72,7 @@ module MjmlRb
           "height" => height
         )
 
-        content = raw_inner(node)
+        content = raw_inner_for_body(node)
         inner_div = %(<div style="#{div_style}">#{content}</div>)
 
         body = if height

data/lib/mjml-rb/dependencies.rb

@@ -4,7 +4,7 @@ module MjmlRb
   module Dependencies
     # Components whose content is treated as raw HTML in NPM (endingTag = true).
     # The parser preserves their inner markup as-is; the validator skips child
-    # element checks because REXML structurally parses what NPM treats as text.
+    # element checks because the XML parser structurally parses what NPM treats as text.
     ENDING_TAGS = Set.new(%w[
       mj-accordion-text
       mj-accordion-title

data/lib/mjml-rb/parser.rb

@@ -1,11 +1,9 @@
-require "rexml/document"
-require "rexml/xpath"
+require "nokogiri"
 
 require_relative "ast_node"
 
 module MjmlRb
   class Parser
-    include REXML
     HTML_VOID_TAGS = %w[area base br col embed hr img input link meta param source track wbr].freeze
 
     # Ending-tag components whose inner HTML is preserved as raw content via CDATA
@@ -18,13 +16,21 @@ module MjmlRb
     ].freeze
 
     # Pre-compiled regex patterns to avoid rebuilding on every call
-    ENDING_TAGS_CDATA_RE = /<(#{ENDING_TAGS_FOR_CDATA.map { |t| Regexp.escape(t) }.join("|")})(\s[^<>]*?)?(?<!\/)>(.*?)<\/\1>/mi.freeze
+    ENDING_TAG_OPEN_RE = /<(#{ENDING_TAGS_FOR_CDATA.map { |t| Regexp.escape(t) }.join("|")})(\s[^<>]*?)?(?<!\/)>/mi.freeze
 
     VOID_TAG_CLOSING_BR_RE = %r{</br\s*>}i.freeze
     VOID_TAG_CLOSING_OTHER_RE = /<\/(#{(HTML_VOID_TAGS - ["br"]).join("|")})\s*>/i.freeze
     VOID_TAG_OPEN_RE = /<(#{HTML_VOID_TAGS.join("|")})(\s[^<>]*?)?>/i.freeze
-    LINE_ANNOTATION_RE = /(\n)|(<!\[CDATA\[.*?\]\]>)|(<(?:mj-[\w-]+|mjml)(?=[\s\/>]))/m.freeze
     BARE_AMPERSAND_RE = /&(?!(?:#[0-9]+|#x[0-9a-fA-F]+|[a-zA-Z][a-zA-Z0-9]*);)/.freeze
+    ROOT_LEVEL_HEAD_TAGS = %w[
+      mj-attributes
+      mj-breakpoint
+      mj-html-attributes
+      mj-font
+      mj-preview
+      mj-style
+      mj-title
+    ].freeze
 
     class ParseError < StandardError
       attr_reader :line
@@ -47,10 +53,12 @@ module MjmlRb
       xml = normalize_html_void_tags(xml)
       xml = expand_includes(xml, opts) unless opts[:ignore_includes]
 
-      xml = annotate_line_numbers(sanitize_bare_ampersands(xml))
-      doc = Document.new(xml)
+      xml = sanitize_bare_ampersands(xml)
+      xml = replace_html_entities(xml)
+      doc = Nokogiri::XML(xml) { |config| config.strict }
+      normalize_root_head_elements(doc)
       element_to_ast(doc.root, keep_comments: opts[:keep_comments])
-    rescue ParseException => e
+    rescue Nokogiri::XML::SyntaxError => e
       raise ParseError.new("XML parse error: #{e.message}")
     end
 
@@ -75,18 +83,18 @@ module MjmlRb
     def expand_includes(xml, options, included_in = [])
       xml = wrap_ending_tags_in_cdata(xml)
       xml = normalize_html_void_tags(xml)
-      doc = Document.new(sanitize_bare_ampersands(xml))
-      includes = XPath.match(doc, "//mj-include")
+      doc = parse_xml(sanitize_bare_ampersands(xml))
+      includes = doc.xpath("//mj-include")
       return xml if includes.empty?
 
       css_includes = []
       head_includes = []
 
       includes.reverse_each do |include_node|
-        path_attr = include_node.attributes["path"]
+        path_attr = include_node["path"]
         raise ParseError, "mj-include path is required" if path_attr.to_s.empty?
 
-        include_type = include_node.attributes["type"].to_s
+        include_type = include_node["type"].to_s
         parent = include_node.parent
 
         resolved_path = begin
@@ -104,7 +112,7 @@ module MjmlRb
             tag_name: "mj-include",
             file: display_path
           }
-          parent.delete(include_node)
+          include_node.remove
           next
         end
 
@@ -115,9 +123,9 @@ module MjmlRb
 
         if include_type == "css"
           # CSS includes get collected and added to mj-head later
-          css_inline = include_node.attributes["css-inline"].to_s
+          css_inline = include_node["css-inline"].to_s
           css_includes << { content: include_content, inline: css_inline == "inline" }
-          parent.delete(include_node)
+          include_node.remove
           next
         end
 
@@ -135,19 +143,20 @@ module MjmlRb
                         body_children
                       end
 
-        insert_before = include_node
-        replacement_nodes = if replacement.is_a?(Array)
-                              replacement
-                            else
-                              fragment = Document.new(sanitize_bare_ampersands("<include-root>#{replacement}</include-root>"))
-                              fragment.root.children.map { |child| deep_clone(child) }
-                            end
-
-        replacement_nodes.each do |child|
-          annotate_include_source(child, resolved_path) if child.is_a?(Element)
-          parent.insert_before(insert_before, child)
+        if replacement.is_a?(Array)
+          replacement.each do |child|
+            annotate_include_source(child, resolved_path) if child.element?
+            include_node.add_previous_sibling(child)
+          end
+        else
+          fragment = parse_xml("<include-root>#{sanitize_bare_ampersands(replacement)}</include-root>").root
+          fragment.children.each do |child|
+            cloned = child.dup(1)
+            annotate_include_source(cloned, resolved_path) if cloned.element?
+            include_node.add_previous_sibling(cloned)
+          end
         end
-        parent.delete(include_node)
+        include_node.remove
       end
 
       inject_head_includes(doc, head_includes) unless head_includes.empty?
@@ -157,11 +166,7 @@ module MjmlRb
         inject_css_includes(doc, css_includes)
       end
 
-      output = +""
-      doc.write(output)
-      output
-    rescue ParseException => e
-      raise ParseError, "Failed to parse included content: #{e.message}"
+      doc.root.to_xml(save_with: Nokogiri::XML::Node::SaveOptions::AS_XML | Nokogiri::XML::Node::SaveOptions::NO_DECLARATION)
     end
 
     def prepare_mjml_include_document(content)
@@ -172,22 +177,23 @@ module MjmlRb
     end
 
     def extract_mjml_include_children(xml)
-      include_doc = Document.new(sanitize_bare_ampersands(xml))
+      include_doc = parse_xml(sanitize_bare_ampersands(xml))
+      normalize_root_head_elements(include_doc)
       mjml_root = include_doc.root
       return [[], []] unless mjml_root&.name == "mjml"
 
-      body = XPath.first(mjml_root, "mj-body")
-      head = XPath.first(mjml_root, "mj-head")
+      body = mjml_root.at_xpath("mj-body")
+      head = mjml_root.at_xpath("mj-head")
 
       [
-        body ? body.children.map { |child| deep_clone(child) } : [],
-        head ? head.children.map { |child| deep_clone(child) } : []
+        body ? body.children.map { |child| child.dup(1) } : [],
+        head ? head.children.map { |child| child.dup(1) } : []
       ]
     end
 
     def inject_head_includes(doc, head_includes)
       head = ensure_head(doc)
-      head_includes.each { |child| head.add(child) }
+      head_includes.each { |child| head.add_child(child) }
     end
 
     def inject_css_includes(doc, css_includes)
@@ -195,10 +201,10 @@ module MjmlRb
 
       # Add each CSS include as an mj-style element
       css_includes.each do |css_include|
-        style_node = Element.new("mj-style")
-        style_node.add_attribute("inline", "inline") if css_include[:inline]
-        style_node.add(CData.new(css_include[:content]))
-        head.add(style_node)
+        style_node = Nokogiri::XML::Node.new("mj-style", doc)
+        style_node["inline"] = "inline" if css_include[:inline]
+        style_node.add_child(Nokogiri::XML::CDATA.new(doc, css_include[:content]))
+        head.add_child(style_node)
       end
     end
 
@@ -206,19 +212,51 @@ module MjmlRb
       mjml_root = doc.root
       return unless mjml_root
 
-      head = XPath.first(mjml_root, "mj-head")
+      head = mjml_root.at_xpath("mj-head")
       return head if head
 
-      head = Element.new("mj-head")
-      body = XPath.first(mjml_root, "mj-body")
+      head = Nokogiri::XML::Node.new("mj-head", doc)
+      body = mjml_root.at_xpath("mj-body")
       if body
-        mjml_root.insert_before(body, head)
+        body.add_previous_sibling(head)
       else
-        mjml_root.add(head)
+        mjml_root.add_child(head)
       end
       head
     end
 
+    def normalize_root_head_elements(doc)
+      mjml_root = doc.root
+      return unless mjml_root&.name == "mjml"
+
+      head_nodes = []
+      normalized_head_children = []
+      root_head_elements = []
+
+      mjml_root.children.each do |child|
+        next unless child.element?
+
+        if child.name == "mj-head"
+          head_nodes << child
+          child.children.each { |head_child| normalized_head_children << head_child.dup(1) }
+        elsif ROOT_LEVEL_HEAD_TAGS.include?(child.name)
+          root_head_elements << child
+          normalized_head_children << child.dup(1)
+        end
+      end
+
+      return if root_head_elements.empty? && head_nodes.length <= 1
+
+      head = head_nodes.first || ensure_head(doc)
+      return unless head
+
+      head.children.each(&:remove)
+      normalized_head_children.each { |child| head.add_child(child) }
+
+      root_head_elements.each(&:remove)
+      head_nodes.drop(1).each(&:remove)
+    end
+
     def strip_xml_declaration(content)
       content.sub(/\A<\?xml[^>]*\?>\s*/m, "")
     end
@@ -239,20 +277,74 @@ module MjmlRb
     end
 
     def wrap_ending_tags_in_cdata(content)
-      # Negative lookbehind (?<!\/) ensures self-closing tags like <mj-text ... /> are skipped
-      content.gsub(ENDING_TAGS_CDATA_RE) do
-        tag = Regexp.last_match(1)
-        attrs = Regexp.last_match(2).to_s
-        inner = Regexp.last_match(3).to_s
+      wrapped = +""
+      cursor = 0
+
+      while (match = ENDING_TAG_OPEN_RE.match(content, cursor))
+        tag = match[1]
+        attrs = match[2].to_s
+        wrapped << content[cursor...match.begin(0)]
+
+        closing_range = find_matching_ending_tag(content, tag, match.end(0))
+        unless closing_range
+          wrapped << match[0]
+          cursor = match.end(0)
+          next
+        end
+
+        inner = content[match.end(0)...closing_range.begin(0)]
         if inner.include?("<![CDATA[")
-          "<#{tag}#{attrs}>#{inner}</#{tag}>"
+          wrapped << "<#{tag}#{attrs}>#{inner}</#{tag}>"
         else
           # Pre-process content: normalize void tags and sanitize bare ampersands
           # before wrapping in CDATA, so the raw HTML is well-formed for output.
           prepared = sanitize_bare_ampersands(normalize_html_void_tags(inner))
-          "<#{tag}#{attrs}><![CDATA[#{escape_cdata(prepared)}]]></#{tag}>"
+          wrapped << "<#{tag}#{attrs}><![CDATA[#{escape_cdata(prepared)}]]></#{tag}>"
         end
+
+        cursor = closing_range.end(0)
       end
+
+      wrapped << content[cursor..] if cursor < content.length
+      wrapped
+    end
+
+    def find_matching_ending_tag(content, tag_name, cursor)
+      open_tag_re = /<#{Regexp.escape(tag_name)}(\s[^<>]*?)?(?<!\/)>/mi
+      close_tag_re = %r{</#{Regexp.escape(tag_name)}\s*>}i
+      depth = 1
+
+      while cursor < content.length
+        cdata_index = content.index("<![CDATA[", cursor)
+        open_match = open_tag_re.match(content, cursor)
+        close_match = close_tag_re.match(content, cursor)
+
+        candidates = []
+        candidates << [:cdata, cdata_index, nil] if cdata_index
+        candidates << [:open, open_match.begin(0), open_match] if open_match
+        candidates << [:close, close_match.begin(0), close_match] if close_match
+        return nil if candidates.empty?
+
+        kind, _, match = candidates.min_by { |candidate| candidate[1] }
+
+        case kind
+        when :cdata
+          cdata_end = content.index("]]>", cdata_index + 9)
+          return nil unless cdata_end
+
+          cursor = cdata_end + 3
+        when :open
+          depth += 1
+          cursor = match.end(0)
+        when :close
+          depth -= 1
+          return match if depth.zero?
+
+          cursor = match.end(0)
+        end
+      end
+
+      nil
     end
 
     def escape_cdata(content)
@@ -260,40 +352,39 @@ module MjmlRb
     end
 
     # Escape bare "&" that are not part of a valid XML entity reference
-    # (e.g. &amp; &#123; &#x1F;).  This lets REXML parse HTML-ish content
-    # such as "Terms & Conditions" which is common in email templates.
+    # (e.g. &amp; &#123; &#x1F;).  This lets the XML parser handle HTML-ish
+    # content such as "Terms & Conditions" which is common in email templates.
     def sanitize_bare_ampersands(content)
       content.gsub(BARE_AMPERSAND_RE, "&amp;")
     end
 
-    # Adds data-mjml-line attributes to MJML tags so line numbers survive
-    # REXML parsing (which doesn't expose source positions).
-    # Skips content inside CDATA sections to avoid modifying raw HTML.
-    def annotate_line_numbers(xml)
-      line = 1
-      xml.gsub(LINE_ANNOTATION_RE) do
-        if Regexp.last_match(1) # newline
-          line += 1
-          "\n"
-        elsif Regexp.last_match(2) # CDATA section — count newlines, pass through
-          line += Regexp.last_match(2).count("\n")
-          Regexp.last_match(2)
-        else # opening MJML tag
-          "#{Regexp.last_match(3)} data-mjml-line=\"#{line}\""
-        end
+    # Replace HTML named entities (e.g. &nbsp;, &copy;) with their numeric
+    # XML equivalents (e.g. &#160;, &#169;).  XML only defines five named
+    # entities (amp, lt, gt, quot, apos); all other named references from
+    # HTML must be converted to numeric form for the XML parser to accept them.
+    # Uses Nokogiri's built-in HTML entity lookup table.
+    def replace_html_entities(content)
+      content.gsub(/&([a-zA-Z][a-zA-Z0-9]*);/) do |match|
+        name = ::Regexp.last_match(1)
+        next match if XML_PREDEFINED_ENTITIES.include?(name)
+
+        codepoint = Nokogiri::HTML::NamedCharacters[name]
+        codepoint ? "&##{codepoint};" : match
       end
     end
 
-    # Recursively marks REXML elements from included files with data-mjml-file.
+    XML_PREDEFINED_ENTITIES = %w[amp lt gt quot apos].freeze
+
+    # Recursively marks Nokogiri elements from included files with data-mjml-file.
     # Only sets the attribute on elements that don't already have it (preserving
     # deeper include annotations from recursive expansion).
     def annotate_include_source(element, file_path)
-      return unless element.is_a?(Element)
+      return unless element.element?
 
-      if (element.name.start_with?("mj-") || element.name == "mjml") && !element.attributes["data-mjml-file"]
-        element.add_attribute("data-mjml-file", file_path)
+      if (element.name.start_with?("mj-") || element.name == "mjml") && !element["data-mjml-file"]
+        element["data-mjml-file"] = file_path
       end
-      element.each_element { |child| annotate_include_source(child, file_path) }
+      element.element_children.each { |child| annotate_include_source(child, file_path) }
     end
 
     def resolve_include_path(include_path, actual_path, file_path)
@@ -311,37 +402,24 @@ module MjmlRb
       raise Errno::ENOENT, include_path
     end
 
-    def deep_clone(node)
-      case node
-      when Element
-        clone = Element.new(node.name)
-        node.attributes.each_attribute { |attr| clone.add_attribute(attr.expanded_name, attr.value) }
-        node.children.each { |child| clone.add(deep_clone(child)) }
-        clone
-      when Text
-        Text.new(node.value)
-      when Comment
-        Comment.new(node.string)
-      else
-        node
-      end
-    end
-
     def element_to_ast(element, keep_comments:)
       raise ParseError, "Missing XML root element" unless element
 
-      # Extract metadata annotations (added by annotate_line_numbers / annotate_include_source)
+      # Extract metadata annotations (added by annotate_include_source)
       # and strip them from the public attributes hash.
-      meta_line = element.attributes["data-mjml-line"]&.to_i
-      meta_file = element.attributes["data-mjml-file"]
-      attrs = element.attributes.each_with_object({}) do |(name, val), h|
-        h[name] = val unless name.start_with?("data-mjml-")
+      # Line numbers come from Nokogiri's native node.line.
+      meta_line = element.line
+      meta_file = element["data-mjml-file"]
+      attrs = {}
+      element.attributes.each do |name, attr|
+        attrs[name] = attr.value unless name.start_with?("data-mjml-")
       end
+      attrs["data-mjml-raw"] = "true" unless element.name.start_with?("mj-") || element.name == "mjml"
 
       # For ending-tag elements whose content was wrapped in CDATA, store
       # the raw HTML directly as content instead of parsing structurally.
       if ENDING_TAGS_FOR_CDATA.include?(element.name)
-        raw_content = element.children.select { |c| c.is_a?(Text) }.map(&:value).join
+        raw_content = element.children.select { |c| c.cdata? || c.text? }.map(&:content).join
         return AstNode.new(
           tag_name: element.name,
           attributes: attrs,
@@ -353,14 +431,16 @@ module MjmlRb
       end
 
       children = element.children.each_with_object([]) do |child, memo|
-        case child
-        when Element
+        if child.element?
           memo << element_to_ast(child, keep_comments: keep_comments)
-        when Text
-          text = child.value
-          memo << AstNode.new(tag_name: "#text", content: text) unless text.strip.empty?
-        when Comment
-          memo << AstNode.new(tag_name: "#comment", content: child.string) if keep_comments
+        elsif child.text? || child.cdata?
+          text = child.content
+          next if text.empty?
+          next if text.strip.empty? && ignorable_whitespace_text?(text, parent_element_name: element.name)
+
+          memo << AstNode.new(tag_name: "#text", content: text)
+        elsif child.comment?
+          memo << AstNode.new(tag_name: "#comment", content: child.content) if keep_comments
         end
       end
 
@@ -372,5 +452,18 @@ module MjmlRb
         file: meta_file
       )
     end
+
+    # Lenient XML parse used during include expansion and intermediate steps.
+    # Errors are collected but do not raise; the final strict parse in #parse
+    # will surface any real issues.
+    def parse_xml(xml)
+      Nokogiri::XML(replace_html_entities(xml))
+    end
+
+    def ignorable_whitespace_text?(text, parent_element_name:)
+      return true if parent_element_name.start_with?("mj-") || parent_element_name == "mjml"
+
+      text.match?(/[\r\n]/)
+    end
   end
 end

data/lib/mjml-rb/renderer.rb

@@ -1,4 +1,5 @@
 require "cgi"
+require "css_parser"
 require "nokogiri"
 require "set"
 require_relative "components/accordion"
@@ -168,6 +169,8 @@ module MjmlRb
       HTML
 
       html = apply_inline_styles(html, context)
+      html = preserve_raw_tag_spacing(html)
+      html = strip_internal_raw_markers(html)
       html = merge_outlook_conditionals(html)
       before_doctype.empty? ? html : "#{before_doctype}\n#{html}"
     end
@@ -342,20 +345,27 @@ module MjmlRb
       return html if css_blocks.empty?
 
       document = parse_html_document(html)
-      rules, at_rules_css = parse_inline_css_rules(css_blocks.join("\n"))
+      rules, = parse_inline_css_rules(css_blocks.join("\n"))
+      merged_declarations_by_node = {}
+      touched_properties_by_node = Hash.new { |hash, node| hash[node] = Set.new }
 
       rules.each do |selector, declarations|
         next if selector.empty? || declarations.empty?
 
         select_nodes(document, selector).each do |node|
-          merge_inline_style!(node, declarations)
+          existing = merged_declarations_by_node[node] ||= begin
+            source = node["data-mjml-raw"] == "true" ? :inline : :css
+            parsed = parse_css_declarations(node["style"].to_s, source: source)
+            touched_properties_by_node[node].merge(parsed.keys & HTML_ATTRIBUTE_SYNC_PROPERTIES.to_a) if source == :inline
+            parsed
+          end
+          merge_inline_declarations!(existing, declarations, touched_properties_by_node[node])
         end
       end
 
-      # Inject preserved @-rules (@media, @font-face, etc.) as a <style> block.
-      # These rules cannot be inlined into style attributes but should be kept
-      # in the document for runtime application by email clients.
-      inject_preserved_at_rules(document, at_rules_css)
+      merged_declarations_by_node.each do |node, declarations|
+        finalize_inline_style!(node, declarations, touched_properties_by_node[node])
+      end
 
       document.to_html
     end
@@ -368,18 +378,6 @@ module MjmlRb
       end
     end
 
-    def inject_preserved_at_rules(document, at_rules_css)
-      return if at_rules_css.nil? || at_rules_css.strip.empty?
-
-      head = document.at_css("head")
-      return unless head
-
-      style = Nokogiri::XML::Node.new("style", document)
-      style["type"] = "text/css"
-      style.content = at_rules_css.strip
-      head.add_child(style)
-    end
-
     def select_nodes(document, selector)
       document.css(selector)
     rescue Nokogiri::CSS::SyntaxError, Nokogiri::XML::XPath::SyntaxError
@@ -420,146 +418,69 @@ module MjmlRb
     end
 
     def parse_inline_css_rules(css)
-      stripped_css = strip_css_comments(css.to_s)
-      plain_css, at_rules_css = extract_css_at_rules(stripped_css)
-
-      rules = plain_css.scan(/([^{}]+)\{([^{}]+)\}/m).flat_map do |selector_group, declarations|
-        selectors = selector_group.split(",").map(&:strip).reject(&:empty?)
-        declaration_map = parse_css_declarations(declarations)
-        selectors.map { |selector| [selector, declaration_map] }
+      parser = CssParser::Parser.new
+      parser.add_block!(css.to_s)
+
+      rules = []
+      parser.each_rule_set do |rule_set, media_types|
+        # Only inline rules not inside @media blocks; css_parser stores
+        # top-level rules under the :all media type.
+        next unless media_types == [:all]
+
+        rule_set.each_selector do |selector, declarations_str, specificity|
+          selector = selector.strip
+          # Skip @-rules like @font-face that css_parser yields as selectors
+          next if selector.start_with?("@")
+
+          declaration_map = parse_css_declarations(declarations_str)
+          rules << [selector, declaration_map, specificity]
+        end
       end
 
       # Sort rules by specificity (ascending). With the "last wins" merge
       # strategy, higher-specificity rules applied later correctly override
       # lower-specificity ones — matching CSS cascade behavior.
-      sorted = rules.each_with_index
-                    .sort_by { |(selector, _), idx| [css_specificity(selector), idx] }
-                    .map(&:first)
+      sorted = rules.sort_by.with_index { |(_, _, spec), idx| [spec, idx] }
+                    .map { |sel, decl, _| [sel, decl] }
 
-      [sorted, at_rules_css]
+      [sorted, ""]
     end
 
-    def strip_css_comments(css)
-      css.gsub(%r{/\*.*?\*/}m, "")
+    def css_specificity(selector)
+      CssParser.calculate_specificity(selector.to_s)
     end
 
-    # Separates @-rules (@media, @font-face, etc.) from plain CSS selectors.
-    # Returns [plain_css, at_rules_css]. The at_rules_css can be injected as a
-    # <style> block since @-rules cannot be inlined into style attributes.
-    def extract_css_at_rules(css)
-      plain = +""
-      at_rules = +""
-      index = 0
-
-      while index < css.length
-        if css[index] == "@"
-          brace_index = css.index("{", index)
-          semicolon_index = css.index(";", index)
-
-          # Simple @-rules like @import or @charset end with semicolon
-          if semicolon_index && (brace_index.nil? || semicolon_index < brace_index)
-            at_rules << css[index..semicolon_index] << "\n"
-            index = semicolon_index + 1
-            next
-          end
-
-          # Block @-rules like @media, @font-face have nested braces
-          if brace_index
-            depth = 1
-            cursor = brace_index + 1
-            while cursor < css.length && depth.positive?
-              depth += 1 if css[cursor] == "{"
-              depth -= 1 if css[cursor] == "}"
-              cursor += 1
-            end
-            at_rules << css[index...cursor] << "\n"
-            index = cursor
-            next
-          end
-        end
-
-        plain << css[index]
-        index += 1
-      end
-
-      [plain, at_rules]
-    end
+    def parse_css_declarations(declarations, source: :css)
+      return {} if declarations.nil? || declarations.to_s.strip.empty?
 
-    # Calculates CSS specificity as a comparable [a, b, c] tuple:
-    #   a = number of ID selectors (#id)
-    #   b = number of class selectors (.class), attribute selectors ([attr]),
-    #       and pseudo-classes (:hover, :lang())
-    #   c = number of type selectors (div, p) and pseudo-elements (::before)
-    def css_specificity(selector)
-      s = selector.to_s
-
-      # a: ID selectors
-      a = s.scan(/#[\w-]+/).length
-
-      # b: class selectors + attribute selectors + pseudo-classes
-      b = s.scan(/\.[\w-]+/).length +
-          s.scan(/\[[^\]]*\]/).length +
-          s.scan(/:(?!:)[\w-]+/).length
-
-      # c: type selectors + pseudo-elements
-      # Strip everything except element names and combinators
-      cleaned = s
-        .gsub(/#[\w-]+/, "")                           # remove IDs
-        .gsub(/\.[\w-]+/, "")                           # remove classes
-        .gsub(/\[[^\]]*\]/, "")                         # remove attribute selectors
-        .gsub(/:[\w-]+(?:\([^)]*\))?/, "")              # remove pseudo-classes
-        .gsub(/::[\w-]+/, "")                           # remove pseudo-elements (counted separately)
-        .gsub(/[>+~]/, " ")                             # combinators → spaces
-        .gsub(/\*/, "")                                 # universal selector has no specificity
-      c = cleaned.split.reject(&:empty?).length +
-          s.scan(/::[\w-]+/).length
-
-      [a, b, c]
-    end
-
-    def parse_css_declarations(declarations)
-      declarations.split(";").each_with_object({}) do |entry, memo|
-        property, value = entry.split(":", 2).map { |part| part&.strip }
+      rule_set = CssParser::RuleSet.new(block: declarations.to_s)
+      result = {}
+      rule_set.each_declaration do |property, value, important|
         next if property.nil? || property.empty? || value.nil? || value.empty?
 
-        important = value.match?(/\s*!important\s*\z/)
-        memo[property] = {
-          value: value.sub(/\s*!important\s*\z/, "").strip,
-          important: important
+        result[property] = {
+          value: value,
+          important: important,
+          source: source
         }
       end
+      result
     end
 
-    def merge_inline_style!(node, declarations)
-      existing = parse_css_declarations(node["style"].to_s)
+    def merge_inline_declarations!(existing, declarations, touched_properties)
       declarations.each do |property, value|
         merged = merge_css_declaration(existing[property], value)
         next if merged.equal?(existing[property])
 
         existing.delete(property)
         existing[property] = merged
+        touched_properties << property
       end
-      normalize_background_fallbacks!(node, existing)
-      sync_html_attributes!(node, existing)
-      node["style"] = serialize_css_declarations(existing)
     end
 
-    def normalize_background_fallbacks!(node, declarations)
-      background_image = declaration_value(declarations["background-image"])
-      if background_image && !background_image.empty?
-        declarations.delete("background") if syncable_background?(declaration_value(declarations["background"]))
-        return
-      end
-
-      background_color = declaration_value(declarations["background-color"])
-      return if background_color.nil? || background_color.empty?
-
-      if syncable_background?(declaration_value(declarations["background"]))
-        declarations["background"] = {
-          value: background_color,
-          important: declarations.fetch("background-color", {}).fetch(:important, false)
-        }
-      end
+    def finalize_inline_style!(node, declarations, touched_properties)
+      sync_html_attributes!(node, declarations, touched_properties)
+      node["style"] = serialize_css_declarations(declarations)
     end
 
     # Sync HTML attributes from inlined CSS declarations.
@@ -575,15 +496,19 @@ module MjmlRb
       "text-align" => "align",
       "vertical-align" => "valign"
     }.freeze
+    HTML_ATTRIBUTE_SYNC_PROPERTIES = Set.new((%w[width height] + STYLE_TO_ATTRIBUTE.keys)).freeze
 
-    def sync_html_attributes!(node, declarations)
+    def sync_html_attributes!(node, declarations, touched_properties = nil)
       tag = node.name.downcase
 
       # Sync width/height on TABLE, TD, TH, IMG
       if WIDTH_HEIGHT_ELEMENTS.include?(tag)
         %w[width height].each do |prop|
+          next if touched_properties && !touched_properties.include?(prop)
+
           css_value = declaration_value(declarations[prop])
           next if css_value.nil? || css_value.empty?
+          next if tag == "img" && prop == "width" && css_value.include?("%")
 
           # Convert CSS px values to plain numbers for HTML attributes;
           # keep other values (auto, %) as-is.
@@ -595,6 +520,8 @@ module MjmlRb
       # Sync style-to-attribute mappings on table elements
       if TABLE_ELEMENTS.include?(tag)
         STYLE_TO_ATTRIBUTE.each do |css_prop, html_attr|
+          next if touched_properties && !touched_properties.include?(css_prop)
+
           css_value = declaration_value(declarations[css_prop])
           next if css_value.nil? || css_value.empty?
 
@@ -615,26 +542,10 @@ module MjmlRb
       end
     end
 
-    def syncable_background?(value)
-      return true if value.nil? || value.empty?
-
-      normalized = value.downcase
-      !normalized.include?("url(") &&
-        !normalized.include?("gradient(") &&
-        !normalized.include?("/") &&
-        !normalized.include?(" no-repeat") &&
-        !normalized.include?(" repeat") &&
-        !normalized.include?(" fixed") &&
-        !normalized.include?(" scroll") &&
-        !normalized.include?(" center") &&
-        !normalized.include?(" top") &&
-        !normalized.include?(" bottom") &&
-        !normalized.include?(" left") &&
-        !normalized.include?(" right")
-    end
-
     def merge_css_declaration(existing, incoming)
       return incoming if existing.nil?
+      return incoming if incoming[:important] && !existing[:important]
+      return existing if existing[:source] == :inline
       return existing if existing[:important] && !incoming[:important]
 
       incoming
@@ -645,13 +556,49 @@ module MjmlRb
     end
 
     def serialize_css_declarations(declarations)
-      declarations.map do |property, declaration|
-        value = declaration[:value]
-        value = "#{value} !important" if declaration[:important]
-        "#{property}: #{value}"
+      ordered_css_declarations(declarations).map do |property, declaration|
+        "#{property}: #{declaration[:value]}"
       end.join("; ")
     end
 
+    SHORTHAND_LONGHAND_FAMILIES = {
+      "background" => /\Abackground-/,
+      "border" => /\Aborder(?:-(?!collapse|spacing)[a-z-]+)?\z/,
+      "border-radius" => /\Aborder-(?:top|bottom)-(?:left|right)-radius\z/,
+      "font" => /\Afont-/,
+      "list-style" => /\Alist-style-/,
+      "margin" => /\Amargin-(?:top|right|bottom|left)\z/,
+      "padding" => /\Apadding-(?:top|right|bottom|left)\z/
+    }.freeze
+
+    def ordered_css_declarations(declarations)
+      ordered = declarations.to_a
+
+      SHORTHAND_LONGHAND_FAMILIES.each do |shorthand, longhand_pattern|
+        family_indexes = ordered.each_index.select do |index|
+          property = ordered[index][0]
+          property == shorthand || property.match?(longhand_pattern)
+        end
+        next if family_indexes.length < 2
+
+        family_entries = family_indexes.map.with_index do |declaration_index, original_family_index|
+          [ordered[declaration_index], original_family_index]
+        end
+        next unless family_entries.any? { |((_, declaration), _)| declaration[:important] }
+        next unless family_entries.any? { |((_, declaration), _)| !declaration[:important] }
+
+        reordered_entries = family_entries.sort_by do |((_, declaration), original_family_index)|
+          [declaration[:important] ? 1 : 0, original_family_index]
+        end.map(&:first)
+
+        family_indexes.each_with_index do |declaration_index, reordered_index|
+          ordered[declaration_index] = reordered_entries[reordered_index]
+        end
+      end
+
+      ordered
+    end
+
     def append_component_head_styles(document, context)
       all_tags = collect_tag_names(document)
 
@@ -746,7 +693,7 @@ module MjmlRb
       if node.respond_to?(:children)
         node.children.map do |child|
           if child.text?
-            escape_html(child.content.to_s)
+            serialize_text_content(escape_html(child.content.to_s))
           elsif child.comment?
             "<!--#{child.content}-->"
           else
@@ -765,7 +712,7 @@ module MjmlRb
       if node.respond_to?(:children)
         node.children.map do |child|
           if child.text?
-            child.content.to_s
+            serialize_text_content(child.content.to_s)
           elsif child.comment?
             "<!--#{child.content}-->"
           else
@@ -777,15 +724,52 @@ module MjmlRb
       end
     end
 
+    def annotate_raw_html(content)
+      return content if content.nil? || content.empty? || !content.include?("<")
+      content.gsub(/<(?!\/|!)([A-Za-z][\w:-]*)(\s[^<>]*?)?(\s*\/?)>/) do
+        tag_name = Regexp.last_match(1)
+        attrs = Regexp.last_match(2).to_s
+        closing = Regexp.last_match(3).to_s
+        "<#{tag_name}#{attrs} data-mjml-raw=\"true\"#{closing}>"
+      end
+    end
+
+    def strip_internal_raw_markers(html)
+      html.gsub(/\sdata-mjml-raw=(['"])true\1/, "")
+    end
+
+    def preserve_raw_tag_spacing(html)
+      html.gsub(
+        /(<[^>]+data-mjml-raw=(['"])true\2[^>]*>)([ \t]+)(<[^\/!][^>]+data-mjml-raw=(['"])true\5[^>]*>)/
+      ) do
+        "#{Regexp.last_match(1)}#{encode_whitespace_entities(Regexp.last_match(3))}#{Regexp.last_match(4)}"
+      end
+    end
+
+    def encode_whitespace_entities(text)
+      text.to_s.gsub(" ", "&#32;").gsub("\t", "&#9;")
+    end
+
     def serialize_node(node)
       attrs = node.attributes.map { |k, v| %( #{k}="#{escape_attr(v)}") }.join
       return "<#{node.tag_name}#{attrs} />" if node.children.empty? && html_void_tag?(node.tag_name)
       return "<#{node.tag_name}#{attrs}></#{node.tag_name}>" if node.children.empty?
 
-      inner = node.children.map { |child| child.text? ? child.content.to_s : serialize_node(child) }.join
+      inner = node.children.map { |child| child.text? ? serialize_text_content(child.content.to_s) : serialize_node(child) }.join
       "<#{node.tag_name}#{attrs}>#{inner}</#{node.tag_name}>"
     end
 
+    def serialize_text_content(text)
+      value = text.to_s
+      return value unless significant_whitespace_text?(value)
+
+      value.gsub(" ", "&#32;").gsub("\t", "&#9;")
+    end
+
+    def significant_whitespace_text?(text)
+      !text.empty? && text.strip.empty? && !text.match?(/[\r\n]/)
+    end
+
     def html_void_tag?(tag_name)
       HTML_VOID_TAGS.include?(tag_name.to_s.downcase)
     end

data/lib/mjml-rb/validator.rb

@@ -77,8 +77,8 @@ module MjmlRb
     end
 
     def validate_allowed_children(node, errors)
-      # Ending-tag components treat content as raw HTML; REXML still parses
-      # children structurally, so skip child validation for those tags.
+      # Ending-tag components treat content as raw HTML; the XML parser still
+      # parses children structurally, so skip child validation for those tags.
       return if MjmlRb.component_registry.ending_tags.include?(node.tag_name)
 
       allowed = MjmlRb.component_registry.dependency_rules[node.tag_name]

data/lib/mjml-rb/version.rb

@@ -1,3 +1,3 @@
 module MjmlRb
-  VERSION = "0.4.3".freeze
+  VERSION = "0.5.0".freeze
 end

data/mjml-rb.gemspec

@@ -9,7 +9,7 @@ Gem::Specification.new do |spec|
   spec.summary = "Ruby implementation of the MJML toolchain"
   spec.description = "Ruby-first MJML compiler API and CLI with compatibility-focused behavior."
   spec.license = "MIT"
-  spec.required_ruby_version = ">= 3.0"
+  spec.required_ruby_version = ">= 3.3"
 
   spec.homepage = "https://github.com/faraquet/mjml-rb"
   spec.files = Dir.chdir(__dir__) do
@@ -18,6 +18,6 @@ Gem::Specification.new do |spec|
   spec.bindir = "bin"
   spec.executables = ["mjml"]
   spec.require_paths = ["lib"]
+  spec.add_dependency "css_parser", ">= 1.17"
   spec.add_dependency "nokogiri", ">= 1.13"
-  spec.add_dependency "rexml", ">= 3.2.5"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: mjml-rb
 version: !ruby/object:Gem::Version
-  version: 0.4.3
+  version: 0.5.0
 platform: ruby
 authors:
 - Andrei Andriichuk
@@ -10,33 +10,33 @@ cert_chain: []
 date: 1980-01-02 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
-  name: nokogiri
+  name: css_parser
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '1.13'
+        version: '1.17'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '1.13'
+        version: '1.17'
 - !ruby/object:Gem::Dependency
-  name: rexml
+  name: nokogiri
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 3.2.5
+        version: '1.13'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 3.2.5
+        version: '1.13'
 description: Ruby-first MJML compiler API and CLI with compatibility-focused behavior.
 email:
 - andreiandriichuk@gmail.com
@@ -99,7 +99,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="
     - !ruby/object:Gem::Version
-      version: '3.0'
+      version: '3.3'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="