Skip to content

Commit 1d5dcf3

Browse files
keithamusmoz-wptsync-bot
authored andcommitted
Bug 1860498 [wpt PR 42679] - Add invoketarget logic for popovers in button DefaultEventHandler, a=testonly
Automatic update from web-platform-tests Add invoketarget logic for popovers in button DefaultEventHandler This adds logic on how buttons with an invoketarget pointing to an element with `popover` should behave, based on the Invokers proposal. See explainer section here: https://open-ui.org/components/invokers.explainer/#defaults. See related spec PR here: whatwg/html#9875 This introduces new behavior just within the HTML Form Control `DefaultEventHandler` function such that: - If an `invoketarget` points to an element with `popover` - If the `invokeaction` is `auto` or `togglePopover`, try to toggle the popover - If the `invokeaction` is `hidePopover`, try to hide the popover - If the `invokeaction` is `showPopover`, try to show the popover If the `invokeaction` is none of the above, then it will fall through the to `HandleInvokeInternal` which is passed the lowercased atom so element subclasses can handle their individual behaviors. Bug: 1494737 Change-Id: Id2ab6faf8782a0fe0ba5c9f05ff562fee640f8b0 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4964940 Reviewed-by: Joey Arhar <jarhar@chromium.org> Reviewed-by: Mason Freed <masonf@chromium.org> Commit-Queue: Luke <lukewarlow156@gmail.com> Cr-Commit-Position: refs/heads/main@{#1215820} -- wpt-commits: a86d7454b3b6c8e33fed6a05b08ff081d62bf680 wpt-pr: 42679
1 parent 129c3c6 commit 1d5dcf3

File tree

1 file changed

+193
-0
lines changed

1 file changed

