dommy 0.5.0 → 0.7.0

data/lib/dommy/element.rb

@@ -9,7 +9,9 @@ module Dommy
     include EventTarget
     include Node
 
-    attr_reader :__node__, :document
+    attr_reader :document
+
+    def __dommy_backend_node__ = @__node__
 
     def initialize(document, nokogiri_node)
       @document = document
@@ -98,6 +100,12 @@ module Dommy
       end
     end
 
+    # Methods routed through __js_call__ (keep in sync with its when-arms).
+    JS_METHOD_NAMES = %w[cloneNode querySelector querySelectorAll getElementById appendChild].freeze
+    def __js_method_names__
+      JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "cloneNode"
@@ -128,9 +136,9 @@ module Dommy
     def detach_dom_nodes(value)
       case value
       when String
-        [@document.create_text_node(value).__node__]
+        [@document.create_text_node(value).__dommy_backend_node__]
       else
-        node = value.respond_to?(:__node__) ? value.__node__ : nil
+        node = value.respond_to?(:__dommy_backend_node__) ? value.__dommy_backend_node__ : nil
         return [] unless node
 
         node.unlink if node.parent
@@ -147,7 +155,7 @@ module Dommy
 
     # Fragments aren't part of the bubble chain; nil terminates
     # bubbling at the boundary (shadow root, detached fragment, etc.).
-    def __event_parent__
+    def __internal_event_parent__
       nil
     end
   end
@@ -157,7 +165,7 @@ module Dommy
   class CharacterDataNode
     include Node
 
-    attr_reader :__node__
+    def __dommy_backend_node__ = @__node__
 
     def initialize(document, nokogiri_node)
       @document = document
@@ -191,7 +199,19 @@ module Dommy
     end
 
     def remove
+      parent = @__node__.parent
+      removed = @__node__
       @__node__.unlink
+      # Mirror Element#remove_child: notify with the Nokogiri::Node
+      # (not the Dommy wrapper) so MutationCoordinator's wrap_node
+      # cache keys consistently.
+      if parent
+        @document.notify_child_list_mutation(
+          target_node: parent,
+          added_nodes: [],
+          removed_nodes: [removed]
+        )
+      end
       nil
     end
 
@@ -243,16 +263,105 @@ module Dommy
       nil
     end
 
-    def __js_call__(method, _args)
+    # Methods routed through __js_call__ (keep in sync with its when-arms).
+    JS_METHOD_NAMES = %w[remove before after replaceWith].freeze
+    def __js_method_names__
+      JS_METHOD_NAMES
+    end
+
+    def __js_call__(method, args)
       case method
       when "remove"
-        @__node__.unlink
-        nil
+        remove
+      when "before"
+        before(*args)
+      when "after"
+        after(*args)
+      when "replaceWith"
+        replace_with(*args)
       end
     end
 
+    # ChildNode mixin: WHATWG DOM defines `before`, `after`,
+    # `replaceWith` on all child nodes, including Text and Comment.
+    # Implementations operate on the Nokogiri layer and notify the
+    # MutationObserver with the underlying nodes (mirroring
+    # Element#remove_child / replace_child).
+
+    def before(*args)
+      parent = @__node__.parent
+      return nil unless parent
+
+      added = args.map { |arg| coerce_node(arg) }.compact
+      added.reverse_each { |node| @__node__.add_previous_sibling(node) }
+      notify_child_list_added(parent, added)
+      nil
+    end
+
+    def after(*args)
+      parent = @__node__.parent
+      return nil unless parent
+
+      added = args.map { |arg| coerce_node(arg) }.compact
+      anchor = @__node__.next_sibling
+      if anchor
+        added.reverse_each { |node| anchor.add_previous_sibling(node) }
+      else
+        added.each { |node| parent.add_child(node) }
+      end
+      notify_child_list_added(parent, added)
+      nil
+    end
+
+    def replace_with(*args)
+      parent = @__node__.parent
+      return nil unless parent
+
+      added = args.map { |arg| coerce_node(arg) }.compact
+      removed = @__node__
+      anchor = @__node__.next_sibling
+      @__node__.unlink
+      if anchor
+        added.reverse_each { |node| anchor.add_previous_sibling(node) }
+      else
+        added.each { |node| parent.add_child(node) }
+      end
+      @document.notify_child_list_mutation(
+        target_node: parent,
+        added_nodes: added,
+        removed_nodes: [removed]
+      )
+      nil
+    end
+
     private
 
