@salve-software/react-native-nitro-jsdom 1.0.1 → 2.0.0

package/cpp/quickjs/bindings/ElementBindings.cpp

@@ -2,6 +2,8 @@
 #include "ClassListBindings.hpp"
 #include "DatasetBindings.hpp"
 #include "StyleBindings.hpp"
+#include "LiveCollectionBindings.hpp"
+#include "DOMExceptionBindings.hpp"
 #include "../DOMBindingsInternal.hpp"
 #include "../QuickJSRuntime.hpp"
 #include "../MutationObservers.hpp"
@@ -9,6 +11,9 @@
 #include <lexbor/html/html.h>
 #include <lexbor/dom/dom.h>
 #include <lexbor/dom/interfaces/character_data.h>
+#include <lexbor/dom/interfaces/attr.h>
+#include <lexbor/ns/const.h>
+#include <lexbor/ns/ns.h>
 #include <cctype>
 #include <cstring>
 #include <optional>
@@ -27,10 +32,18 @@ JSValue js_el_get_tagName(JSContext* ctx, JSValue this_val) {
   auto* el = unwrap_element(ctx, this_val);
   if (!el) return JS_NewString(ctx, "");
   size_t len = 0;
-  const lxb_char_t* name = lxb_dom_element_local_name(el, &len);
+  // qualified_name (prefix:localName) when the element has a namespace
+  // prefix (createElementNS('...', 'prefix:name')), falling back to the
+  // plain local name otherwise.
+  const lxb_char_t* name = lxb_dom_element_qualified_name(el, &len);
   if (!name || len == 0) return JS_NewString(ctx, "");
   std::string r(reinterpret_cast<const char*>(name), len);
-  for (auto& c : r) c = (char)std::toupper((unsigned char)c);
+  // Only HTML-namespace elements are uppercased (per spec); SVG/MathML/custom
+  // namespace elements keep their (lexbor-lowercased) local name as-is.
+  auto* node = reinterpret_cast<lxb_dom_node_t*>(el);
+  if (node->ns == LXB_NS_HTML) {
+    for (auto& c : r) c = (char)std::toupper((unsigned char)c);
+  }
   return JS_NewStringLen(ctx, r.c_str(), r.size());
 }
 
@@ -100,6 +113,196 @@ JSValue js_el_set_className(JSContext* ctx, JSValue this_val, JSValue val) {
   return JS_UNDEFINED;
 }
 
