LibWeb: Implement PopoverInvokerElement attribute change steps

tcl3 · Dec 12, 2024 · 4d6f9b3 · 4d6f9b3
1 parent 56a299d
commit 4d6f9b3
Show file tree

Hide file tree

Showing 7 changed files with 101 additions and 4 deletions.
diff --git a/Libraries/LibWeb/CMakeLists.txt b/Libraries/LibWeb/CMakeLists.txt
@@ -441,6 +441,7 @@ set(SOURCES
     HTML/Numbers.cpp
     HTML/PageTransitionEvent.cpp
     HTML/PolicyContainers.cpp
+    HTML/PopoverInvokerElement.cpp
     HTML/PopStateEvent.cpp
     HTML/Parser/Entities.cpp
     HTML/Parser/HTMLEncodingDetection.cpp

diff --git a/Libraries/LibWeb/HTML/HTMLButtonElement.cpp b/Libraries/LibWeb/HTML/HTMLButtonElement.cpp
@@ -45,6 +45,11 @@ WebIDL::ExceptionOr<void> HTMLButtonElement::set_type(String const& type)
     return set_attribute(HTML::AttributeNames::type, type);
 }
 
+void HTMLButtonElement::form_associated_element_attribute_changed(FlyString const& name, Optional<String> const& value, Optional<FlyString> const& namespace_)
+{
+    PopoverInvokerElement::associated_attribute_changed(name, value, namespace_);
+}
+
 void HTMLButtonElement::visit_edges(Visitor& visitor)
 {
     Base::visit_edges(visitor);

diff --git a/Libraries/LibWeb/HTML/HTMLButtonElement.h b/Libraries/LibWeb/HTML/HTMLButtonElement.h
@@ -40,6 +40,8 @@ class HTMLButtonElement final
     TypeAttributeState type_state() const;
     WebIDL::ExceptionOr<void> set_type(String const&);
 
+    virtual void form_associated_element_attribute_changed(FlyString const& name, Optional<String> const& value, Optional<FlyString> const& namespace_) override;
+
     // ^EventTarget
     // https://html.spec.whatwg.org/multipage/interaction.html#the-tabindex-attribute:the-button-element
     // https://html.spec.whatwg.org/multipage/interaction.html#focusable-area

diff --git a/Libraries/LibWeb/HTML/PopoverInvokerElement.cpp b/Libraries/LibWeb/HTML/PopoverInvokerElement.cpp
@@ -0,0 +1,32 @@
+/*
+ * Copyright (c) 2024, Tim Ledbetter <[email protected]>
+ *
+ * SPDX-License-Identifier: BSD-2-Clause
+ */
+
+#include <LibWeb/DOM/Element.h>
+#include <LibWeb/HTML/AttributeNames.h>
+#include <LibWeb/HTML/PopoverInvokerElement.h>
+
+namespace Web::HTML {
+
+void PopoverInvokerElement::associated_attribute_changed(FlyString const& name, Optional<String> const&, Optional<FlyString> const& namespace_)
+{
+    // From: https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#reflecting-content-attributes-in-idl-attributess
+    // For element reflected targets only: the following attribute change steps, given element, localName, oldValue, value, and namespace,
+    // are used to synchronize between the content attribute and the IDL attribute:
+
+    // 1. If localName is not attr or namespace is not null, then return.
+    if (name != HTML::AttributeNames::popovertarget || namespace_.has_value())
+        return;
+
+    // 2. Set element's explicitly set attr-elements to null.
+    m_popover_target_element = nullptr;
+}
+
+void PopoverInvokerElement::visit_edges(JS::Cell::Visitor& visitor)
+{
+    visitor.visit(m_popover_target_element);
+}
+
+}
diff --git a/Libraries/LibWeb/HTML/PopoverInvokerElement.h b/Libraries/LibWeb/HTML/PopoverInvokerElement.h
@@ -22,10 +22,8 @@ class PopoverInvokerElement {
     void set_popover_target_element(GC::Ptr<DOM::Element> value) { m_popover_target_element = value; }
 
 protected:
-    void visit_edges(JS::Cell::Visitor& visitor)
-    {
-        visitor.visit(m_popover_target_element);
-    }
+    void visit_edges(JS::Cell::Visitor&);
+    void associated_attribute_changed(FlyString const& name, Optional<String> const& value, Optional<FlyString> const& namespace_);
 
 private:
     GC::Ptr<DOM::Element> m_popover_target_element;

diff --git a/Tests/LibWeb/Text/expected/wpt-import/html/semantics/popovers/popovertarget-reflection.txt b/Tests/LibWeb/Text/expected/wpt-import/html/semantics/popovers/popovertarget-reflection.txt
@@ -0,0 +1,6 @@
+Harness status: OK
+
+Found 1 tests
+
+1 Pass
+Pass	Element attribute reflection of popoverTargetElement/popovertarget should be kept in sync.
diff --git a/Tests/LibWeb/Text/input/wpt-import/html/semantics/popovers/popovertarget-reflection.html b/Tests/LibWeb/Text/input/wpt-import/html/semantics/popovers/popovertarget-reflection.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:[email protected]">
+<link rel=help href="https://bugs.chromium.org/p/chromium/issues/detail?id=1523410">
+<link rel=help href="https://bugzilla.mozilla.org/show_bug.cgi?id=1879001">
+<link rel=help href="https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#reflecting-content-attributes-in-idl-attributes:element">
+<script src="../../../resources/testharness.js"></script>
+<script src="../../../resources/testharnessreport.js"></script>
+
+<button id=mybutton popovertarget="mypopover">toggle popover</button>
+<div id=mypopover popover=auto>popover</div>
+
+<script>
+test(() => {
+  assert_equals(mybutton.popoverTargetElement.id, "mypopover",
+    'Setting element.popoverTargetElement to a valid element should work');
+
+  mybutton.popoverTargetElement = null;
+  assert_false(mybutton.hasAttribute('popovertarget'),
+    'Setting element.popoverTargetElement to null should unset popovertarget attribute.');
+  assert_equals(mybutton.popoverTargetElement, null,
+    'Setting element.popoverTargetElement to null should remove the existing element from element.popoverTargetElement.');
+
+  mybutton.popoverTargetElement = mypopover;
+  assert_true(mybutton.hasAttribute('popovertarget'),
+    'Assigning to element.popoverTargetElement should set the popovertarget attribute.');
+
+  mybutton.removeAttribute('popovertarget');
+  assert_equals(mybutton.popoverTargetElement, null,
+    'Removing the popovertarget attribute should remove the element from element.popoverTargetElement.');
+
+  mybutton.popoverTargetElement = mypopover;
+  assert_true(mybutton.hasAttribute('popovertarget'),
+    'Assigning to element.popoverTargetElement should set the popovertarget attribute.');
+
+  mybutton.setAttribute("popovertarget", 'invalid');
+  assert_equals(mybutton.popoverTargetElement, null,
+    'Setting the popovertarget attribute to a localName that is not attr should remove the existing element from element.popoverTargetElement.');
+
+  mybutton.popoverTargetElement = mypopover;
+  mybutton.setAttribute("popovertarget", "");
+  assert_equals(mybutton.popoverTargetElement, null,
+    'Setting the popovertarget attribute to empty string right after setting explicit element does remove the explicit element.');
+
+  mybutton.setAttribute("popovertarget", "mypopover");
+  assert_equals(mybutton.popoverTargetElement.id, "mypopover",
+    'Setting the popovertarget attribute to a value should set the popover target element.');
+  mybutton.setAttribute("popovertarget", "");
+  assert_equals(mybutton.getAttribute('popovertarget'), "",
+    'Assigning to element.popoverTargetElement to empty string should update the attribute value to empty string.');
+  assert_equals(mybutton.popoverTargetElement, null,
+    'Setting the popovertarget attribute to empty string should remove the existing element from element.popoverTargetElement.');
+}, 'Element attribute reflection of popoverTargetElement/popovertarget should be kept in sync.');
+</script>