From ee2fe53bf4b960b90a072d65a57b56b797a61289 Mon Sep 17 00:00:00 2001 From: Simon Pieters Date: Wed, 3 Apr 2024 12:10:31 +0200 Subject: [PATCH] UIEvents: Tentative test for textInput with drag and drop See https://github.com/w3c/uievents/issues/367 --- ...ents-contenteditable-manual.tentative.html | 19 ++++++++++++ ...ditable-same-element-manual.tentative.html | 15 +++++++++ .../drop/events-input-manual.tentative.html | 16 ++++++++++ ...s-input-same-element-manual.tentative.html | 15 +++++++++ .../events-textarea-manual.tentative.html | 16 ++++++++++ ...extarea-same-element-manual.tentative.html | 15 +++++++++ html/editing/dnd/drop/support/events.js | 31 +++++++++++++++++++ 7 files changed, 127 insertions(+) create mode 100644 html/editing/dnd/drop/events-contenteditable-manual.tentative.html create mode 100644 html/editing/dnd/drop/events-contenteditable-same-element-manual.tentative.html create mode 100644 html/editing/dnd/drop/events-input-manual.tentative.html create mode 100644 html/editing/dnd/drop/events-input-same-element-manual.tentative.html create mode 100644 html/editing/dnd/drop/events-textarea-manual.tentative.html create mode 100644 html/editing/dnd/drop/events-textarea-same-element-manual.tentative.html create mode 100644 html/editing/dnd/drop/support/events.js diff --git a/html/editing/dnd/drop/events-contenteditable-manual.tentative.html b/html/editing/dnd/drop/events-contenteditable-manual.tentative.html new file mode 100644 index 00000000000000..9e513eb836fc78 --- /dev/null +++ b/html/editing/dnd/drop/events-contenteditable-manual.tentative.html @@ -0,0 +1,19 @@ + + +Selection drag and drop: events for contenteditable + + + + +
+
+ + diff --git a/html/editing/dnd/drop/events-contenteditable-same-element-manual.tentative.html b/html/editing/dnd/drop/events-contenteditable-same-element-manual.tentative.html new file mode 100644 index 00000000000000..907306301fa0b3 --- /dev/null +++ b/html/editing/dnd/drop/events-contenteditable-same-element-manual.tentative.html @@ -0,0 +1,15 @@ + + +Selection drag and drop: events for contenteditable (same element) + + + +
Drag me ...to here:
+ + diff --git a/html/editing/dnd/drop/events-input-manual.tentative.html b/html/editing/dnd/drop/events-input-manual.tentative.html new file mode 100644 index 00000000000000..2f9914cca957db --- /dev/null +++ b/html/editing/dnd/drop/events-input-manual.tentative.html @@ -0,0 +1,16 @@ + + +Selection drag and drop: events for <input> + + + +
+
+ + diff --git a/html/editing/dnd/drop/events-input-same-element-manual.tentative.html b/html/editing/dnd/drop/events-input-same-element-manual.tentative.html new file mode 100644 index 00000000000000..8a578d51ad6b5a --- /dev/null +++ b/html/editing/dnd/drop/events-input-same-element-manual.tentative.html @@ -0,0 +1,15 @@ + + +Selection drag and drop: events for <input> (same element) + + + + + + diff --git a/html/editing/dnd/drop/events-textarea-manual.tentative.html b/html/editing/dnd/drop/events-textarea-manual.tentative.html new file mode 100644 index 00000000000000..7fb8bf437f8e4e --- /dev/null +++ b/html/editing/dnd/drop/events-textarea-manual.tentative.html @@ -0,0 +1,16 @@ + + +Selection drag and drop: events for <textarea> + + + +
+
+ + diff --git a/html/editing/dnd/drop/events-textarea-same-element-manual.tentative.html b/html/editing/dnd/drop/events-textarea-same-element-manual.tentative.html new file mode 100644 index 00000000000000..c856fd4fbead23 --- /dev/null +++ b/html/editing/dnd/drop/events-textarea-same-element-manual.tentative.html @@ -0,0 +1,15 @@ + + +Selection drag and drop: events for <textarea> (same element) + + + + + + diff --git a/html/editing/dnd/drop/support/events.js b/html/editing/dnd/drop/support/events.js new file mode 100644 index 00000000000000..015cead3853c10 --- /dev/null +++ b/html/editing/dnd/drop/support/events.js @@ -0,0 +1,31 @@ +setup({ explicit_timeout: true, single_test: true }); +function rAF() { + return new Promise(resolve => { + requestAnimationFrame(resolve); + }); +} +const a = document.getElementById('a'); +const b = document.getElementById('b'); +const actualEvents = []; +const expectedEvents = document.body.dataset.expectedEvents.replace(/\s+/g, '').split(','); +const eventTypes = new Set(expectedEvents.map(s => s.split(':')[1])); +for (const eventType of eventTypes) { + if (a) { + a.addEventListener(eventType, e => { + actualEvents.push(`a:${e.type}:${e.inputType || ''}`); + }); + } + b.addEventListener(eventType, async (e) => { + actualEvents.push(`b:${e.type}:${e.inputType || ''}`); + if (e.type === "input") { + await rAF(); + await rAF(); + assert_array_equals(actualEvents, expectedEvents); + done(); + } + }); +} +const dragMeElement = document.querySelector('[data-select]'); +const [selectionStart, selectionEnd] = dragMeElement.dataset.select.split(',').map(s => parseInt(s, 10)); +setSelection(dragMeElement, selectionStart, selectionEnd); +dragMeElement.focus();