+// ── Form element properties (value / checked) ────────────────────────────────
+// Simplified attribute-reflection model, matching this file's existing id/
+// className getters: no separate "dirty value" IDL flag like real browsers,
+// just direct reflection so scripts that set then read these back (the
+// common embedded-widget pattern) see consistent results.
+
+JSValue js_el_get_textContent(JSContext* ctx, JSValue this_val);
+
+bool element_tag_is(lxb_dom_element_t* el, const char* tag) {
+  size_t len = 0;
+  const lxb_char_t* name = lxb_dom_element_local_name(el, &len);
+  if (!name || len != strlen(tag)) return false;
+  for (size_t i = 0; i < len; i++) {
+    if (std::tolower(name[i]) != std::tolower((unsigned char)tag[i])) return false;
+  }
+  return true;
+}
+
+// HTMLOptionElement's value: the "value" attribute if present, else the
+// option's text content.
+std::string option_effective_value(lxb_dom_element_t* option) {
+  size_t len = 0;
+  const lxb_char_t* val = lxb_dom_element_get_attribute(option,
+      reinterpret_cast<const lxb_char_t*>("value"), 5, &len);
+  if (val) return std::string(reinterpret_cast<const char*>(val), len);
+  lxb_dom_node_t* node = lxb_dom_interface_node(option);
+  lxb_char_t* text = lxb_dom_node_text_content(node, &len);
+  if (!text) return "";
+  std::string result(reinterpret_cast<char*>(text), len);
+  lxb_dom_document_destroy_text(node->owner_document, text);
+  return result;
+}
+
+JSValue js_select_get_value(JSContext* ctx, lxb_dom_element_t* select_el) {
+  auto options = get_doc(ctx)->querySelectorAllFromEl(select_el, "option");
+  void* chosen = nullptr;
+  for (void* opt : options) {
+    if (lxb_dom_element_has_attribute(static_cast<lxb_dom_element_t*>(opt),
+        reinterpret_cast<const lxb_char_t*>("selected"), 8)) { chosen = opt; break; }
+  }
+  if (!chosen && !options.empty()) chosen = options.front();
+  if (!chosen) return JS_NewString(ctx, "");
+  return JS_NewString(ctx, option_effective_value(static_cast<lxb_dom_element_t*>(chosen)).c_str());
+}
+
+void js_select_set_value(JSContext* ctx, lxb_dom_element_t* select_el, const std::string& value) {
+  auto options = get_doc(ctx)->querySelectorAllFromEl(select_el, "option");
+  auto* rctx = get_ctx(ctx);
+  bool has_obs = rctx && rctx->mutation_observers && !rctx->mutation_observers->empty();
+  auto* attr_name = reinterpret_cast<const lxb_char_t*>("selected");
+
+  for (void* opt : options) {
+    auto* opt_el = static_cast<lxb_dom_element_t*>(opt);
+    bool should_select = option_effective_value(opt_el) == value;
+    bool has_selected = lxb_dom_element_has_attribute(opt_el, attr_name, 8);
+
+    std::optional<std::string> old_val;
+    if (has_obs && has_selected && rctx->mutation_observers->hasAttributeOldValueObserver()) {
+      size_t len = 0;
+      const lxb_char_t* v = lxb_dom_element_get_attribute(opt_el, attr_name, 8, &len);
+      if (v) old_val = std::string(reinterpret_cast<const char*>(v), len);
+    }
+
+    bool changed = false;
+    if (should_select && !has_selected) {
+      lxb_dom_element_set_attribute(opt_el, attr_name, 8, reinterpret_cast<const lxb_char_t*>(""), 0);
+      changed = true;
+    } else if (!should_select && has_selected) {
+      lxb_dom_element_remove_attribute(opt_el, attr_name, 8);
+      changed = true;
+    }
+
+    if (changed && has_obs) {
+      rctx->mutation_observers->notifyAttribute(ctx, lxb_dom_interface_node(opt_el), "selected", old_val);
+    }
+  }
+}
+
+JSValue js_el_get_value(JSContext* ctx, JSValue this_val) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_NewString(ctx, "");
+  if (element_tag_is(el, "select")) return js_select_get_value(ctx, el);
+  if (element_tag_is(el, "textarea")) return js_el_get_textContent(ctx, this_val);
+  size_t len = 0;
+  const lxb_char_t* val = lxb_dom_element_get_attribute(el,
+      reinterpret_cast<const lxb_char_t*>("value"), 5, &len);
+  if (val) return JS_NewStringLen(ctx, reinterpret_cast<const char*>(val), len);
+
+  // A checkbox/radio with no "value" attribute defaults its value to "on".
+  if (element_tag_is(el, "input")) {
+    size_t type_len = 0;
+    const lxb_char_t* type_val = lxb_dom_element_get_attribute(el,
+        reinterpret_cast<const lxb_char_t*>("type"), 4, &type_len);
+    std::string type_str = type_val ? std::string(reinterpret_cast<const char*>(type_val), type_len) : "";
+    for (auto& c : type_str) c = (char)std::tolower((unsigned char)c);
+    if (type_str == "checkbox" || type_str == "radio") return JS_NewString(ctx, "on");
+  }
+  return JS_NewString(ctx, "");
+}
+
+JSValue js_el_set_value(JSContext* ctx, JSValue this_val, JSValue val) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_UNDEFINED;
+  const char* str = JS_ToCString(ctx, val);
+  if (!str) return JS_UNDEFINED;
+
+  if (element_tag_is(el, "select")) {
+    js_select_set_value(ctx, el, str);
+  } else if (element_tag_is(el, "textarea")) {
+    auto* rctx = get_ctx(ctx);
+    bool has_obs = rctx && rctx->mutation_observers && !rctx->mutation_observers->empty();
+    lxb_dom_node_t* node = lxb_dom_interface_node(el);
+
+    std::vector<void*> old_children;
+    lxb_dom_node_t* child = node->first_child;
+    while (child) { old_children.push_back(child); child = child->next; }
+    if (!old_children.empty()) {
+      invalidate_node_cache_deep_batch(ctx, rctx, old_children);
+      if (has_obs) rctx->mutation_observers->disconnectDetachedTargets(old_children);
+    }
+
+    doc_for_node(ctx, el)->setTextContentOnEl(el, str);
+
+    if (has_obs) {
+      std::vector<void*> new_children;
+      child = node->first_child;
+      while (child) { new_children.push_back(child); child = child->next; }
+      rctx->mutation_observers->notifyChildList(ctx, node, new_children, {}, nullptr, nullptr);
+    }
+  } else {
+    auto* rctx = get_ctx(ctx);
+    bool has_obs = rctx && rctx->mutation_observers && !rctx->mutation_observers->empty();
+    std::optional<std::string> old_val;
+    if (has_obs && rctx->mutation_observers->hasAttributeOldValueObserver()) {
+      size_t len = 0;
+      const lxb_char_t* v = lxb_dom_element_get_attribute(el,
+          reinterpret_cast<const lxb_char_t*>("value"), 5, &len);
+      if (v) old_val = std::string(reinterpret_cast<const char*>(v), len);
+    }
+    lxb_dom_element_set_attribute(el,
+        reinterpret_cast<const lxb_char_t*>("value"), 5,
+        reinterpret_cast<const lxb_char_t*>(str), strlen(str));
+    if (has_obs) {
+      rctx->mutation_observers->notifyAttribute(ctx, lxb_dom_interface_node(el), "value", old_val);
+    }
+  }
+
+  JS_FreeCString(ctx, str);
+  return JS_UNDEFINED;
+}
+
+JSValue js_el_get_checked(JSContext* ctx, JSValue this_val) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_FALSE;
+  bool has = lxb_dom_element_has_attribute(el,
+      reinterpret_cast<const lxb_char_t*>("checked"), 7);
+  return JS_NewBool(ctx, has);
+}
+
+JSValue js_el_set_checked(JSContext* ctx, JSValue this_val, JSValue val) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_UNDEFINED;
+  bool checked = JS_ToBool(ctx, val) > 0;
+  auto* attr_name = reinterpret_cast<const lxb_char_t*>("checked");
+  bool has = lxb_dom_element_has_attribute(el, attr_name, 7);
+
+  auto* rctx = get_ctx(ctx);
+  bool has_obs = rctx && rctx->mutation_observers && !rctx->mutation_observers->empty();
+  std::optional<std::string> old_val;
+  if (has_obs && has && rctx->mutation_observers->hasAttributeOldValueObserver()) {
+    size_t len = 0;
+    const lxb_char_t* v = lxb_dom_element_get_attribute(el, attr_name, 7, &len);
+    if (v) old_val = std::string(reinterpret_cast<const char*>(v), len);
+  }
+
+  if (checked && !has) {
+    lxb_dom_element_set_attribute(el, attr_name, 7, reinterpret_cast<const lxb_char_t*>(""), 0);
+    if (has_obs) {
+      rctx->mutation_observers->notifyAttribute(ctx, lxb_dom_interface_node(el), "checked", std::nullopt);
+    }
+  } else if (!checked && has) {
+    lxb_dom_element_remove_attribute(el, attr_name, 7);
+    if (has_obs) {
+      rctx->mutation_observers->notifyAttribute(ctx, lxb_dom_interface_node(el), "checked", old_val);
+    }
+  }
+
+  return JS_UNDEFINED;
+}
+
 JSValue js_el_get_textContent(JSContext* ctx, JSValue this_val) {
   lxb_dom_node_t* node = unwrap_node(ctx, this_val);
   if (!node) return JS_NewString(ctx, "");
@@ -144,11 +347,11 @@ JSValue js_el_set_textContent(JSContext* ctx, JSValue this_val, JSValue val) {
       lxb_dom_node_t* child = node->first_child;
       while (child) { old_children.push_back(child); child = child->next; }
       if (!old_children.empty()) {
-        invalidate_node_cache_batch(ctx, rctx, old_children);
+        invalidate_node_cache_deep_batch(ctx, rctx, old_children);
         if (has_observers) rctx->mutation_observers->disconnectDetachedTargets(old_children);
       }
     }
-    get_doc(ctx)->setTextContentOnEl(el, str);
+    doc_for_node(ctx, node)->setTextContentOnEl(el, str);
     if (has_observers) {
       std::vector<void*> new_children;
       lxb_dom_node_t* child = node->first_child;
@@ -189,11 +392,11 @@ JSValue js_el_set_innerHTML(JSContext* ctx, JSValue this_val, JSValue val) {
   }
 
   if (!old_children.empty()) {
-    invalidate_node_cache_batch(ctx, rctx, old_children);
+    invalidate_node_cache_deep_batch(ctx, rctx, old_children);
     if (has_observers) rctx->mutation_observers->disconnectDetachedTargets(old_children);
   }
 
-  get_doc(ctx)->setInnerHTMLOnEl(el, html);
+  doc_for_node(ctx, el)->setInnerHTMLOnEl(el, html);
   JS_FreeCString(ctx, html);
 
   if (has_observers) {
@@ -223,16 +426,8 @@ JSValue js_el_get_parentElement(JSContext* ctx, JSValue this_val) {
 
 JSValue js_el_get_children(JSContext* ctx, JSValue this_val) {
   auto* el = unwrap_element(ctx, this_val);
-  JSValue arr = JS_NewArray(ctx);
-  if (!el) return arr;
-  uint32_t idx = 0;
-  lxb_dom_node_t* child = lxb_dom_interface_node(el)->first_child;
-  while (child) {
-    if (child->type == LXB_DOM_NODE_TYPE_ELEMENT)
-      JS_SetPropertyUint32(ctx, arr, idx++, make_element(ctx, lxb_dom_interface_element(child)));
-    child = child->next;
-  }
-  return arr;
+  if (!el) return JS_NewArray(ctx);
+  return LiveCollectionBindings::makeChildren(ctx, el);
 }
 
 JSValue js_el_get_firstElementChild(JSContext* ctx, JSValue this_val) {
@@ -346,14 +541,20 @@ JSValue js_el_set_nodeValue(JSContext* ctx, JSValue this_val, JSValue val) {
   return JS_UNDEFINED;
 }
 
+JSValue js_el_get_data_length(JSContext* ctx, JSValue this_val) {
+  auto* node = unwrap_node(ctx, this_val);
+  if (!node) return JS_UNDEFINED;
+  if (node->type != LXB_DOM_NODE_TYPE_TEXT && node->type != LXB_DOM_NODE_TYPE_COMMENT) return JS_UNDEFINED;
+  JSValue str_val = js_el_get_nodeValue(ctx, this_val);
+  JSValue len_val = JS_GetPropertyStr(ctx, str_val, "length");
+  JS_FreeValue(ctx, str_val);
+  return len_val;
+}
+
 JSValue js_el_get_childNodes(JSContext* ctx, JSValue this_val) {
   auto* node = unwrap_node(ctx, this_val);
-  JSValue arr = JS_NewArray(ctx);
-  if (!node) return arr;
-  uint32_t idx = 0;
-  lxb_dom_node_t* child = node->first_child;
-  while (child) { JS_SetPropertyUint32(ctx, arr, idx++, make_element(ctx, child)); child = child->next; }
-  return arr;
+  if (!node) return JS_NewArray(ctx);
+  return LiveCollectionBindings::makeChildNodes(ctx, node);
 }
 
 JSValue js_el_get_firstChild(JSContext* ctx, JSValue this_val) {
@@ -471,6 +672,93 @@ JSValue js_el_hasAttribute(JSContext* ctx, JSValue this_val, int argc, JSValue*
   return JS_NewBool(ctx, has);
 }
 
+// ── Namespaced attribute methods (getAttributeNS/setAttributeNS/...) ─────────
+// Simplification: this sandbox doesn't track a real (namespace, localName)
+// identity per attribute the way createElementNS()/namespaceURI() do for
+// elements — building that would mean hand-constructing lxb_dom_attr_t nodes
+// with their own ns/prefix fields, a much larger and riskier lift than the
+// element side. Instead, attributes are matched by local name only (the
+// qualified name with any "prefix:" stripped), which is spec-accurate for
+// the common real-world case (a single xlink:href-style attribute) but not
+// for two attributes sharing a local name across different namespaces — a
+// case that essentially never comes up in embedded-widget scripts.
+lxb_dom_attr_t* find_attr_by_local_name(lxb_dom_element_t* el, const std::string& localName) {
+  for (lxb_dom_attr_t* attr = lxb_dom_element_first_attribute(el); attr; attr = lxb_dom_element_next_attribute(attr)) {
+    size_t len = 0;
+    const lxb_char_t* qname = lxb_dom_attr_qualified_name(attr, &len);
+    if (!qname) continue;
+    std::string q(reinterpret_cast<const char*>(qname), len);
+    auto colon = q.find(':');
+    std::string local = (colon == std::string::npos) ? q : q.substr(colon + 1);
+    if (local == localName) return attr;
+  }
+  return nullptr;
+}
+
+JSValue js_el_getAttributeNS(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el || argc < 2) return JS_NULL;
+  const char* local = JS_ToCString(ctx, argv[1]);
+  if (!local) return JS_NULL;
+  auto* attr = find_attr_by_local_name(el, local);
+  JS_FreeCString(ctx, local);
+  if (!attr) return JS_NULL;
+  size_t len = 0;
+  const lxb_char_t* val = lxb_dom_attr_value(attr, &len);
+  return val ? JS_NewStringLen(ctx, reinterpret_cast<const char*>(val), len) : JS_NewString(ctx, "");
+}
+
+JSValue js_el_hasAttributeNS(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el || argc < 2) return JS_FALSE;
+  const char* local = JS_ToCString(ctx, argv[1]);
+  if (!local) return JS_FALSE;
+  bool has = find_attr_by_local_name(el, local) != nullptr;
+  JS_FreeCString(ctx, local);
+  return JS_NewBool(ctx, has);
+}
+
+JSValue js_el_setAttributeNS(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el || argc < 3) return JS_UNDEFINED;
+  const char* qualified_name = JS_ToCString(ctx, argv[1]);
+  const char* value = JS_ToCString(ctx, argv[2]);
+  if (qualified_name && value) {
+    std::string qn(qualified_name);
+    auto colon = qn.find(':');
+    std::string local = (colon == std::string::npos) ? qn : qn.substr(colon + 1);
+
+    auto* existing = find_attr_by_local_name(el, local);
+    if (existing) {
+      lxb_dom_attr_set_existing_value(existing,
+          reinterpret_cast<const lxb_char_t*>(value), strlen(value));
+    } else {
+      lxb_dom_element_set_attribute(el,
+          reinterpret_cast<const lxb_char_t*>(qualified_name), qn.size(),
+          reinterpret_cast<const lxb_char_t*>(value), strlen(value));
+    }
+  }
+  if (qualified_name) JS_FreeCString(ctx, qualified_name);
+  if (value) JS_FreeCString(ctx, value);
+  return JS_UNDEFINED;
+}
+
+JSValue js_el_removeAttributeNS(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el || argc < 2) return JS_UNDEFINED;
+  const char* local = JS_ToCString(ctx, argv[1]);
+  if (local) {
+    auto* attr = find_attr_by_local_name(el, local);
+    if (attr) {
+      size_t qlen = 0;
+      const lxb_char_t* qname = lxb_dom_attr_qualified_name(attr, &qlen);
+      if (qname) lxb_dom_element_remove_attribute(el, qname, qlen);
+    }
+    JS_FreeCString(ctx, local);
+  }
+  return JS_UNDEFINED;
+}
+
 // Inserts `node` via `insert_one`, expanding DocumentFragments into their
 // children first (per the DOM's "insert a node" algorithm — a fragment is
 // never itself part of the resulting tree, only its children are moved in).
@@ -551,8 +839,7 @@ JSValue js_el_insertBefore(JSContext* ctx, JSValue this_val, int argc, JSValue*
     if (ref) {
       lxb_dom_node_t* receiver_node = unwrap_node(ctx, this_val);
       if (!receiver_node || ref->parent != receiver_node) {
-        JS_ThrowTypeError(ctx, "NotFoundError: reference node is not a child of this node");
-        return JS_EXCEPTION;
+        return throw_dom_exception(ctx, "NotFoundError", "reference node is not a child of this node");
       }
       parent_node = receiver_node;
       inserted = expand_and_insert(new_node, [&](lxb_dom_node_t* n) {
@@ -619,8 +906,7 @@ JSValue js_el_replaceChild(JSContext* ctx, JSValue this_val, int argc, JSValue*
   auto* old_node = unwrap_node(ctx, argv[1]);
   if (!new_node || !old_node) return JS_NULL;
   if (old_node->parent != parent_node) {
-    JS_ThrowTypeError(ctx, "NotFoundError: the node to be replaced is not a child of this node");
-    return JS_EXCEPTION;
+    return throw_dom_exception(ctx, "NotFoundError", "the node to be replaced is not a child of this node");
   }
 
   lxb_dom_node_t* prev_sib = old_node->prev;
@@ -643,12 +929,15 @@ JSValue js_el_replaceChild(JSContext* ctx, JSValue this_val, int argc, JSValue*
   return JS_DupValue(ctx, argv[1]); // returns the replaced (old) child, per spec
 }
 
-lxb_dom_node_t* js_to_node_or_text(JSContext* ctx, JSValue val) {
+// `context_node` supplies the owning document for a string argument coerced
+// into a new text node (see doc_for_node()) — irrelevant when `val` is
+// already a node.
+lxb_dom_node_t* js_to_node_or_text(JSContext* ctx, JSValue val, lxb_dom_node_t* context_node) {
   auto* node = unwrap_node(ctx, val);
   if (node) return node;
   const char* str = JS_ToCString(ctx, val);
   if (!str) return nullptr;
-  void* text = get_doc(ctx)->createTextNode(str);
+  void* text = doc_for_node(ctx, context_node)->createTextNode(str);
   JS_FreeCString(ctx, str);
   return static_cast<lxb_dom_node_t*>(text);
 }
@@ -660,7 +949,7 @@ JSValue js_el_before(JSContext* ctx, JSValue this_val, int argc, JSValue* argv)
 
   std::vector<void*> inserted;
   for (int i = 0; i < argc; i++) {
-    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i]);
+    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i], node);
     if (!n) continue;
     auto batch = expand_and_insert(n, [&](lxb_dom_node_t* one) { lxb_dom_node_insert_before(node, one); });
     inserted.insert(inserted.end(), batch.begin(), batch.end());
@@ -682,7 +971,7 @@ JSValue js_el_after(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
 
   std::vector<void*> inserted;
   for (int i = 0; i < argc; i++) {
-    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i]);
+    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i], node);
     if (!n) continue;
     auto batch = expand_and_insert(n, [&](lxb_dom_node_t* one) {
       if (ref) lxb_dom_node_insert_before(ref, one); else lxb_dom_node_insert_child(parent, one);
@@ -706,7 +995,7 @@ JSValue js_el_replaceWith(JSContext* ctx, JSValue this_val, int argc, JSValue* a
 
   std::vector<void*> inserted;
   for (int i = 0; i < argc; i++) {
-    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i]);
+    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i], node);
     if (!n) continue;
     auto batch = expand_and_insert(n, [&](lxb_dom_node_t* one) { lxb_dom_node_insert_before(node, one); });
     inserted.insert(inserted.end(), batch.begin(), batch.end());
@@ -728,7 +1017,7 @@ JSValue js_el_append(JSContext* ctx, JSValue this_val, int argc, JSValue* argv)
 
   std::vector<void*> inserted;
   for (int i = 0; i < argc; i++) {
-    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i]);
+    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i], parent_node);
     if (!n) continue;
     auto batch = expand_and_insert(n, [&](lxb_dom_node_t* one) { lxb_dom_node_insert_child(parent_node, one); });
     inserted.insert(inserted.end(), batch.begin(), batch.end());