+193
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
<!doctype html>
2+
<meta charset="utf-8" />
3+
<meta name="author" title="Keith Cirkel" href="mailto:keithamus@github.com" />
4+
<link rel="help" href="https://open-ui.org/components/invokers.explainer/" />
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/testdriver.js"></script>
8+
<script src="/resources/testdriver-actions.js"></script>
9+
<script src="/resources/testdriver-vendor.js"></script>
10+
<script src="resources/invoker-utils.js"></script>
11+
12+
<div id="invokee" popover>
13+
<button id="invokerbutton2" invoketarget="invokee"></button>
14+
</div>
15+
<button id="invokerbutton" invoketarget="invokee"></button>
16+
17+
<script>
18+
// auto
19+
20+
promise_test(async function (t) {
21+
assert_false(invokee.matches(":popover-open"));
22+
await clickOn(invokerbutton);
23+
t.add_cleanup(() => invokee.hidePopover());
24+
assert_true(invokee.matches(":popover-open"));
25+
}, "invoking (as auto) closed popover opens");
26+
27+
promise_test(async function (t) {
28+
assert_false(invokee.matches(":popover-open"));
29+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
30+
once: true,
31+
});
32+
await clickOn(invokerbutton);
33+
t.add_cleanup(() => invokee.hidePopover());
34+
assert_false(invokee.matches(":popover-open"));
35+
}, "invoking (as auto) closed popover with preventDefault does not open");
36+
37+
promise_test(async function (t) {
38+
invokee.showPopover();
39+
assert_true(invokee.matches(":popover-open"));
40+
await clickOn(invokerbutton2);
41+
assert_false(invokee.matches(":popover-open"));
42+
}, "invoking (as auto) open popover closes");
43+
44+
promise_test(async function (t) {
45+
invokee.showPopover();
46+
t.add_cleanup(() => invokee.hidePopover());
47+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
48+
once: true,
49+
});
50+
assert_true(invokee.matches(":popover-open"));
51+
await clickOn(invokerbutton2);
52+
assert_true(invokee.matches(":popover-open"));
53+
}, "invoking (as auto) open popover with preventDefault does not close");
54+
55+
// togglepopover
56+
57+
promise_test(async function (t) {
58+
assert_false(invokee.matches(":popover-open"));
59+
invokerbutton.setAttribute("invokeaction", "togglepopover");
60+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
61+
await clickOn(invokerbutton);
62+
t.add_cleanup(() => invokee.hidePopover());
63+
assert_true(invokee.matches(":popover-open"));
64+
}, "invoking (as togglepopover) closed popover opens");
65+
66+
promise_test(async function (t) {
67+
assert_false(invokee.matches(":popover-open"));
68+
invokerbutton.setAttribute("invokeaction", "tOgGlEpOpOvEr");
69+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
70+
await clickOn(invokerbutton);
71+
t.add_cleanup(() => invokee.hidePopover());
72+
assert_true(invokee.matches(":popover-open"));
73+
}, "invoking (as togglepopover - case insensitive) closed popover opens");
74+
75+
promise_test(async function (t) {
76+
assert_false(invokee.matches(":popover-open"));
77+
invokerbutton.setAttribute("invokeaction", "togglepopover");
78+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
79+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
80+
once: true,
81+
});
82+
await clickOn(invokerbutton);
83+
t.add_cleanup(() => invokee.hidePopover());
84+
assert_false(invokee.matches(":popover-open"));
85+
}, "invoking (as togglepopover) closed popover with preventDefault does not open");
86+
87+
promise_test(async function (t) {
88+
invokee.showPopover();
89+
invokerbutton2.setAttribute("invokeaction", "togglepopover");
90+
t.add_cleanup(() => invokerbutton2.removeAttribute("invokeaction"));
91+
assert_true(invokee.matches(":popover-open"));
92+
await clickOn(invokerbutton2);
93+
assert_false(invokee.matches(":popover-open"));
94+
}, "invoking (as togglepopover) open popover closes");
95+
96+
promise_test(async function (t) {
97+
invokee.showPopover();
98+
t.add_cleanup(() => invokee.hidePopover());
99+
invokerbutton2.setAttribute("invokeaction", "togglepopover");
100+
t.add_cleanup(() => invokerbutton2.removeAttribute("invokeaction"));
101+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
102+
once: true,
103+
});
104+
assert_true(invokee.matches(":popover-open"));
105+
await clickOn(invokerbutton2);
106+
assert_true(invokee.matches(":popover-open"));
107+
}, "invoking (as togglepopover) open popover with preventDefault does not close");
108+
109+
// showpopover
110+
111+
promise_test(async function (t) {
112+
invokerbutton.setAttribute("invokeaction", "showpopover");
113+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
114+
assert_false(invokee.matches(":popover-open"));
115+
await clickOn(invokerbutton);
116+
t.add_cleanup(() => invokee.hidePopover());
117+
assert_true(invokee.matches(":popover-open"));
118+
}, "invoking (as showpopover) closed popover opens");
119+
120+
promise_test(async function (t) {
121+
invokerbutton.setAttribute("invokeaction", "sHoWpOpOvEr");
122+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
123+
assert_false(invokee.matches(":popover-open"));
124+
await clickOn(invokerbutton);
125+
t.add_cleanup(() => invokee.hidePopover());
126+
assert_true(invokee.matches(":popover-open"));
127+
}, "invoking (as showpopover - case insensitive) closed popover opens");
128+
129+
promise_test(async function (t) {
130+
invokerbutton.setAttribute("invokeaction", "showpopover");
131+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
132+
invokee.showPopover();
133+
assert_true(invokee.matches(":popover-open"));
134+
await clickOn(invokerbutton);
135+
t.add_cleanup(() => invokee.hidePopover());
136+
assert_true(invokee.matches(":popover-open"));
137+
}, "invoking (as showpopover) open popover is noop");
138+
139+
promise_test(async function (t) {
140+
invokerbutton.setAttribute("invokeaction", "showpopover");
141+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
142+
assert_false(invokee.matches(":popover-open"));
143+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
144+
once: true,
145+
});
146+
await clickOn(invokerbutton);
147+
t.add_cleanup(() => invokee.hidePopover());
148+
assert_false(invokee.matches(":popover-open"));
149+
}, "invoking (as showpopover) closed popover with preventDefault does not open");
150+
151+
// hidepopover
152+
153+
promise_test(async function (t) {
154+
invokerbutton.setAttribute("invokeaction", "hidepopover");
155+
t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction"));
156+
assert_false(invokee.matches(":popover-open"));
157+
await clickOn(invokerbutton);
158+
assert_false(invokee.matches(":popover-open"));
159+
}, "invoking (as hidepopover) closed popover is noop");
160+
161+
promise_test(async function (t) {
162+
invokerbutton2.setAttribute("invokeaction", "hidepopover");
163+
t.add_cleanup(() => invokerbutton2.removeAttribute("invokeaction"));
164+
invokee.showPopover();
165+
assert_true(invokee.matches(":popover-open"));
166+
await clickOn(invokerbutton2);
167+
t.add_cleanup(() => invokee.hidePopover());
168+
assert_false(invokee.matches(":popover-open"));
169+
}, "invoking (as hidepopover) open popover closes");
170+
171+
promise_test(async function (t) {
172+
invokerbutton2.setAttribute("invokeaction", "hIdEpOpOvEr");
173+
t.add_cleanup(() => invokerbutton2.removeAttribute("invokeaction"));
174+
invokee.showPopover();
175+
assert_true(invokee.matches(":popover-open"));
176+
await clickOn(invokerbutton2);
177+
t.add_cleanup(() => invokee.hidePopover());
178+
assert_false(invokee.matches(":popover-open"));
179+
}, "invoking (as hidepopover - case insensitive) open popover closes");
180+
181+
promise_test(async function (t) {
182+
invokerbutton2.setAttribute("invokeaction", "hidepopover");
183+
t.add_cleanup(() => invokerbutton2.removeAttribute("invokeaction"));
184+
invokee.showPopover();
185+
t.add_cleanup(() => invokee.hidePopover());
186+
assert_true(invokee.matches(":popover-open"));
187+
invokee.addEventListener("invoke", (e) => e.preventDefault(), {
188+
once: true,
189+
});
190+
await clickOn(invokerbutton2);
191+
assert_true(invokee.matches(":popover-open"));
192+
}, "invoking (as hidepopover) open popover with preventDefault does not close");
193+
</script>

0 commit comments

Comments
 (0)