LibWeb/HTML: Add the commandForElement attribute to the button element

This commit adds the commandForElement attribute to the
button element. Executing commands is not implemented yet.
This commit is contained in:
Glenn Skrzypczak 2025-04-04 01:27:55 +02:00 committed by Tim Ledbetter
parent b2db07f002
commit ffe0b05abd
Notes: github-actions[bot] 2025-04-18 11:11:13 +00:00
6 changed files with 144 additions and 3 deletions

View file

@ -87,6 +87,7 @@ void HTMLButtonElement::visit_edges(Visitor& visitor)
{
Base::visit_edges(visitor);
PopoverInvokerElement::visit_edges(visitor);
visitor.visit(m_command_for_element);
}
// https://html.spec.whatwg.org/multipage/interaction.html#dom-tabindex

View file

@ -81,7 +81,10 @@ public:
virtual void activation_behavior(DOM::Event const&) override;
String command() const;
WebIDL::ExceptionOr<void> set_command(String const& command);
WebIDL::ExceptionOr<void> set_command(String const&);
GC::Ptr<DOM::Element> command_for_element() { return m_command_for_element; }
void set_command_for_element(GC::Ptr<DOM::Element> value) { m_command_for_element = value; }
private:
virtual void visit_edges(Visitor&) override;
@ -92,6 +95,8 @@ private:
// ^DOM::Element
virtual i32 default_tab_index_value() const override;
GC::Ptr<DOM::Element> m_command_for_element;
};
}

View file