@@ -749,7 +1038,7 @@ JSValue js_el_prepend(JSContext* ctx, JSValue this_val, int argc, JSValue* argv)
 
   std::vector<void*> inserted;
   for (int i = 0; i < argc; i++) {
-    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i]);
+    lxb_dom_node_t* n = js_to_node_or_text(ctx, argv[i], parent_node);
     if (!n) continue;
     auto batch = expand_and_insert(n, [&](lxb_dom_node_t* one) {
       if (ref) lxb_dom_node_insert_before(ref, one); else lxb_dom_node_insert_child(parent_node, one);
@@ -770,11 +1059,12 @@ JSValue js_el_closest(JSContext* ctx, JSValue this_val, int argc, JSValue* argv)
   const char* sel = JS_ToCString(ctx, argv[0]);
   if (!sel) return JS_NULL;
 
+  auto* doc = doc_for_node(ctx, lxb_dom_interface_node(el));
   JSValue result = JS_NULL;
   for (lxb_dom_node_t* node = lxb_dom_interface_node(el);
        node && node->type == LXB_DOM_NODE_TYPE_ELEMENT;
        node = node->parent) {
-    if (get_doc(ctx)->matchesSelector(lxb_dom_interface_element(node), sel)) {
+    if (doc->matchesSelector(lxb_dom_interface_element(node), sel)) {
       result = make_element(ctx, node);
       break;
     }
@@ -797,7 +1087,7 @@ JSValue js_el_insertAdjacentHTML(JSContext* ctx, JSValue this_val, int argc, JSV
   JS_FreeCString(ctx, position);
 
   lxb_dom_node_t* node = lxb_dom_interface_node(el);
-  auto parsed = get_doc(ctx)->parseFragmentNodes(el, html);
+  auto parsed = doc_for_node(ctx, node)->parseFragmentNodes(el, html);
   JS_FreeCString(ctx, html);
   if (parsed.empty()) return JS_UNDEFINED;
 
@@ -835,8 +1125,7 @@ JSValue js_el_insertAdjacentHTML(JSContext* ctx, JSValue this_val, int argc, JSV
     next_sib = ref;
   } else {
     for (void* n : parsed) lxb_dom_node_destroy_deep(static_cast<lxb_dom_node_t*>(n));
-    JS_ThrowTypeError(ctx, "SyntaxError: invalid insertAdjacentHTML position '%s'", pos.c_str());
-    return JS_EXCEPTION;
+    return throw_dom_exception(ctx, "SyntaxError", ("invalid insertAdjacentHTML position '" + pos + "'").c_str());
   }
 
   auto* rctx = get_ctx(ctx);
@@ -851,7 +1140,7 @@ JSValue js_el_matches(JSContext* ctx, JSValue this_val, int argc, JSValue* argv)
   if (!el || argc < 1) return JS_FALSE;
   const char* sel = JS_ToCString(ctx, argv[0]);
   if (!sel) return JS_FALSE;
-  bool result = get_doc(ctx)->matchesSelector(el, sel);
+  bool result = doc_for_node(ctx, el)->matchesSelector(el, sel);
   JS_FreeCString(ctx, sel);
   return JS_NewBool(ctx, result);
 }
@@ -861,7 +1150,7 @@ JSValue js_el_querySelector(JSContext* ctx, JSValue this_val, int argc, JSValue*
   if (!el || argc < 1) return JS_NULL;
   const char* sel = JS_ToCString(ctx, argv[0]);
   if (!sel) return JS_NULL;
-  void* found = get_doc(ctx)->querySelectorFromEl(el, sel);
+  void* found = doc_for_node(ctx, el)->querySelectorFromEl(el, sel);
   JS_FreeCString(ctx, sel);
   return make_element(ctx, found);
 }
@@ -871,7 +1160,7 @@ JSValue js_el_querySelectorAll(JSContext* ctx, JSValue this_val, int argc, JSVal
   if (!el || argc < 1) return JS_NewArray(ctx);
   const char* sel = JS_ToCString(ctx, argv[0]);
   if (!sel) return JS_NewArray(ctx);
-  auto results = get_doc(ctx)->querySelectorAllFromEl(el, sel);
+  auto results = doc_for_node(ctx, el)->querySelectorAllFromEl(el, sel);
   JS_FreeCString(ctx, sel);
   return make_element_array(ctx, results);
 }
@@ -881,9 +1170,9 @@ JSValue js_el_getElementsByClassName(JSContext* ctx, JSValue this_val, int argc,
   if (!el || argc < 1) return JS_NewArray(ctx);
   const char* names = JS_ToCString(ctx, argv[0]);
   if (!names) return JS_NewArray(ctx);
-  auto results = get_doc(ctx)->querySelectorAllFromEl(el, classNames_to_selector(names));
+  JSValue result = LiveCollectionBindings::makeBySelector(ctx, el, classNames_to_selector(names));
   JS_FreeCString(ctx, names);
-  return make_element_array(ctx, results);
+  return result;
 }
 
 JSValue js_el_getElementsByTagName(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
@@ -891,9 +1180,9 @@ JSValue js_el_getElementsByTagName(JSContext* ctx, JSValue this_val, int argc, J
   if (!el || argc < 1) return JS_NewArray(ctx);
   const char* tag = JS_ToCString(ctx, argv[0]);
   if (!tag) return JS_NewArray(ctx);
-  auto results = get_doc(ctx)->querySelectorAllFromEl(el, tag);
+  JSValue result = LiveCollectionBindings::makeBySelector(ctx, el, tag);
   JS_FreeCString(ctx, tag);
-  return make_element_array(ctx, results);
+  return result;
 }
 
 JSValue js_el_getAttributeNames(JSContext* ctx, JSValue this_val, int, JSValue*) {
@@ -966,6 +1255,25 @@ JSValue js_el_toggleAttribute(JSContext* ctx, JSValue this_val, int argc, JSValu
   return JS_NewBool(ctx, force_present);
 }
 
+JSValue js_el_getBoundingClientRect(JSContext* ctx, JSValue this_val, int, JSValue*) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_NULL;
+  JSValue rect = JS_NewObject(ctx);
+  static const char* kFields[] = { "x", "y", "width", "height", "top", "right", "bottom", "left" };
+  for (const char* field : kFields) {
+    JS_SetPropertyStr(ctx, rect, field, JS_NewInt32(ctx, 0));
+  }
+  return rect;
+}
+
+JSValue js_el_getClientRects(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_NewArray(ctx);
+  JSValue arr = JS_NewArray(ctx);
+  JS_SetPropertyUint32(ctx, arr, 0, js_el_getBoundingClientRect(ctx, this_val, argc, argv));
+  return arr;
+}
+
 JSValue js_el_isSameNode(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
   auto* node = unwrap_node(ctx, this_val);
   if (!node || argc < 1) return JS_FALSE;
@@ -1022,6 +1330,105 @@ JSValue js_el_isEqualNode(JSContext* ctx, JSValue this_val, int argc, JSValue* a
   return JS_NewBool(ctx, nodes_equal(node, other));
 }
 
+void collect_text_descendants(lxb_dom_node_t* node, std::vector<void*>& out) {
+  for (lxb_dom_node_t* child = node->first_child; child; child = child->next) {
+    if (child->type == LXB_DOM_NODE_TYPE_TEXT) out.push_back(child);
+    else if (child->first_child) collect_text_descendants(child, out);
+  }
+}
+
+JSValue js_el_normalize(JSContext* ctx, JSValue this_val, int, JSValue*) {
+  auto* node = unwrap_node(ctx, this_val);
+  if (!node) return JS_UNDEFINED;
+
+  // normalize() only merges/drops Text nodes (leaves, no children of their
+  // own), so a flat invalidate is enough — no need for the *_deep variant.
+  std::vector<void*> text_nodes;
+  collect_text_descendants(node, text_nodes);
+  if (!text_nodes.empty()) {
+    invalidate_node_cache_batch(ctx, get_ctx(ctx), text_nodes);
+  }
+
+  doc_for_node(ctx, node)->normalize(node);
+  return JS_UNDEFINED;
+}
+
+JSValue js_el_compareDocumentPosition(JSContext* ctx, JSValue this_val, int argc, JSValue* argv) {
+  auto* node = unwrap_node(ctx, this_val);
+  if (!node || argc < 1) return JS_NewInt32(ctx, 0);
+  auto* other = unwrap_node(ctx, argv[0]);
+  if (!other) return JS_NewInt32(ctx, 0);
+  return JS_NewInt32(ctx, doc_for_node(ctx, node)->compareDocumentPosition(node, other));
+}
+
+JSValue js_canonicalize_root_node(JSContext* ctx, JSValue, int argc, JSValue* argv) {
+  if (argc < 1) return JS_UNDEFINED;
+  auto* node = unwrap_node(ctx, argv[0]);
+  if (node && node->type == LXB_DOM_NODE_TYPE_DOCUMENT && doc_for_node(ctx, node) == get_doc(ctx)) {
+    JSValue global = JS_GetGlobalObject(ctx);
+    JSValue doc_val = JS_GetPropertyStr(ctx, global, "document");
+    JS_FreeValue(ctx, global);
+    return doc_val;
+  }
+  return JS_DupValue(ctx, argv[0]);
+}
+
+JSValue js_el_get_ownerDocument(JSContext* ctx, JSValue this_val) {
+  auto* node = unwrap_node(ctx, this_val);
+  if (!node) return JS_NULL;
+  if (node->type == LXB_DOM_NODE_TYPE_DOCUMENT) return JS_NULL;
+
+  LexborDocument* owner = doc_for_node(ctx, node);
+  if (owner == get_doc(ctx)) {
+    JSValue global = JS_GetGlobalObject(ctx);
+    JSValue doc_val = JS_GetPropertyStr(ctx, global, "document");
+    JS_FreeValue(ctx, global);
+    return doc_val;
+  }
+
+  JSValue wrapper = get_document_wrapper(ctx, owner);
+  if (!JS_IsUndefined(wrapper)) return wrapper;
+
+  void* html_doc = owner->documentHtmlPtr();
+  void* doc_node = lxb_dom_interface_node(
+      lxb_dom_interface_document(static_cast<lxb_html_document_t*>(html_doc)));
+  return make_element(ctx, doc_node);
+}
+
+JSValue js_el_get_namespaceURI(JSContext* ctx, JSValue this_val) {
+  auto* node = unwrap_node(ctx, this_val);
+  if (!node) return JS_NULL;
+  LexborDocument* owner = doc_for_node(ctx, node);
+  std::string uri = owner ? owner->namespaceURI(node) : "";
+  if (uri.empty()) return JS_NULL;
+  return JS_NewStringLen(ctx, uri.data(), uri.size());
+}
+
+// Element.prefix — the namespace prefix set via createElementNS('ns', 'prefix:local'),
+// or null for an element with no prefix (the overwhelmingly common case).
+JSValue js_el_get_prefix(JSContext* ctx, JSValue this_val) {
+  auto* el = unwrap_element(ctx, this_val);
+  if (!el) return JS_NULL;
+  auto* node = reinterpret_cast<lxb_dom_node_t*>(el);
+  if (node->prefix == 0) return JS_NULL;
+  const lxb_ns_prefix_data_t* data = lxb_ns_prefix_data_by_id(node->owner_document->prefix, node->prefix);
+  if (!data) return JS_NULL;
+  const lxb_char_t* str = lexbor_hash_entry_str(&data->entry);
+  if (!str) return JS_NULL;
+  return JS_NewStringLen(ctx, reinterpret_cast<const char*>(str), data->entry.length);
+}
+
+// Node.baseURI — always the document's URL in this sandbox (no <base> element
+// support/per-node override), so this just forwards to location.href.
+JSValue js_el_get_baseURI(JSContext* ctx, JSValue) {
+  JSValue global = JS_GetGlobalObject(ctx);
+  JSValue location = JS_GetPropertyStr(ctx, global, "location");
+  JS_FreeValue(ctx, global);
+  JSValue href = JS_GetPropertyStr(ctx, location, "href");
+  JS_FreeValue(ctx, location);
+  return href;
+}
+
 } // namespace
 
 void ElementBindings::install(JSContext* ctx) {
@@ -1048,11 +1455,18 @@ void ElementBindings::install(JSContext* ctx) {
   JS_SetPropertyStr(ctx, node_proto, "replaceWith",  JS_NewCFunction(ctx, js_el_replaceWith,  "replaceWith",  0));
   JS_SetPropertyStr(ctx, node_proto, "isSameNode",   JS_NewCFunction(ctx, js_el_isSameNode,   "isSameNode",   1));
   JS_SetPropertyStr(ctx, node_proto, "isEqualNode",  JS_NewCFunction(ctx, js_el_isEqualNode,  "isEqualNode",  1));
+  JS_SetPropertyStr(ctx, node_proto, "normalize",    JS_NewCFunction(ctx, js_el_normalize,    "normalize",    0));
+  JS_SetPropertyStr(ctx, node_proto, "compareDocumentPosition", JS_NewCFunction(ctx, js_el_compareDocumentPosition, "compareDocumentPosition", 1));
 
   define_prop(ctx, node_proto, "nodeType",         js_el_get_nodeType,        nullptr);
   define_prop(ctx, node_proto, "nodeName",         js_el_get_nodeName,        nullptr);
   define_prop(ctx, node_proto, "nodeValue",        js_el_get_nodeValue,       js_el_set_nodeValue);
+  define_prop(ctx, node_proto, "data",             js_el_get_nodeValue,       js_el_set_nodeValue);
+  define_prop(ctx, node_proto, "length",           js_el_get_data_length,     nullptr);
   define_prop(ctx, node_proto, "textContent",      js_el_get_textContent,     js_el_set_textContent);
+  define_prop(ctx, node_proto, "ownerDocument",    js_el_get_ownerDocument,   nullptr);
+  define_prop(ctx, node_proto, "namespaceURI",     js_el_get_namespaceURI,    nullptr);
+  define_prop(ctx, node_proto, "baseURI",          js_el_get_baseURI,         nullptr);
   define_prop(ctx, node_proto, "childNodes",       js_el_get_childNodes,      nullptr);
   define_prop(ctx, node_proto, "firstChild",       js_el_get_firstChild,      nullptr);
   define_prop(ctx, node_proto, "lastChild",        js_el_get_lastChild,       nullptr);
@@ -1061,6 +1475,8 @@ void ElementBindings::install(JSContext* ctx) {
   define_prop(ctx, node_proto, "parentNode",       js_el_get_parentNode,      nullptr);
   define_prop(ctx, node_proto, "parentElement",    js_el_get_parentElement,   nullptr);
 
+  define_node_type_constants(ctx, node_proto);
+
   JS_SetClassProto(ctx, js_node_class_id, JS_DupValue(ctx, node_proto));
 
   // ── Element proto: inherits Node, adds Element-specific APIs ─────────────
@@ -1071,10 +1487,15 @@ void ElementBindings::install(JSContext* ctx) {
   JS_SetPropertyStr(ctx, proto, "setAttribute",           JS_NewCFunction(ctx, js_el_setAttribute,           "setAttribute",           2));
   JS_SetPropertyStr(ctx, proto, "removeAttribute",        JS_NewCFunction(ctx, js_el_removeAttribute,        "removeAttribute",        1));
   JS_SetPropertyStr(ctx, proto, "hasAttribute",           JS_NewCFunction(ctx, js_el_hasAttribute,           "hasAttribute",           1));
+  JS_SetPropertyStr(ctx, proto, "getAttributeNS",         JS_NewCFunction(ctx, js_el_getAttributeNS,         "getAttributeNS",         2));
+  JS_SetPropertyStr(ctx, proto, "setAttributeNS",         JS_NewCFunction(ctx, js_el_setAttributeNS,         "setAttributeNS",         3));
+  JS_SetPropertyStr(ctx, proto, "removeAttributeNS",      JS_NewCFunction(ctx, js_el_removeAttributeNS,      "removeAttributeNS",      2));
+  JS_SetPropertyStr(ctx, proto, "hasAttributeNS",         JS_NewCFunction(ctx, js_el_hasAttributeNS,         "hasAttributeNS",         2));
   JS_SetPropertyStr(ctx, proto, "toggleAttribute",        JS_NewCFunction(ctx, js_el_toggleAttribute,        "toggleAttribute",        2));
   JS_SetPropertyStr(ctx, proto, "getAttributeNames",      JS_NewCFunction(ctx, js_el_getAttributeNames,      "getAttributeNames",      0));
   JS_SetPropertyStr(ctx, proto, "remove",                 JS_NewCFunction(ctx, js_el_remove,                 "remove",                 0));
   JS_SetPropertyStr(ctx, proto, "matches",                JS_NewCFunction(ctx, js_el_matches,                "matches",                1));
+  JS_SetPropertyStr(ctx, proto, "webkitMatchesSelector",  JS_NewCFunction(ctx, js_el_matches,                "webkitMatchesSelector",  1));
   JS_SetPropertyStr(ctx, proto, "querySelector",          JS_NewCFunction(ctx, js_el_querySelector,          "querySelector",          1));
   JS_SetPropertyStr(ctx, proto, "querySelectorAll",       JS_NewCFunction(ctx, js_el_querySelectorAll,       "querySelectorAll",       1));
   JS_SetPropertyStr(ctx, proto, "getElementsByClassName", JS_NewCFunction(ctx, js_el_getElementsByClassName, "getElementsByClassName", 1));
@@ -1083,12 +1504,18 @@ void ElementBindings::install(JSContext* ctx) {
   JS_SetPropertyStr(ctx, proto, "insertAdjacentHTML",     JS_NewCFunction(ctx, js_el_insertAdjacentHTML,     "insertAdjacentHTML",     2));
   JS_SetPropertyStr(ctx, proto, "append",                 JS_NewCFunction(ctx, js_el_append,                 "append",                 0));
   JS_SetPropertyStr(ctx, proto, "prepend",                JS_NewCFunction(ctx, js_el_prepend,                "prepend",                0));
+  JS_SetPropertyStr(ctx, proto, "getBoundingClientRect",  JS_NewCFunction(ctx, js_el_getBoundingClientRect,  "getBoundingClientRect",  0));
+  JS_SetPropertyStr(ctx, proto, "getClientRects",         JS_NewCFunction(ctx, js_el_getClientRects,         "getClientRects",         0));
 
   define_prop(ctx, proto, "tagName",                js_el_get_tagName,             nullptr);
+  define_prop(ctx, proto, "prefix",                 js_el_get_prefix,              nullptr);
   define_prop(ctx, proto, "id",                     js_el_get_id,                  js_el_set_id);
   define_prop(ctx, proto, "className",              js_el_get_className,           js_el_set_className);
+  define_prop(ctx, proto, "value",                  js_el_get_value,               js_el_set_value);
+  define_prop(ctx, proto, "checked",                js_el_get_checked,             js_el_set_checked);
   define_prop(ctx, proto, "innerHTML",              js_el_get_innerHTML,           js_el_set_innerHTML);
   define_prop(ctx, proto, "outerHTML",              js_el_get_outerHTML,           nullptr);
+  define_prop(ctx, proto, "innerText",              js_el_get_textContent,         js_el_set_textContent);
   define_prop(ctx, proto, "children",               js_el_get_children,            nullptr);
   define_prop(ctx, proto, "firstElementChild",      js_el_get_firstElementChild,   nullptr);
   define_prop(ctx, proto, "lastElementChild",       js_el_get_lastElementChild,    nullptr);
@@ -1101,6 +1528,91 @@ void ElementBindings::install(JSContext* ctx) {
   define_prop(ctx, proto, "attributes",              js_el_get_attributes,          nullptr);
 
   JS_SetClassProto(ctx, js_element_class_id, proto);
+
+  JSValue node_proto_ref    = JS_GetClassProto(ctx, js_node_class_id);
+  JSValue element_proto_ref = JS_GetClassProto(ctx, js_element_class_id);
+
+  JSValue node_ctor = define_global_constructor(ctx, "Node", node_proto_ref);
+  define_node_type_constants(ctx, node_ctor);
+  JS_FreeValue(ctx, node_ctor);
+  JSValue element_ctor = define_global_constructor(ctx, "Element", element_proto_ref);
+  JSValue global = JS_GetGlobalObject(ctx);
+  JS_SetPropertyStr(ctx, global, "HTMLElement", element_ctor);
+  JS_SetPropertyStr(ctx, global, "__nativeCanonicalizeRootNode",
+                     JS_NewCFunction(ctx, js_canonicalize_root_node, "__nativeCanonicalizeRootNode", 1));
+  JS_FreeValue(ctx, global);
+
+  JS_FreeValue(ctx, node_proto_ref);
+  JS_FreeValue(ctx, element_proto_ref);
+
+  static const char* kGetRootNodeScript = R"JS(
+  (function() {
+    Node.prototype.getRootNode = function(options) {
+      var composed = !!(options && options.composed);
+      var node = this;
+      while (true) {
+        var parent = node.parentNode;
+        if (parent) { node = parent; continue; }
+        if (composed && node.host) { node = node.host; continue; }
+        return __nativeCanonicalizeRootNode(node);
+      }
+    };
+
+    Object.defineProperty(Node.prototype, 'isConnected', {
+      get: function() { return this.getRootNode() === document; },
+      enumerable: true,
+      configurable: true,
+    });
+
+    function locateNamespace(node, prefix) {
+      if (!node) return null;
+      if (node.nodeType === 1) {
+        if (node.namespaceURI !== null && node.prefix === prefix) return node.namespaceURI;
+        var attrs = node.attributes;
+        for (var i = 0; i < attrs.length; i++) {
+          var a = attrs[i];
+          if (prefix === null && a.name === 'xmlns') return a.value || null;
+          if (prefix !== null && a.name === 'xmlns:' + prefix) return a.value || null;
+        }
+        return locateNamespace(node.parentElement, prefix);
+      }
+      if (node.nodeType === 9) {
+        return node.documentElement ? locateNamespace(node.documentElement, prefix) : null;
+      }
+      if (node.nodeType === 10 || node.nodeType === 11) return null;
+      return locateNamespace(node.parentElement, prefix);
+    }
+
+    Node.prototype.lookupNamespaceURI = function(prefix) {
+      if (prefix === undefined || prefix === '') prefix = null;
+      return locateNamespace(this, prefix);
+    };
+
+    Node.prototype.isDefaultNamespace = function(namespace) {
+      if (namespace === undefined || namespace === '') namespace = null;
+      return this.lookupNamespaceURI(null) === namespace;
+    };
+
+    Node.prototype.lookupPrefix = function(namespace) {
+      if (!namespace) return null;
+      var node = this.nodeType === 9 ? this.documentElement : this;
+      while (node && node.nodeType === 1) {
+        if (node.namespaceURI === namespace && node.prefix !== null) return node.prefix;
+        var attrs = node.attributes;
+        for (var i = 0; i < attrs.length; i++) {
+          var a = attrs[i];
+          if (a.name.indexOf('xmlns:') === 0 && a.value === namespace) return a.name.slice(6);
+        }
+        node = node.parentElement;
+      }
+      return null;
+    };
+  })();
+  )JS";
+  JSValue root_node_result = JS_Eval(ctx, kGetRootNodeScript, strlen(kGetRootNodeScript),
+                                      "<get-root-node-bootstrap>", JS_EVAL_TYPE_GLOBAL);
+  if (JS_IsException(root_node_result)) JS_FreeValue(ctx, JS_GetException(ctx));
+  JS_FreeValue(ctx, root_node_result);
 }
 
 } // namespace margelo::nitro::nitrojsdom