From c3bd1d6028e721dc2acc7f598026b4608e4e6089 Mon Sep 17 00:00:00 2001
From: Domenic Denicola <d@domenic.me>
Date: Thu, 20 Aug 2020 18:53:09 +0000
Subject: [PATCH] Bug 1658957 [wpt PR 24995] - Add tests for input and change
 event properties, a=testonly

Automatic update from web-platform-tests
Add tests for input and change event properties

See https://github.com/whatwg/html/issues/5453.

The <select> test doesn't appear to work on Safari, but I can't figure out how to fix it without a Mac.
--

wpt-commits: 47f659d346db0b1ed0d336fdee81a16214f2a6d1
wpt-pr: 24995
---
 .../forms/input-change-event-properties.html  | 86 +++++++++++++++++++
 1 file changed, 86 insertions(+)
 create mode 100644 testing/web-platform/tests/html/semantics/forms/input-change-event-properties.html
diff --git a/testing/web-platform/tests/html/semantics/forms/input-change-event-properties.html b/testing/web-platform/tests/html/semantics/forms/input-change-event-properties.html
new file mode 100644
index 000000000000..f3c6f7d4625e
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/forms/input-change-event-properties.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Test the properties of input and change events</title>
+<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>
