David Baron
e9e6d32de2
Automatic update from web-platform-tests Add long timeout annotation to input-change-event-properties.html . Bug: 456694942 Change-Id: I3388d17b94af5866e5efe7a795bca1753cfa05ff Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7106860 Auto-Submit: David Baron <dbaron@chromium.org> Reviewed-by: Joey Arhar <jarhar@chromium.org> Commit-Queue: Joey Arhar <jarhar@chromium.org> Cr-Commit-Position: refs/heads/main@{#1538893} -- wpt-commits: d1ec18209f68b98c7556fe84c8338ed20af63080 wpt-pr: 55806
88 lines
2.8 KiB
HTML
88 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>Test the properties of input and change events</title>
|
|
<meta name="timeout" content="long">
|
|
<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>
|
|
|
|
<fieldset id="clickable">
|
|
<input type="checkbox">
|
|
<input type="radio">
|
|
</fieldset>
|
|
|
|
<fieldset id="typeable">
|
|
<input type="text">
|
|
<input type="search">
|
|
<input type="tel">
|
|
<input type="url">
|
|
<input type="email">
|
|
<input type="password">
|
|
<input type="number">
|
|
<textarea></textarea>
|
|
</fieldset>
|
|
|
|
<select>
|
|
<option>1</option>
|
|
<option>2</option>
|
|
</select>
|
|
|
|
<!-- Not going to test the more complicated input types like date or color for now... -->
|
|
|
|
<button id="click-me-to-unfocus-other-things">Clickable</button>
|
|
|
|
<script>
|
|
"use strict";
|
|
const clickMeToUnfocusOtherThings = document.querySelector("#click-me-to-unfocus-other-things");
|
|
|
|
for (const el of document.querySelector("#clickable").children) {
|
|
test(() => {
|
|
let inputEvent, changeEvent;
|
|
el.oninput = e => inputEvent = e;
|
|
el.onchange = e => changeEvent = e;
|
|
|
|
el.click();
|
|
|
|
assert_event(inputEvent, { bubbles: true, cancelable: false, composed: true });
|
|
assert_event(changeEvent, { bubbles: true, cancelable: false, composed: false });
|
|
}, `${el.outerHTML} click()`);
|
|
}
|
|
|
|
for (const el of document.querySelector("#typeable").children) {
|
|
promise_test(async () => {
|
|
let inputEvent, changeEvent;
|
|
el.oninput = e => inputEvent = e;
|
|
el.onchange = e => changeEvent = e;
|
|
|
|
await test_driver.send_keys(el, "1"); // has to be a number so <input type=number> works
|
|
await test_driver.click(clickMeToUnfocusOtherThings);
|
|
|
|
assert_event(inputEvent, { bubbles: true, cancelable: false, composed: true });
|
|
assert_event(changeEvent, { bubbles: true, cancelable: false, composed: false });
|
|
}, `${el.outerHTML} typing`);
|
|
}
|
|
|
|
promise_test(async () => {
|
|
const el = document.querySelector("select");
|
|
|
|
let inputEvent, changeEvent;
|
|
el.oninput = e => inputEvent = e;
|
|
el.onchange = e => changeEvent = e;
|
|
|
|
// TODO: this doesn't seem to work in Safari/on Macs. Or maybe Safari is legitimately failing.
|
|
// Someone with a Mac should investigate.
|
|
await test_driver.send_keys(el, "\uE015"); // down arrow key
|
|
await test_driver.click(clickMeToUnfocusOtherThings);
|
|
|
|
assert_event(inputEvent, { bubbles: true, cancelable: false, composed: true });
|
|
assert_event(changeEvent, { bubbles: true, cancelable: false, composed: false });
|
|
}, `<select> pressing down arrow`);
|
|
|
|
function assert_event(e, { bubbles, cancelable, composed }) {
|
|
assert_equals(e.bubbles, bubbles, `${e.type} bubbles`);
|
|
assert_equals(e.cancelable, cancelable, `${e.type} cancelable`);
|
|
assert_equals(e.composed, composed, `${e.type} composed`);
|
|
}
|
|
</script>
|