align html transform

Author: Brooooooklyn

crates/oxc_angular_compiler/src/parser/html/lexer.rs

@@ -5,6 +5,7 @@
 //! Ported from Angular's `ml_parser/lexer.ts`.
 
 use super::entities::{decode_entity, get_named_entities};
+use super::tags::{TagContentType, get_html_tag_definition};
 use crate::util::chars;
 
 /// Supported block keywords for Angular control flow.
@@ -23,12 +24,6 @@ const SUPPORTED_BLOCKS: &[&str] = &[
     "error",
 ];
 
-/// Tags whose content is raw text (no entity decoding, no inner tag parsing).
-const RAW_TEXT_TAGS: &[&str] = &["script", "style"];
-
-/// Tags whose content is escapable raw text (entity decoding, no inner tag parsing).
-const ESCAPABLE_RAW_TEXT_TAGS: &[&str] = &["title", "textarea"];
-
 /// Token types for HTML templates.
 /// Matches Angular's `TokenType` enum from `ml_parser/tokens.ts`.
 #[derive(Debug, Clone, Copy, PartialEq, Eq)]
@@ -1676,14 +1671,21 @@ impl<'a> HtmlLexer<'a> {
             self.tokens.push(HtmlToken::empty(HtmlTokenType::TagOpenEnd, close_start, self.index));
 
             // Check if this tag has raw or escapable raw text content
-            // Note: For title tag, only non-svg namespace uses escapable raw text
+            // Use get_html_tag_definition().get_content_type(prefix) to handle
+            // namespace-aware content types (e.g., svg:title is parsable, html:title is escapable raw)
             let lower_name = name.to_lowercase();
-            if prefix.is_empty() {
-                if RAW_TEXT_TAGS.contains(&lower_name.as_str()) {
+            let ns_prefix = if prefix.is_empty() { None } else { Some(prefix.as_str()) };
+            let content_type = get_html_tag_definition(&lower_name).get_content_type(ns_prefix);
+            match content_type {
+                TagContentType::RawText => {
                     self.scan_raw_text_with_tag_close(&lower_name, false);
-                } else if ESCAPABLE_RAW_TEXT_TAGS.contains(&lower_name.as_str()) {
+                }
+                TagContentType::EscapableRawText => {
                     self.scan_raw_text_with_tag_close(&lower_name, true);
                 }
+                TagContentType::Parsable => {
+                    // Normal parsable content, no special handling needed
+                }
             }
         } else if self.peek() == '/' {
             // `/` without `>` following - Angular consumes the `/` and fails on `>`
@@ -1890,17 +1892,21 @@ impl<'a> HtmlLexer<'a> {
             // Check if the tag suffix indicates raw or escapable raw text
             // For component tags like <MyComp:script> or <MyComp:title>
             // But NOT when there's a namespace prefix like svg: or math:
-            // (svg:title and math:title don't use escapable raw text)
+            // Use get_html_tag_definition().get_content_type(prefix) to handle
+            // namespace-aware content types (e.g., svg:title is parsable, html:title is escapable raw)
             let lower_tag = tag_name.to_lowercase();
-            let lower_prefix = prefix.to_lowercase();
-            let has_special_prefix = lower_prefix == "svg" || lower_prefix == "math";
-
-            if !has_special_prefix {
-                if RAW_TEXT_TAGS.contains(&lower_tag.as_str()) {
+            let ns_prefix = if prefix.is_empty() { None } else { Some(prefix.as_str()) };
+            let content_type = get_html_tag_definition(&lower_tag).get_content_type(ns_prefix);
+            match content_type {
+                TagContentType::RawText => {
                     self.scan_component_raw_text(&component_name, &prefix, &tag_name, false);
-                } else if ESCAPABLE_RAW_TEXT_TAGS.contains(&lower_tag.as_str()) {
+                }
+                TagContentType::EscapableRawText => {
                     self.scan_component_raw_text(&component_name, &prefix, &tag_name, true);
                 }
+                TagContentType::Parsable => {
+                    // Normal parsable content, no special handling needed
+                }
             }
         } else if self.peek() == '<' || self.peek() == chars::EOF {
             // Incomplete component - find the most recent COMPONENT_OPEN_START token

crates/oxc_angular_compiler/src/parser/html/mod.rs

@@ -19,7 +19,7 @@ pub use entities::{NGSP_UNICODE, decode_entity, get_named_entities};
 pub use lexer::*;
 pub use parser::*;
 pub use tags::{
-    HtmlTagDefinition, TagContentType, get_html_tag_definition, get_ns_prefix, is_void_element,
-    merge_ns_and_name, split_ns_name,
+    ContentType, HtmlTagDefinition, TagContentType, get_html_tag_definition, get_ns_prefix,
+    is_void_element, merge_ns_and_name, namespace_uri, split_ns_name,
 };
 pub use whitespace::{PRESERVE_WS_ATTR_NAME, WhitespaceVisitor, remove_whitespaces};

crates/oxc_angular_compiler/src/parser/html/parser.rs

@@ -19,6 +19,7 @@ use crate::util::{ParseError, ParseLocation, ParseSourceFile, ParseSourceSpan};
 
 use super::entities::decode_entities_in_string;
 use super::lexer::{HtmlLexer, HtmlToken, HtmlTokenType};
+use super::tags::{get_html_tag_definition, is_void_element};
 
 /// Result of parsing an HTML template.
 pub struct HtmlParseResult<'a> {
@@ -517,15 +518,21 @@ impl<'a> HtmlParser<'a> {
         let start = start_token.start;
         // TagOpenStart has parts [prefix, name]
         // ComponentOpenStart has parts [component_name, prefix, tag_name]
-        let tag_name = if start_token.token_type == HtmlTokenType::ComponentOpenStart {
-            // For components, use the component name (first part)
-            start_token.value().to_string()
-        } else {
-            // For regular tags, include the namespace prefix if present
-            let prefix = start_token.prefix();
-            let name = start_token.name();
-            if prefix.is_empty() { name.to_string() } else { format!("{}:{}", prefix, name) }
-        };
+        let (tag_name, local_name, has_ns_prefix) =
+            if start_token.token_type == HtmlTokenType::ComponentOpenStart {
+                // For components, use the component name (first part)
+                let name = start_token.value().to_string();
+                (name.clone(), name, false)
+            } else {
+                // For regular tags, include the namespace prefix if present
+                // Angular uses :prefix:name format for namespaced elements
+                let prefix = start_token.prefix();
+                let name = start_token.name();
+                let has_prefix = !prefix.is_empty();
+                let full_name =
+                    if has_prefix { format!(":{}:{}", prefix, name) } else { name.to_string() };
+                (full_name, name.to_string(), has_prefix)
+            };
 
         // Check if we need to auto-close the current element (HTML5 optional end tags)
         self.auto_close_element_if_needed(&tag_name);
@@ -541,6 +548,23 @@ impl<'a> HtmlParser<'a> {
             {
                 let end_pos = token.end;
                 self.advance();
+
+                // Validate self-closing: only void, custom, and foreign elements can be self-closed
+                // Foreign elements include those with explicit namespace prefix (e.g., svg:rect)
+                // or those with implicit namespace prefix (e.g., <svg> has implicitNamespacePrefix='svg')
+                let tag_def = get_html_tag_definition(&local_name);
+                let is_foreign = has_ns_prefix || tag_def.implicit_namespace_prefix.is_some();
+                if !(tag_def.can_self_close || is_foreign || tag_def.is_void) {
+                    let err = self.make_error(
+                        start,
+                        format!(
+                            "Only void, custom and foreign elements can be self closed \"{}\"",
+                            local_name
+                        ),
+                    );
+                    self.errors.push(err);
+                }
+
                 (true, Some(end_pos))
             } else if token.token_type == HtmlTokenType::TagOpenEnd
                 || token.token_type == HtmlTokenType::ComponentOpenEnd
@@ -595,16 +619,31 @@ impl<'a> HtmlParser<'a> {
         let end = token.end;
         // TagClose has parts [prefix, name]
         // ComponentClose has parts [component_name, prefix, tag_name]
-        let tag_name = if token.token_type == HtmlTokenType::ComponentClose {
-            token.value().to_string()
+        let (tag_name, local_name) = if token.token_type == HtmlTokenType::ComponentClose {
+            let name = token.value().to_string();
+            (name.clone(), name)
         } else {
             // For regular tags, include the namespace prefix if present
+            // Angular uses :prefix:name format for namespaced elements
             let prefix = token.prefix();
             let name = token.name();
-            if prefix.is_empty() { name.to_string() } else { format!("{}:{}", prefix, name) }
+            let full_name =
+                if prefix.is_empty() { name.to_string() } else { format!(":{}:{}", prefix, name) };
+            (full_name, name.to_string())
         };
         let end_span = self.make_span(start, end);
 
+        // Check if this is a void element - void elements don't have end tags
+        let tag_def = get_html_tag_definition(&local_name);
+        if tag_def.is_void {
+            let err = self.make_error(
+                start,
+                format!("Void elements do not have end tags \"{}\"", local_name),
+            );
+            self.errors.push(err);
+            return;
+        }
+
         // Pop the matching element from the stack
         if let Some(node) = self.pop_element_container(&tag_name, Some(end_span)) {
             self.add_to_parent(node);
@@ -644,13 +683,14 @@ impl<'a> HtmlParser<'a> {
             let Some(name_token) = self.advance() else {
                 break; // Should not happen after peek, but handle gracefully
             };
-            // Include namespace prefix if present (e.g., xlink:href -> xlink:href)
+            // Include namespace prefix if present (e.g., xlink:href -> :xlink:href)
+            // Angular uses :prefix:name format for namespaced attributes
             let prefix = name_token.prefix();
             let base_name = name_token.name();
             let name = if prefix.is_empty() {
                 base_name.to_string()
             } else {
-                format!("{prefix}:{base_name}")
+                format!(":{prefix}:{base_name}")
             };
             let name_start = name_token.start;
             let name_end = name_token.end;
@@ -878,7 +918,10 @@ impl<'a> HtmlParser<'a> {
                 tokens.push((InterpolatedTokenType::Text, vec![value], first_span));
             }
             HtmlTokenType::Interpolation => {
-                let decoded_expr = first_token_parts.join("");
+                // For backward compatibility, decode HTML entities in interpolation
+                // (same as Angular's _consumeText in parser.ts)
+                let joined = first_token_parts.join("");
+                let decoded_expr = decode_entities_in_string(&joined);
                 text.push_str(&decoded_expr);
                 tokens.push((InterpolatedTokenType::Interpolation, first_token_parts, first_span));
             }
@@ -923,7 +966,10 @@ impl<'a> HtmlParser<'a> {
                             tokens.push((InterpolatedTokenType::Text, vec![value], tok_span));
                         }
                         HtmlTokenType::Interpolation => {
-                            let decoded_expr = tok_parts.join("");
+                            // For backward compatibility, decode HTML entities in interpolation
+                            // (same as Angular's _consumeText in parser.ts)
+                            let joined = tok_parts.join("");
+                            let decoded_expr = decode_entities_in_string(&joined);
                             text.push_str(&decoded_expr);
                             tokens.push((
                                 InterpolatedTokenType::Interpolation,
@@ -1565,104 +1611,11 @@ impl<'a> HtmlParser<'a> {
     }
 }
 
-/// Checks if an element is a void element (no closing tag).
-fn is_void_element(name: &str) -> bool {
-    matches!(
-        name.to_lowercase().as_str(),
-        "area"
-            | "base"
-            | "br"
-            | "col"
-            | "embed"
-            | "hr"
-            | "img"
-            | "input"
-            | "link"
-            | "meta"
-            | "param"
-            | "source"
-            | "track"
-            | "wbr"
-    )
-}
-
 /// Checks if the current element should be auto-closed when a new element is opened.
-/// Based on HTML5 optional end tag rules.
+/// Uses the tag definitions from tags.rs to match Angular's behavior exactly.
 fn should_auto_close(current_tag: &str, new_tag: &str) -> bool {
-    let new_tag_lower = new_tag.to_lowercase();
-
-    match current_tag {
-        // <p> is auto-closed by block-level elements or another <p>
-        "p" => matches!(
-            new_tag_lower.as_str(),
-            "p" | "div"
-                | "ul"
-                | "ol"
-                | "li"
-                | "dl"
-                | "dt"
-                | "dd"
-                | "table"
-                | "tr"
-                | "td"
-                | "th"
-                | "address"
-                | "article"
-                | "aside"
-                | "blockquote"
-                | "details"
-                | "fieldset"
-                | "figcaption"
-                | "figure"
-                | "footer"
-                | "form"
-                | "h1"
-                | "h2"
-                | "h3"
-                | "h4"
-                | "h5"
-                | "h6"
-                | "header"
-                | "hgroup"
-                | "hr"
-                | "main"
-                | "menu"
-                | "nav"
-                | "pre"
-                | "section"
-                | "video"
-                | "audio"
-                | "canvas"
-        ),
-        // <li> is auto-closed by another <li>
-        "li" => new_tag_lower == "li",
-        // <dt> is auto-closed by <dt> or <dd>
-        "dt" => matches!(new_tag_lower.as_str(), "dt" | "dd"),
-        // <dd> is auto-closed by <dt> or <dd>
-        "dd" => matches!(new_tag_lower.as_str(), "dt" | "dd"),
-        // <tr> is auto-closed by another <tr>
-        "tr" => new_tag_lower == "tr",
-        // <td> and <th> are auto-closed by <td>, <th>, or <tr>
-        "td" | "th" => matches!(new_tag_lower.as_str(), "td" | "th" | "tr"),
-        // <option> is auto-closed by another <option> or <optgroup>
-        "option" => matches!(new_tag_lower.as_str(), "option" | "optgroup"),
-        // <optgroup> is auto-closed by another <optgroup>
-        "optgroup" => new_tag_lower == "optgroup",
-        // <colgroup> is auto-closed by elements other than <col>
-        "colgroup" => new_tag_lower != "col" && is_table_content(&new_tag_lower),
-        // <thead>, <tbody>, <tfoot> are auto-closed by each other
-        "thead" | "tbody" | "tfoot" => {
-            matches!(new_tag_lower.as_str(), "thead" | "tbody" | "tfoot")
-        }
-        // <rp> and <rt> are auto-closed by each other
-        "rp" | "rt" => matches!(new_tag_lower.as_str(), "rp" | "rt"),
-        _ => false,
-    }
-}
-
-/// Checks if a tag is table content (for colgroup auto-close logic).
-fn is_table_content(tag: &str) -> bool {
-    matches!(tag, "thead" | "tbody" | "tfoot" | "tr" | "td" | "th" | "caption" | "colgroup")
+    let tag_def = get_html_tag_definition(current_tag);
+    tag_def.is_closed_by_child(new_tag)
 }
 
 #[cfg(test)]
@@ -1806,8 +1759,8 @@ mod tests {
         // Should report unclosed block error
         assert!(!result.errors.is_empty(), "Expected unclosed block error");
         assert!(
-            result.errors[0].msg.contains("Unclosed block"),
-            "Error message should mention unclosed block"
+            result.errors.iter().any(|e| e.msg.contains("Unclosed block")),
+            "At least one error message should mention unclosed block"
         );
     }