Skip to content

Commit

Permalink
Make customizable select options listen to mouseup
Browse files Browse the repository at this point in the history
mouseup is better than mousedown because it allows the user to click and
drag to choose an option like appearance:auto already does. More
justification here:
whatwg/html#10762 (comment)

Change-Id: Ifa63d497b7dcfbc3d07e19d6a7850bddf57f78fc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6077672
Commit-Queue: Joey Arhar <jarhar@chromium.org>
Reviewed-by: Traian Captan <tcaptan@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1396126}
  • Loading branch information
josepharhar authored and chromium-wpt-export-bot committed Dec 13, 2024
1 parent a8113ca commit 0c1d195
Showing 1 changed file with 9 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -142,14 +142,18 @@
eventList = [];

// Click on an option, with preventDefault
wrapper.addEventListener('click',(e) => e.preventDefault(),{once:true});
wrapper.addEventListener('mouseup',(e) => e.preventDefault(),{once:true});
assert_equals(select.selectedOptions[0].innerText,'two');
await test_driver.click(option1);
assert_true(select.matches(':open'),'click should be cancelled');
assert_events([
'pointerdown on option1 at select', 'pointerdown on option1 at wrapper',
'mousedown on option1 at select', 'mousedown on option1 at wrapper',
'click on option1 at select', 'click on option1 at wrapper',
'focusout on option2 at select', 'focusout on option2 at wrapper',
'focusin on select at select', 'focusin on select at wrapper',
'pointerup on option1 at select', 'pointerup on option1 at wrapper',
'mouseup on option1 at select', 'mouseup on option1 at wrapper',
'click on option1 at select', 'click on option1 at wrapper'
],'click option, with preventDefault');

// Click on an option, no preventDefault
Expand All @@ -159,11 +163,11 @@
assert_events([
'pointerdown on option1 at select', 'pointerdown on option1 at wrapper',
'mousedown on option1 at select', 'mousedown on option1 at wrapper',
'click on option1 at select', 'click on option1 at wrapper',
'pointerup on option1 at select', 'pointerup on option1 at wrapper',
'mouseup on option1 at select', 'mouseup on option1 at wrapper',
'input on select at select', 'input on select at wrapper',
'change on select at select', 'change on select at wrapper',
'focusout on option2 at select', 'focusout on option2 at wrapper',
'focusin on select at select', 'focusin on select at wrapper'
'click on option1 at select', 'click on option1 at wrapper'
],'click option, no preventDefault');
},`Events, ${wrapper.dataset.description}`);
});
Expand Down

0 comments on commit 0c1d195

Please sign in to comment.