diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html')
-rw-r--r-- | testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html | 135 |
1 files changed, 135 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html b/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html new file mode 100644 index 0000000000..692eed7caa --- /dev/null +++ b/testing/web-platform/tests/html/semantics/forms/the-selectlist-element/selectlist-popover-position-with-zoom.tentative.html @@ -0,0 +1,135 @@ +<!DOCTYPE html> +<html> +<title>HTMLSelectListElement Test: popover position with zoom</title> +<link rel="author" title="Ionel Popescu" href="mailto:iopopesc@microsoft.com"> +<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> + +<style> + #selectList0 { + position: absolute; + top: 0px; + left: 0px; + zoom: 2; + } + + #selectList1 { + position: absolute; + bottom: 0px; + left: 0px; + zoom: 1.5; + } + + #selectList1-popover { + zoom: 2; + } + + #selectList2 { + position: absolute; + top: 0px; + right: 0px; + zoom: 3; + } + + #selectList3 { + position: absolute; + bottom: 0px; + right: 0px; + zoom: 4; + } + + #selectList3-popover { + zoom: 1.5; + } +</style> + +<selectlist id="selectList0"> + <button type=selectlist id="selectList0-button">Custom bottom left</button> + <listbox id="selectList0-popover"> + <option>bottom left</option> + <option>two</option> + <option>three</option> + </listbox> +</selectlist> +<br> + +<selectlist id="selectList1"> + <button type=selectlist id="selectList1-button">Custom top left</button> + <listbox id="selectList1-popover"> + <option>top left</option> + <option>two</option> + <option>three</option> + </listbox> +</selectlist> + +<selectlist id="selectList2"> + <button type=selectlist id="selectList2-button">Custom bottom right</button> + <listbox id="selectList2-popover"> + <option>bottom right</option> + <option>two</option> + <option>three</option> + </listbox> +</selectlist> + +<selectlist id="selectList3"> + <button type=selectlist id="selectList3-button">Custom top right</button> + <listbox id="selectList3-popover"> + <option>top right</option> + <option>two</option> + <option>three</option> + </listbox> +</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 selectList0Popover = document.getElementById("selectList0-popover"); + const selectList0Button = document.getElementById("selectList0-button"); + + await clickOn(selectList0); + assert_equals(Math.abs(Math.trunc(selectList0.getBoundingClientRect().bottom - selectList0Popover.getBoundingClientRect().top)), 0); + assert_equals(Math.abs(Math.trunc(selectList0.getBoundingClientRect().left - selectList0Popover.getBoundingClientRect().left)), 0); + }, "The popover should be bottom left positioned"); + + promise_test(async () => { + const selectList1 = document.getElementById("selectList1"); + const selectList1Popover = document.getElementById("selectList1-popover"); + const selectList1Button = document.getElementById("selectList1-button"); + + selectList1Button.click(); + assert_equals(Math.abs(Math.trunc(selectList1.getBoundingClientRect().top - selectList1Popover.getBoundingClientRect().bottom * 2)), 0); + assert_equals(Math.abs(Math.trunc(selectList1.getBoundingClientRect().left - selectList1Popover.getBoundingClientRect().left * 2)), 0); + }, "The popover should be top left positioned"); + + promise_test(async () => { + const selectList2 = document.getElementById("selectList2"); + const selectList2Popover = document.getElementById("selectList2-popover"); + const selectList2Button = document.getElementById("selectList2-button"); + + selectList2Button.click(); + assert_equals(Math.abs(Math.trunc(selectList2.getBoundingClientRect().bottom - selectList2Popover.getBoundingClientRect().top)), 0); + assert_equals(Math.abs(Math.trunc(selectList2.getBoundingClientRect().right - selectList2Popover.getBoundingClientRect().right)), 0); + }, "The popover should be bottom right positioned"); + + promise_test(async () => { + const selectList3 = document.getElementById("selectList3"); + const selectList3Popover = document.getElementById("selectList3-popover"); + const selectList3Button = document.getElementById("selectList3-button"); + + selectList3Button.click(); + assert_equals(Math.abs(Math.trunc(selectList3.getBoundingClientRect().top - selectList3Popover.getBoundingClientRect().bottom * 1.5)), 0); + assert_equals(Math.abs(Math.trunc(selectList3.getBoundingClientRect().right - selectList3Popover.getBoundingClientRect().right * 1.5)), 0); + }, "The popover should be top right positioned"); + +</script> |