@ -16,6 +16,7 @@ interface HTMLButtonElement : HTMLElement {
[HTMLConstructor] constructor();
[CEReactions] attribute DOMString command;
[CEReactions, Reflect=commandfor] attribute Element? commandForElement;
[CEReactions, Reflect] attribute boolean disabled;
readonly attribute HTMLFormElement? form;
[CEReactions] attribute USVString formAction;

View file

@ -0,0 +1,16 @@
Harness status: OK
Found 11 tests
11 Pass
Pass commandForElement reflects invokee HTML element
Pass commandForElement reflects set value
Pass commandForElement reflects set value across shadow root into light dom
Pass commandForElement does not reflect set value inside shadowroot
Pass commandForElement throws error on assignment of non Element
Pass command reflects '' when attribute empty, setAttribute version
Pass command reflects correctly for invalid
Pass command reflects '' when attribute empty, IDL version
Pass command reflects correctly for invalid when array
Pass command reflects '' when attribute set to []
Pass command reflects correctly for invalid when object

View file

@ -1,52 +1,67 @@
Harness status: OK
Found 1111 tests
Found 1141 tests
1080 Pass
1110 Pass
31 Fail
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to button with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to button with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to button with reference target
Pass button.form has reflection behavior IsNull when pointing to button with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to input with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to input with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to input with reference target
Pass button.form has reflection behavior IsNull when pointing to input with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to meter with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to meter with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to meter with reference target
Pass button.form has reflection behavior IsNull when pointing to meter with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to output with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to output with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to output with reference target
Pass button.form has reflection behavior IsNull when pointing to output with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to progress with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to progress with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to progress with reference target
Pass button.form has reflection behavior IsNull when pointing to progress with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to select with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to select with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to select with reference target
Pass button.form has reflection behavior IsNull when pointing to select with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to textarea with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to textarea with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to textarea with reference target
Pass button.form has reflection behavior IsNull when pointing to textarea with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to div with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to div with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to div with reference target
Pass button.form has reflection behavior IsNull when pointing to div with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to object with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to object with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to object with reference target
Pass button.form has reflection behavior IsNull when pointing to object with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to label with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to label with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to label with reference target
Pass button.form has reflection behavior IsNull when pointing to label with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to fieldset with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to fieldset with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to fieldset with reference target
Pass button.form has reflection behavior IsNull when pointing to fieldset with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to legend with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to legend with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to legend with reference target
Pass button.form has reflection behavior IsNull when pointing to legend with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to option with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to option with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to option with reference target
Pass button.form has reflection behavior IsNull when pointing to option with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to datalist with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to datalist with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to datalist with reference target
Pass button.form has reflection behavior IsNull when pointing to datalist with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to form with reference target
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to form with reference target
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to form with reference target
Fail button.form has reflection behavior ReflectsHost when pointing to form with reference target
Pass input.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to button with reference target
@ -470,48 +485,63 @@ Pass form.ariaActiveDescendantElement has reflection behavior ReflectsHost when
Pass form.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to datalist with reference target
Pass form.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to form with reference target
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to button with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to button with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to button with reference target via options
Pass button.form has reflection behavior IsNull when pointing to button with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to input with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to input with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to input with reference target via options
Pass button.form has reflection behavior IsNull when pointing to input with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to meter with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to meter with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to meter with reference target via options
Pass button.form has reflection behavior IsNull when pointing to meter with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to output with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to output with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to output with reference target via options
Pass button.form has reflection behavior IsNull when pointing to output with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to progress with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to progress with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to progress with reference target via options
Pass button.form has reflection behavior IsNull when pointing to progress with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to select with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to select with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to select with reference target via options
Pass button.form has reflection behavior IsNull when pointing to select with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to textarea with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to textarea with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to textarea with reference target via options
Pass button.form has reflection behavior IsNull when pointing to textarea with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to div with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to div with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to div with reference target via options
Pass button.form has reflection behavior IsNull when pointing to div with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to object with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to object with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to object with reference target via options
Pass button.form has reflection behavior IsNull when pointing to object with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to label with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to label with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to label with reference target via options
Pass button.form has reflection behavior IsNull when pointing to label with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to fieldset with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to fieldset with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to fieldset with reference target via options
Pass button.form has reflection behavior IsNull when pointing to fieldset with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to legend with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to legend with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to legend with reference target via options
Pass button.form has reflection behavior IsNull when pointing to legend with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to option with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to option with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to option with reference target via options
Pass button.form has reflection behavior IsNull when pointing to option with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to datalist with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to datalist with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to datalist with reference target via options
Pass button.form has reflection behavior IsNull when pointing to datalist with reference target via options
Pass button.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to form with reference target via options
Pass button.commandForElement has reflection behavior ReflectsHost when pointing to form with reference target via options
Pass button.popoverTargetElement has reflection behavior ReflectsHost when pointing to form with reference target via options
Fail button.form has reflection behavior ReflectsHost when pointing to form with reference target via options
Pass input.ariaActiveDescendantElement has reflection behavior ReflectsHost when pointing to button with reference target via options

View file

@ -0,0 +1,88 @@
<!doctype html>
<meta charset="utf-8" />
<meta name="author" title="Keith Cirkel" href="mailto:wpt@keithcirkel.co.uk" />
<link rel="help" href="https://open-ui.org/components/invokers.explainer/" />
<script src="../../../../resources/testharness.js"></script>
<script src="../../../../resources/testharnessreport.js"></script>
<button id="invoker" commandfor="invokee" command="test"></button>
<div id="invokee"></div>
<script>
test(function () {
assert_equals(invoker.commandForElement, invokee);
}, "commandForElement reflects invokee HTML element");
test(function () {
const div = document.body.appendChild(document.createElement("div"));
invoker.commandForElement = div;
assert_equals(invoker.commandForElement, div);
assert_equals(invoker.getAttribute("commandfor"), "");
assert_equals(invoker.getAttribute("command"), "test");
}, "commandForElement reflects set value");
test(function () {
const host = document.body.appendChild(document.createElement("div"));
const shadow = host.attachShadow({ mode: "open" });
const button = shadow.appendChild(document.createElement("button"));
button.commandForElement = invokee;
assert_equals(button.commandForElement, invokee);
assert_equals(invoker.getAttribute("commandfor"), "");
assert_equals(invoker.getAttribute("command"), "test");
}, "commandForElement reflects set value across shadow root into light dom");
test(function () {
const host = document.body.appendChild(document.createElement("div"));
const shadow = host.attachShadow({ mode: "open" });
const div = shadow.appendChild(document.createElement("div"));
invoker.commandForElement = div;
assert_equals(invoker.commandForElement, null);
assert_equals(invoker.getAttribute("commandfor"), "");
assert_equals(invoker.getAttribute("command"), "test");
}, "commandForElement does not reflect set value inside shadowroot");
test(function () {
assert_throws_js(
TypeError,
function () {
invoker.commandForElement = {};
},
"commandForElement attribute must be an instance of Element",
);
}, "commandForElement throws error on assignment of non Element");
test(function () {
invoker.setAttribute("command", "");
assert_equals(invoker.getAttribute("command"), "");
assert_equals(invoker.command, "");
}, "command reflects '' when attribute empty, setAttribute version");
test(function () {
invoker.command = "fooBarBaz";
assert_equals(invoker.getAttribute("command"), "fooBarBaz");
assert_equals(invoker.command, "");
}, "command reflects correctly for invalid");
test(function () {
invoker.command = "";
assert_equals(invoker.getAttribute("command"), "");
assert_equals(invoker.command, "");
}, "command reflects '' when attribute empty, IDL version");
test(function () {
invoker.command = [1, 2, 3];
assert_equals(invoker.getAttribute("command"), "1,2,3");
assert_equals(invoker.command, "");
}, "command reflects correctly for invalid when array");
test(function () {
invoker.command = [];
assert_equals(invoker.getAttribute("command"), "");
assert_equals(invoker.command, "");
}, "command reflects '' when attribute set to []");
test(function () {
invoker.command = {};
assert_equals(invoker.command, "");
}, "command reflects correctly for invalid when object");
</script>