diff options
Diffstat (limited to 'testing/web-platform/tests/html/semantics/invokers/invoketarget-on-details-behavior.tentative.html')
-rw-r--r-- | testing/web-platform/tests/html/semantics/invokers/invoketarget-on-details-behavior.tentative.html | 218 |
1 files changed, 218 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/invokers/invoketarget-on-details-behavior.tentative.html b/testing/web-platform/tests/html/semantics/invokers/invoketarget-on-details-behavior.tentative.html new file mode 100644 index 0000000000..c6735e2611 --- /dev/null +++ b/testing/web-platform/tests/html/semantics/invokers/invoketarget-on-details-behavior.tentative.html @@ -0,0 +1,218 @@ +<!doctype html> +<meta charset="utf-8" /> +<meta name="author" title="Luke Warlow" href="mailto:luke@warlow.dev" /> +<link rel="help" href="https://open-ui.org/components/invokers.explainer/" /> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/resources/testdriver.js"></script> +<script src="/resources/testdriver-actions.js"></script> +<script src="/resources/testdriver-vendor.js"></script> +<script src="resources/invoker-utils.js"></script> + +<details id="invokee"> + Details Contents +</details> +<button id="invokerbutton" invoketarget="invokee"></button> + +<script> + // auto + + promise_test(async function (t) { + assert_false(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking closed details with auto action opens"); + + promise_test(async function (t) { + assert_false(invokee.matches("[open]")); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_false(invokee.matches("[open]")); + }, "invoking closed details with auto action and preventDefault does not open"); + + promise_test(async function (t) { + invokee.setAttribute('open', ''); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_false(invokee.matches("[open]")); + }, "invoking open details with auto action closes"); + + promise_test(async function (t) { + invokee.setAttribute('open', ''); + t.add_cleanup(() => invokee.removeAttribute('open')); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_true(invokee.matches("[open]")); + }, "invoking open details with auto action and preventDefault does not close"); + + promise_test(async function (t) { + t.add_cleanup(() => invokee.removeAttribute('open')); + invokee.addEventListener("invoke", (e) => { + invokee.setAttribute('open', ''); + }, { + once: true, + }); + assert_false(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_false(invokee.matches("[open]")); + }, "invoking details with auto action where event listener opens leads to a closed details"); + + promise_test(async function (t) { + invokee.setAttribute('open', ''); + t.add_cleanup(() => invokee.removeAttribute('open')); + invokee.addEventListener("invoke", (e) => { + invokee.removeAttribute('open'); + }, { + once: true, + }); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_true(invokee.matches("[open]")); + }, "invoking open details with auto action where event listener closes leads to an open details"); + + // toggle + + promise_test(async function (t) { + assert_false(invokee.matches("[open]")); + invokerbutton.setAttribute("invokeaction", "toggle"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking closed details with toggle action opens"); + + promise_test(async function (t) { + assert_false(invokee.matches("[open]")); + invokerbutton.setAttribute("invokeaction", "tOgGlE"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking closed details with toggle (case-insensitive) action opens"); + + promise_test(async function (t) { + assert_false(invokee.matches("[open]")); + invokerbutton.setAttribute("invokeaction", "toggle"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_false(invokee.matches("[open]")); + }, "invoking closed details with toggle action and preventDefault does not open"); + + promise_test(async function (t) { + invokee.setAttribute('open', ''); + invokerbutton.setAttribute("invokeaction", "toggle"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_false(invokee.matches("[open]")); + }, "invoking open details with toggle action closes"); + + promise_test(async function (t) { + invokee.setAttribute('open', ''); + t.add_cleanup(() => invokee.removeAttribute('open')); + invokerbutton.setAttribute("invokeaction", "toggle"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_true(invokee.matches("[open]")); + }, "invoking open details with toggle action and preventDefault does not close"); + + // open + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "open"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + assert_false(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking closed details with open action opens"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "oPeN"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + assert_false(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking closed details with open (case insensitive) action opens"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "open"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.setAttribute('open', ''); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + }, "invoking open details with open action is noop"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "open"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + assert_false(invokee.matches("[open]")); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_false(invokee.matches("[open]")); + }, "invoking closed popover with open action and preventDefault does not open"); + + // close + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "close"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + assert_false(invokee.matches("[open]")); + await clickOn(invokerbutton); + assert_false(invokee.matches("[open]")); + }, "invoking closed details with close action is noop"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "close"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.setAttribute('open', ''); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_false(invokee.matches("[open]")); + }, "invoking open details with close action closes"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "cLoSe"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.setAttribute('open', ''); + assert_true(invokee.matches("[open]")); + await clickOn(invokerbutton); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_false(invokee.matches("[open]")); + }, "invoking open details with close (case insensitive) action closes"); + + promise_test(async function (t) { + invokerbutton.setAttribute("invokeaction", "close"); + t.add_cleanup(() => invokerbutton.removeAttribute("invokeaction")); + invokee.setAttribute('open', ''); + t.add_cleanup(() => invokee.removeAttribute('open')); + assert_true(invokee.matches("[open]")); + invokee.addEventListener("invoke", (e) => e.preventDefault(), { + once: true, + }); + await clickOn(invokerbutton); + assert_true(invokee.matches("[open]")); + }, "invoking open details with close action with preventDefault does not close"); +</script> |