commit 250a7878cda66f2065405a7bd3f1927737230c2e
parent f6b5d31db72c72aa55aad3c40d8ce1ec42169356
Author: Joey Arhar <jarhar@chromium.org>
Date: Tue, 21 Oct 2025 10:38:38 +0000
Bug 1995412 [wpt PR 55521] - Implement Home/End/PageUp/PageDown for customizable listbox, a=testonly
Automatic update from web-platform-tests
Implement Home/End/PageUp/PageDown for customizable listbox
Fixed: 450483229
Change-Id: Id55f9b1893fa03f9510ecafeb4f4caffc59741c3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7029863
Commit-Queue: Joey Arhar <jarhar@chromium.org>
Reviewed-by: Mason Freed <masonf@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1532505}
--
wpt-commits: f1001acce5a68c41b0bf7abc1b3905902813236a
wpt-pr: 55521
Diffstat:
1 file changed, 95 insertions(+), 0 deletions(-)
diff --git a/testing/web-platform/tests/html/semantics/forms/the-select-element/customizable-select-in-page/select-in-page-home-end-pagedown-pageup.optional.html b/testing/web-platform/tests/html/semantics/forms/the-select-element/customizable-select-in-page/select-in-page-home-end-pagedown-pageup.optional.html
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<meta name=timeout content=long>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://issues.chromium.org/issues/450483229">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+
+<!-- This test is optional because the HTML spec does not require that specific
+ behaviors are mapped to specific keyboard buttons. -->
+
+<style>
+select {
+ appearance: base-select;
+}
+</style>
+
+<select id=single size=3></select>
+<select id=multiple multiple size=3></select>
+
+<script>
+const homeKey = '\uE011';
+const endKey = '\uE010';
+const pageUpKey = '\uE00E';
+const pageDownKey = '\uE00F';
+
+function pressKey(key) {
+ return (new test_driver.Actions()
+ .keyDown(key)
+ .keyUp(key))
+ .send();
+}
+
+const numOptions = 50;
+const size = 3;
+
+['single', 'multiple'].forEach(id => {
+ const select = document.getElementById(id);
+ select.innerHTML = '';
+ const options = [];
+ for (let i = 0; i < numOptions; i++) {
+ const option = document.createElement('option');
+ option.textContent = i;
+ options.push(option);
+ select.appendChild(option);
+ }
+
+ const firstTop = options[0].getBoundingClientRect().top;
+ const lastTop = options[2].getBoundingClientRect().top;
+
+ promise_test(async () => {
+ options[0].focus();
+ assert_equals(document.activeElement, options[0],
+ 'The first option should be focused at the start of the test.');
+
+ await pressKey(endKey);
+ assert_equals(document.activeElement, options[numOptions - 1],
+ 'End should focus the last option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, lastTop,
+ 'End should scroll the last option into view.');
+
+ await pressKey(homeKey);
+ assert_equals(document.activeElement, options[0],
+ 'Home should focus the first option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, firstTop,
+ 'Home should scroll the first option into view.');
+
+ await pressKey(pageDownKey);
+ assert_equals(document.activeElement, options[size - 1],
+ 'PageDown should focus the last visible option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, lastTop,
+ 'PageDown should not scroll if the option is already visible.');
+
+ await pressKey(pageDownKey);
+ assert_equals(document.activeElement, options[(size - 1) * 2],
+ 'Second PageDown should focus the next last visible option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, lastTop,
+ 'Second PageDown should scroll the next last visible option into view.');
+
+ await pressKey(pageUpKey);
+ assert_equals(document.activeElement, options[size - 1],
+ 'PageUp should focus the first visible option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, firstTop,
+ 'PageUp should not scroll if the option is already visible.');
+
+ await pressKey(pageUpKey);
+ assert_equals(document.activeElement, options[0],
+ 'Second PageUp should focus the next first visible option.');
+ assert_equals(document.activeElement.getBoundingClientRect().top, firstTop,
+ 'Second pageUp should scroll the next first visible option into view.');
+ }, `${id}: Home/End/PageUp/PageDown should move focus between options and scroll.`);
+});
+</script>
