diff options
Diffstat (limited to 'testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover.tentative.html')
-rw-r--r-- | testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover.tentative.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover.tentative.html b/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover.tentative.html new file mode 100644 index 0000000000..a26d026649 --- /dev/null +++ b/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover.tentative.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<title>HTMLSelectListElement Test: popover</title> +<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> + +<selectlist id="selectList0"> + <option>one</option> + <option id="selectList0-child2">two</option> + <option>three</option> + <option>four</option> +</selectlist> + +<selectlist id="selectList1"> + <button type=selectlist class=button> + Custom button + </button> + <listbox> + <option>one</option> + <option class="child2">two</option> + <option class="child3">three</option> + </listbox> +</selectlist> + +<selectlist id="selectList2"> + <!-- Swap out the listbox part without providing a replacement --> + <div slot="listbox"></div> +</selectlist> + +<selectlist id="selectList3"> + <div slot="listbox"> + <div popover behavior="listbox" id="selectList3-listbox"> + <option>one</option> + </div> + </div> +</selectlist> +<script> + + function clickOn(element) { + const actions = new test_driver.Actions(); + return actions.pointerMove(0, 0, {origin: element}) + .pointerDown({button: actions.ButtonType.LEFT}) + .pointerUp({button: actions.ButtonType.LEFT}) + .send(); + } + + promise_test(async () => { + const selectList0 = document.getElementById("selectList0"); + const selectList0Child2 = document.getElementById("selectList0-child2"); + assert_equals(selectList0.value, "one"); + assert_equals(selectList0.open, false); + await clickOn(selectList0); + assert_equals(selectList0.open, true); + await clickOn(selectList0Child2); + assert_equals(selectList0.value, "two"); + assert_equals(selectList0.open, false); + + await clickOn(selectList0); + assert_equals(selectList0.open, true); + await clickOn(selectList0Child2); + assert_equals(selectList0.open, false); + }, "Opening the popover and clicking an option should change the selectlist's value"); + + promise_test(async () => { + const selectList1 = document.getElementById("selectList1"); + const button = selectList1.querySelector(".button"); + const child2 = selectList1.querySelector(".child2"); + const child3 = selectList1.querySelector(".child3"); + assert_equals(selectList1.value, "one"); + assert_equals(selectList1.open, false); + await clickOn(button); + assert_equals(selectList1.open, true); + await clickOn(child2); + assert_equals(selectList1.value, "two", "Clicking an <option> should change the value"); + assert_equals(selectList1.open, false); + + await clickOn(button); + assert_equals(selectList1.open, true); + await clickOn(child3); + assert_equals(selectList1.value, "three", "Clicking a <div part='option'> should change the value"); + assert_equals(selectList1.open, false); + }, "With custom button and popover: opening the popover and clicking an option should change the selectlist's value"); + + promise_test(async () => { + const selectList2 = document.getElementById("selectList2"); + await clickOn(selectList2); + assert_equals(selectList2.value, ""); + assert_equals(selectList2.open, false); + }, "Clicking a popover with no listbox part does nothing"); + + promise_test(async () => { + const selectList3 = document.getElementById("selectList3"); + const selectList3Listbox = document.getElementById("selectList3-listbox"); + selectList3Listbox.remove(); + + await clickOn(selectList3); + assert_equals(selectList3.value, ""); + assert_equals(selectList3.open, false); + }, "Clicking a popover with a listbox that was removed does nothing"); +</script> |