+    # Coerce a `before` / `after` / `replaceWith` argument into a raw
+    # Nokogiri node, ready to be linked into a parent. Strings become
+    # fresh text nodes; existing nodes are detached from their current
+    # parent first (matching Element#detach_dom_nodes minus the
+    # Fragment branch which is rarely needed off a text/comment node).
+    def coerce_node(arg)
+      case arg
+      when String
+        @document.create_text_node(arg).__dommy_backend_node__
+      else
+        node = arg.respond_to?(:__dommy_backend_node__) ? arg.__dommy_backend_node__ : nil
+        node.unlink if node && node.parent
+        node
+      end
+    end
+
+    def notify_child_list_added(parent, added)
+      return if added.empty?
+
+      @document.notify_child_list_mutation(
+        target_node: parent,
+        added_nodes: added,
+        removed_nodes: []
+      )
+    end
+
     def write_data(value)
       old = @__node__.content
       @__node__.content = value.to_s
@@ -265,6 +374,12 @@ module Dommy
       3
     end
 
+    # Own __js_call__ methods, on top of CharacterDataNode's.
+    JS_METHOD_NAMES = %w[cloneNode].freeze
+    def __js_method_names__
+      super + JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "cloneNode"
@@ -280,6 +395,12 @@ module Dommy
       8
     end
 
+    # Own __js_call__ methods, on top of CharacterDataNode's.
+    JS_METHOD_NAMES = %w[cloneNode].freeze
+    def __js_method_names__
+      super + JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "cloneNode"
@@ -311,7 +432,7 @@ module Dommy
     end
 
     def value
-      @element.__node__["class"].to_s
+      @element.__dommy_backend_node__["class"].to_s
     end
 
     def value=(new_value)
@@ -383,6 +504,12 @@ module Dommy
       nil
     end
 
+    # Methods routed through __js_call__ (keep in sync with its when-arms).
+    JS_METHOD_NAMES = %w[add remove contains toggle replace item].freeze
+    def __js_method_names__
+      JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "add"
@@ -444,14 +571,14 @@ module Dommy
     end
 
     def class_tokens
-      raw = @element.__node__["class"].to_s
+      raw = @element.__dommy_backend_node__["class"].to_s
       raw.split(/\s+/).reject(&:empty?)
     end
 
     def update_tokens
       tokens = yield(class_tokens)
       if tokens.empty?
-        @element.remove_attribute("class") if @element.__node__.key?("class")
+        @element.remove_attribute("class") if @element.__dommy_backend_node__.key?("class")
       else
         @element.set_attribute("class", tokens.join(" "))
       end
@@ -467,7 +594,7 @@ module Dommy
     end
 
     def __js_get__(key)
-      @element.__node__[attr_name(key)]
+      @element.__dommy_backend_node__[attr_name(key)]
     end
 
     def __js_set__(key, value)
@@ -491,6 +618,8 @@ module Dommy
   # positioning sees zeroed values; absolute layout assertions need
   # the real browser.
   class DOMRect
+    attr_reader :x, :y, :width, :height
+
     def initialize(x: 0, y: 0, width: 0, height: 0)
       @x = x
       @y = y
@@ -498,6 +627,22 @@ module Dommy
       @height = height
     end
 
+    def top
+      @y
+    end
+
+    def left
+      @x
+    end
+
+    def right
+      @x + @width
+    end
+
+    def bottom
+      @y + @height
+    end
+
     def __js_get__(key)
       case key
       when "x", "left"
@@ -611,6 +756,12 @@ module Dommy
       nil
     end
 
+    # Methods routed through __js_call__ (keep in sync with its when-arms).
+    JS_METHOD_NAMES = %w[setProperty removeProperty getPropertyValue item].freeze
+    def __js_method_names__
+      JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "setProperty"
@@ -656,7 +807,7 @@ module Dommy
     end
 
     def properties
