@ape-egg/vibe 2.1.4 → 2.1.6

package/compiler/src/parser/html.rs

@@ -190,7 +190,7 @@ impl HtmlParser {
             // Find all tags that match loaded elements
             for (tag_name, element) in &self.cache {
                 // Match opening and closing tags with any attributes and children
-                let tag_pattern = format!(r"<{}(\s[^>]*)?>", regex::escape(tag_name));
+                let tag_pattern = format!(r"<{}(\s{})?>", regex::escape(tag_name), ATTR_RUN);
                 let tag_re = regex::Regex::new(&tag_pattern).unwrap();
                 let closing_pattern = format!(r"</{}>", regex::escape(tag_name));
 
@@ -336,7 +336,7 @@ impl HtmlParser {
 
         // Match only the opening tag — slot content is extracted via depth-counting close search
         // to correctly handle slot content that contains </div> or nested <component> elements.
-        let pattern = format!(r#"<(component|div)\s+([^>]*)\bsrc="{}"\s*([^>]*)>"#, regex::escape(&normalized_src));
+        let pattern = format!(r#"<(component|div)\s+({attr})\bsrc="{src}"\s*({attr})>"#, attr = ATTR_RUN, src = regex::escape(&normalized_src));
         let open_re = regex::Regex::new(&pattern).unwrap();
 
         let matches: Vec<_> = open_re.captures_iter(&result).filter_map(|cap| {
@@ -393,7 +393,7 @@ impl HtmlParser {
         // Match only the opening component tag — slot content is extracted via depth-counting
         // to correctly handle slot content containing </div> or nested <component> elements.
         let open_re = regex::Regex::new(
-            r#"<(component|div)\s+([^>]*)\bsrc="([^"]+)"([^>]*)>"#
+            &format!(r#"<(component|div)\s+({attr})\bsrc="([^"]+)"({attr})>"#, attr = ATTR_RUN)
         ).unwrap();
 
         // Process one match at a time with re-scanning after each replacement.
@@ -503,6 +503,13 @@ fn neuter_component_scripts(html: &str) -> String {
     html.replace("<script type=\"module\"", "<script type=\"vibe-module\"")
 }
 
+/// A run of HTML attributes where `>` is permitted only inside a quoted value.
+/// Mirrors a real HTML tokenizer: a tag ends on an *unquoted* `>` only. Without
+/// this, a binding prop like `flipped="@[a >= b]"` truncates the open tag at the
+/// `>` inside its value, so the trailing attributes get mis-parsed (empty
+/// boolean props → literal `true`) and corrupt the inlined template.
+const ATTR_RUN: &str = r#"(?:"[^"]*"|'[^']*'|[^>"'])*"#;
+
 fn is_ident_byte(b: u8) -> bool {
     b.is_ascii_alphanumeric() || b == b'_' || b == b'$'
 }
@@ -775,4 +782,75 @@ mod tests {
         assert!(content[close..].starts_with("</component>"), "matched wrong close: {:?}", &content[close..close + 14]);
         assert!(content[close..].contains("<sibling>"), "sibling was swallowed into the component");
     }
+
+    #[test]
+    fn inline_component_tolerates_gt_in_prop_binding() {
+        // A component prop whose `@[...]` value contains a comparison operator
+        // (`>=`) must not truncate the open tag at the `>` *inside the value*.
+        // The flawed `[^>]*` attribute run cut the tag mid-attribute, so the
+        // trailing identifiers (`selectedBrawlers`, `length`) were mis-parsed as
+        // empty boolean props (→ literal `true`), rewriting the loop expression
+        // to `brawlHandCards(characters, true)` — which throws `true.includes is
+        // not a function` at runtime, so the card discs never render.
+        let parser = HtmlParser::new(std::path::PathBuf::from("."));
+        let page = concat!(
+            r#"<page><component src="/components/remote/CardHand.html" "#,
+            r#"cards="@[brawlHandCards(characters, selectedBrawlers)]" "#,
+            r#"flipped="@[selectedBrawlers.length >= maxBrawlers]" "#,
+            r#"angle="16"></component></page>"#,
+        );
+        let template = concat!(
+            r#"<card-hand flipped="@[flipped]"><card-fan style="--angle: @[angle]deg">"#,
+            r#"<!-- each cards as card (card.id), i --><card-slot data-id="@[card.id]"></card-slot>"#,
+            r#"<!-- /each --></card-fan></card-hand>"#,
+        );
+        let mut cache = HashMap::new();
+        cache.insert("/components/remote/CardHand.html".to_string(), template.to_string());
+
+        let out = parser.inline_component_elements(page, &cache);
+
+        // The loop expression must carry `selectedBrawlers` through untouched.
+        assert!(
+            out.contains("brawlHandCards(characters, selectedBrawlers)"),
+            "loop expression corrupted: {out}"
+        );
+        assert!(
+            !out.contains("brawlHandCards(characters, true)"),
+            "selectedBrawlers wrongly replaced with `true`: {out}"
+        );
+        // The binding prop keeps its full comparison expression.
+        assert!(
+            out.contains(r#"flipped="@[selectedBrawlers.length >= maxBrawlers]""#),
+            "flipped binding lost: {out}"
+        );
+        // A literal prop *after* the `>=` prop must still substitute — proof the
+        // tag was parsed to the real `>`, not the one inside the value.
+        assert!(out.contains("--angle: 16deg"), "angle not substituted: {out}");
+    }
+
+    #[test]
+    fn inline_custom_element_tolerates_gt_in_prop_binding() {
+        // Same defect in the custom-element inliner's `<tag(\s[^>]*)?>` regex.
+        // (Cached element tags are filename-derived single words — see element.rs.)
+        let mut parser = HtmlParser::new(std::path::PathBuf::from("."));
+        parser.cache.insert(
+            "gauge".to_string(),
+            Element::new(
+                "gauge".to_string(),
+                std::path::PathBuf::from("gauge.html"),
+                r#"<gauge-inner show="@[show]" n="@[count]"></gauge-inner>"#.to_string(),
+            ),
+        );
+
+        let page = r#"<page><gauge show="@[items.length >= max]" count="7"></gauge></page>"#;
+        let out = parser.inline_custom_elements(page);
+
+        // The `>=` inside the binding must not have truncated the open tag.
+        assert!(
+            out.contains(r#"show="@[items.length >= max]""#),
+            "show binding lost: {out}"
+        );
+        // A literal prop after the `>=` prop still substitutes → tag parsed fully.
+        assert!(out.contains(r#"n="7""#), "count not substituted: {out}");
+    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ape-egg/vibe",
-  "version": "2.1.4",
+  "version": "2.1.6",
   "type": "module",
   "description": "Runtime-first reactivity with optional compiler",
   "main": "index.js",