-      raw = @element.__node__["style"].to_s
+      raw = @element.__dommy_backend_node__["style"].to_s
       raw.split(";").each_with_object({}) do |entry, out|
         key, value = entry.split(":", 2)
         next unless key && value
@@ -667,7 +818,7 @@ module Dommy
 
     def write_properties(props)
       if props.empty?
-        @element.remove_attribute("style") if @element.__node__.key?("style")
+        @element.remove_attribute("style") if @element.__dommy_backend_node__.key?("style")
       else
         @element.set_attribute("style", props.map { |k, v| "#{k}:#{v}" }.join(";"))
       end
@@ -678,7 +829,9 @@ module Dommy
     include EventTarget
     include Node
 
-    attr_reader :__node__, :document
+    attr_reader :document
+
+    def __dommy_backend_node__ = @__node__
 
     def initialize(document, nokogiri_node)
       @document = document
@@ -842,7 +995,7 @@ module Dommy
       parent = @__node__.parent
       return unless parent
 
-      if parent.is_a?(Nokogiri::XML::Document)
+      if parent.is_a?(Backend.document_class)
         raise(
           DOMException::NoModificationAllowedError,
           "outerHTML setter not allowed on the document element"
@@ -866,9 +1019,9 @@ module Dommy
     # `el.contains(other)` — true if `other` is `el` itself or any
     # descendant. Per spec, returns false for null/non-Node.
     def contains?(other)
-      return false unless other.respond_to?(:__node__)
+      return false unless other.respond_to?(:__dommy_backend_node__)
 
-      other_node = other.__node__
+      other_node = other.__dommy_backend_node__
       return true if other_node == @__node__
 
       Internal::NodeTraversal.ancestor_of?(@__node__, other_node)
@@ -879,7 +1032,7 @@ module Dommy
     # inside a shadow tree, returns that ShadowRoot. Otherwise walks
     # until we hit the Nokogiri Document (then returns the Document).
     def root_node
-      sr = @document.__shadow_root_containing__(@__node__)
+      sr = @document.__internal_shadow_root_containing__(@__node__)
       return sr if sr
 
       current = @__node__
@@ -887,7 +1040,7 @@ module Dommy
       loop do
         parent = current.respond_to?(:parent) ? current.parent : nil
         break unless parent
-        if parent.is_a?(Nokogiri::XML::Document)
+        if parent.is_a?(Backend.document_class)
           attached = true
           break
         end
@@ -1036,14 +1189,14 @@ module Dommy
 
         parent = current.respond_to?(:parent) ? current.parent : nil
         return false unless parent
-        return true if parent.is_a?(Nokogiri::XML::Document)
+        return true if parent.is_a?(Backend.document_class)
 
-        sr = @document.__shadow_root_for_fragment__(parent)
+        sr = @document.__internal_shadow_root_for_fragment__(parent)
         if sr
           host = sr.host
           return false unless host
 
-          current = host.__node__
+          current = host.__dommy_backend_node__
         else
           current = parent
         end
@@ -1056,12 +1209,12 @@ module Dommy
     # tests rely on `document.activeElement` updating. Track the most
     # recently focused element on the document.
     def focus
-      @document.__set_active_element__(self)
+      @document.__internal_set_active_element__(self)
       nil
     end
 
     def blur
-      @document.__set_active_element__(nil)
+      @document.__internal_set_active_element__(nil)
       nil
     end
 
@@ -1131,7 +1284,7 @@ module Dommy
 
     # Internal — gives access to the shadow root regardless of mode.
     # Used by event composition / `composedPath()`.
-    def __shadow_root__
+    def __internal_shadow_root__
       @__shadow_root
     end
 
@@ -1139,7 +1292,7 @@ module Dommy
     # "beforebegin", "afterbegin", "beforeend", "afterend". Returns the
     # inserted element or nil if position has no anchor (root cases).
     def insert_adjacent_element(position, element)
-      return nil unless element.respond_to?(:__node__)
+      return nil unless element.respond_to?(:__dommy_backend_node__)
 
       case position.to_s
       when "beforebegin"
@@ -1238,10 +1391,10 @@ module Dommy
     # nodes).
     def compare_document_position(other)
       return 0 if equal?(other)
-      return DOCUMENT_POSITION_DISCONNECTED unless other.respond_to?(:__node__)
+      return DOCUMENT_POSITION_DISCONNECTED unless other.respond_to?(:__dommy_backend_node__)
 
       self_node = @__node__
-      other_node = other.__node__
+      other_node = other.__dommy_backend_node__
 
       self_ancestors = ancestor_chain(self_node)
       other_ancestors = ancestor_chain(other_node)
@@ -1291,11 +1444,11 @@ module Dommy
     # suite and standard DOM Node.isEqualNode.
     def equal_node?(other)
       return false unless other.is_a?(Element)
-      return false unless @__node__.name == other.__node__.name
+      return false unless @__node__.name == other.__dommy_backend_node__.name
       return false unless attribute_signature == other.send(:attribute_signature)
-      return false unless @__node__.children.size == other.__node__.children.size
+      return false unless @__node__.children.size == other.__dommy_backend_node__.children.size
 
-      @__node__.children.zip(other.__node__.children).all? do |a, b|
+      @__node__.children.zip(other.__dommy_backend_node__.children).all? do |a, b|
         wa = @document.wrap_node(a)
         wb = @document.wrap_node(b)
         wa.respond_to?(:equal_node?) ? wa.equal_node?(wb) : a.content == b.content
@@ -1404,6 +1557,26 @@ module Dommy
         1
       when "isConnected"
         is_connected?
+      when
+          "scrollTop",
+          "scrollLeft",
+          "scrollWidth",
+          "scrollHeight",
+          "clientWidth",
+          "clientHeight",
+          "clientTop",
+          "clientLeft",
+          "offsetWidth",
+          "offsetHeight",
+          "offsetTop",
+          "offsetLeft"
+        # No layout engine — zeroed values match what real browsers
+        # report for hidden / pre-paint elements.
+        0
+      when "offsetParent"
+        nil
+      when "popover"
+        get_attribute("popover")
       when "children"
         @live_children
       when "firstElementChild"
@@ -1503,7 +1676,20 @@ module Dommy
     def __js_set__(key, value)
       case key
       when "textContent"
+        # `node.content =` removes all existing children and (if
+        # value is non-empty) appends a single text node. Capture
+        # before/after to feed MutationObserver — mirrors the
+        # innerHTML branch below.
+        removed = @__node__.children.to_a
         @__node__.content = value.to_s
+        added = @__node__.children.to_a
+        if removed.any? || added.any?
+          @document.notify_child_list_mutation(
+            target_node: @__node__,
+            added_nodes: added,
+            removed_nodes: removed
+          )
+        end
       when "innerHTML"
         removed = @__node__.children.to_a
         if @__node__.name == "template"
@@ -1573,6 +1759,21 @@ module Dommy
 
     public
 
+    # Methods routed through __js_call__ (keep in sync with its when-arms).
+    JS_METHOD_NAMES = %w[
+      getAttribute setAttribute hasAttribute removeAttribute getAttributeNames closest
+      querySelector querySelectorAll getElementsByClassName getElementsByTagName
+      insertAdjacentElement insertAdjacentHTML insertAdjacentText toggleAttribute matches
+      toString getAttributeNode setAttributeNode removeAttributeNode focus blur attachShadow
+      addEventListener removeEventListener dispatchEvent appendChild insertBefore removeChild
+      replaceChild cloneNode append prepend replaceChildren before after getInnerHTML getHTML
+      remove replaceWith click getBoundingClientRect getClientRects scrollIntoView scroll
+      scrollTo scrollBy requestFullscreen showPopover hidePopover togglePopover
+    ].freeze
+    def __js_method_names__
+      JS_METHOD_NAMES
+    end
+
     def __js_call__(method, args)
       case method
       when "getAttribute"
@@ -1658,6 +1859,26 @@ module Dommy
         dispatch_event(MouseEvent.new("click", "bubbles" => true, "cancelable" => true, "button" => 0))
       when "getBoundingClientRect"
         DOMRect.new
+      when "getClientRects"
+        []
+      when "scrollIntoView", "scroll", "scrollTo", "scrollBy"
+        # No layout — record the request for tests to assert against.
+        @scroll_log ||= []
+        @scroll_log << [method, args]
+        nil
+      when "requestFullscreen"
+        @document.__internal_set_fullscreen_element__(self)
+        PromiseValue.resolve(@document.default_view, nil)
+      when "showPopover"
+        toggle_popover_state(true)
+        nil
+      when "hidePopover"
+        toggle_popover_state(false)
+        nil
+      when "togglePopover"
+        new_state = !@__popover_open__
+        toggle_popover_state(new_state)
+        new_state
       else
         nil
       end
@@ -1665,6 +1886,11 @@ module Dommy
 
     private
 
+    def normalize_attr_key(name)
+      s = name.to_s
+      case_sensitive_attribute_names? ? s : s.downcase
+    end
+
     def element_children
       @__node__.element_children.each_with_object([]) do |node, out|
         wrapped = @document.wrap_node(node)
@@ -1676,14 +1902,14 @@ module Dommy
       @document.wrap_node(node)
     end
 
-    def __event_parent__
+    def __internal_event_parent__
       parent_node = @__node__.parent
       # If our Nokogiri parent is a shadow tree's backing fragment,
       # the bubble path's next stop is the ShadowRoot itself — not
-      # the bare Fragment wrapper. The ShadowRoot's __event_parent__
+      # the bare Fragment wrapper. The ShadowRoot's __internal_event_parent__
       # will return nil (composed events route to host explicitly).
-      if parent_node.is_a?(Nokogiri::XML::DocumentFragment)
-        sr = @document.__shadow_root_for_fragment__(parent_node)
+      if parent_node.is_a?(Backend.document_fragment_class)
+        sr = @document.__internal_shadow_root_for_fragment__(parent_node)
         return sr if sr
       end
 
@@ -1697,20 +1923,27 @@ module Dommy
       @document.template_content_fragment(self)
     end
 
-    # HTML attribute names are case-insensitive — browser DOM stores
-    # them in lowercase regardless of the case passed to setAttribute.
-    # Matches that behavior so callers using `"SRC"` / `"Action"` /
-    # etc. interoperate with `getAttribute("src")` round-trips.
+    # Attribute name handling depends on the element's namespace:
+    # - HTML: case-insensitive (browser DOM stores everything lowercase).
+    # - SVG / other XML: case-sensitive (`viewBox` ≠ `viewbox`).
+    # Subclasses with a known namespace override `case_sensitive_attribute_names?`
+    # to flip the behavior. Generic Element nodes inspect the namespace
+    # URI directly.
+    def case_sensitive_attribute_names?
+      ns = namespace_uri
+      !ns.nil? && ns != "http://www.w3.org/1999/xhtml"
+    end
+
     def get_attribute(name)
       return nil if name.nil?
 
-      @__node__[name.to_s.downcase]
+      @__node__[normalize_attr_key(name)]
     end
 
     def set_attribute(name, value)
       return nil if name.nil?
 
-      key = name.to_s.downcase
+      key = normalize_attr_key(name)
       old = @__node__[key]
       @__node__[key] = value.to_s
       @document.notify_attribute_mutation(target_node: @__node__, attribute_name: key, old_value: old)
@@ -1720,13 +1953,13 @@ module Dommy
     def has_attribute?(name)
       return false if name.nil?
 
-      @__node__.key?(name.to_s.downcase)
+      @__node__.key?(normalize_attr_key(name))
     end
 
     def remove_attribute(name)
       return nil if name.nil?
 
-      key = name.to_s.downcase
+      key = normalize_attr_key(name)
       return nil unless @__node__.key?(key)
 
       old = @__node__[key]
@@ -1748,16 +1981,51 @@ module Dommy
       nil
     end
 
+    # Web Animations: start an animation on this element.
+    # Returns the new Animation. Dommy doesn't interpolate; the
+    # animation simply transitions through the `playState` lifecycle,
+    # finishing via `scheduler.advance_time(duration)` or an
+    # explicit `animation.finish`.
+    def animate(keyframes, options = nil)
+      effect = KeyframeEffect.new(self, keyframes, options)
+      animation = Animation.new(effect, nil, window: @document.default_view)
+      @__animations ||= []
+      @__animations << animation
+      animation.play
+      animation
+    end
+
+    def get_animations(_options = nil)
+      (@__animations ||= []).dup
+    end
+
+    alias getAnimations get_animations
+
     def query_selector(selector)
       return nil if selector.nil? || selector.to_s.empty?
 
-      @document.wrap_node(@__node__.at_css(selector.to_s))
+      @document.wrap_node(@__node__.at_css(selector.to_s, Internal::CSS_PSEUDO_HANDLERS))
     end
 
     def query_selector_all(selector)
       return NodeList.new if selector.nil? || selector.to_s.empty?
 
-      NodeList.new(@__node__.css(selector.to_s).map { |node| @document.wrap_node(node) }.compact)
+      NodeList.new(@__node__.css(selector.to_s, Internal::CSS_PSEUDO_HANDLERS).map { |node| @document.wrap_node(node) }.compact)
+    end
+
+    # XPath queries scoped to this element, returning wrapped nodes.
+    def at_xpath(expression)
+      node = @__node__.at_xpath(expression)
+      node && @document.wrap_node(node)
+    end
+
+    def xpath(expression)
+      @__node__.xpath(expression).map { |node| @document.wrap_node(node) }
+    end
+
+    # The XPath string locating this element in its document.
+    def path
+      @__node__.path
     end
 
     def append_child(child)
@@ -1903,10 +2171,10 @@ module Dommy
     # produce a cycle (inserting an ancestor as a descendant of
     # itself). Strings and Fragments are always safe.
     def check_hierarchy!(child)
-      return unless child.respond_to?(:__node__)
+      return unless child.respond_to?(:__dommy_backend_node__)
 
-      node = child.__node__
-      return unless node.is_a?(Nokogiri::XML::Node)
+      node = child.__dommy_backend_node__
+      return unless node.is_a?(Backend.node_class)
 
       if node == @__node__ || @__node__.ancestors.any? { |a| a == node }
         raise(
@@ -1923,13 +2191,13 @@ module Dommy
     def detach_dom_nodes(value)
       case value
       when Element, TextNode, CommentNode
-        node = value.__node__
+        node = value.__dommy_backend_node__
         node.unlink if node.parent
         [node]
       when Fragment
         value.extract_children
       when String
-        [@document.create_text_node(value).__node__]
+        [@document.create_text_node(value).__dommy_backend_node__]
       else
         node = unwrap_dom_node(value)
         return [] unless node
@@ -1940,7 +2208,7 @@ module Dommy
     end
 
     def unwrap_dom_node(value)
-      return value.__node__ if value.respond_to?(:__node__)
+      return value.__dommy_backend_node__ if value.respond_to?(:__dommy_backend_node__)
 
       nil
     end
@@ -1953,6 +2221,35 @@ module Dommy
       end
     end
 
+    # Popover state — modern HTML pattern. `show`/`hide`/`toggle`
+    # fire `beforetoggle` and `toggle` events (no real visual change).
+    def toggle_popover_state(open)
+      old_state = @__popover_open__ ? "open" : "closed"
+      new_state = open ? "open" : "closed"
+      return if old_state == new_state
+
+      dispatch_event(
+        CustomEvent.new(
+          "beforetoggle",
+          "detail" => {"oldState" => old_state, "newState" => new_state}
+        )
+      )
+      @__popover_open__ = open
+      dispatch_event(
+        CustomEvent.new(
+          "toggle",
+          "detail" => {"oldState" => old_state, "newState" => new_state}
+        )
+      )
+    end
+
+    # Test inspector for scroll calls (no real layout to scroll).
+    def __test_scroll_log__
+      @scroll_log ||= []
+    end
+
+    public :__test_scroll_log__
+
     # Re-expose snake_case methods that the JS bridge dispatch routes
     # to. Defined as private originally so internal helpers (element_children,
     # detach_dom_nodes, etc.) stay encapsulated; CRuby users call these
@@ -1969,7 +2266,13 @@ module Dommy
       :clone_node,
       :query_selector,
       :query_selector_all,
-      :closest
+      :at_xpath,
+      :xpath,
+      :path,
+      :closest,
+      :animate,
+      :get_animations,
+      :getAnimations
     )
   end
 end