summaryrefslogtreecommitdiffstats
path: root/remote/cdp/test/browser/input/doc_events.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /remote/cdp/test/browser/input/doc_events.html
parentInitial commit. (diff)
downloadfirefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz
firefox-26a029d407be480d791972afb5975cf62c9360a6.zip
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'remote/cdp/test/browser/input/doc_events.html')
-rw-r--r--remote/cdp/test/browser/input/doc_events.html148
1 files changed, 148 insertions, 0 deletions
diff --git a/remote/cdp/test/browser/input/doc_events.html b/remote/cdp/test/browser/input/doc_events.html
new file mode 100644
index 0000000000..74df931233
--- /dev/null
+++ b/remote/cdp/test/browser/input/doc_events.html
@@ -0,0 +1,148 @@
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>Input Events</title>
+ <style>
+ div { padding:0px; margin: 0px; }
+ #trackPointer { position: fixed; }
+ #resultContainer { width: 600px; height: 60px; }
+ .area { width: 100px; height: 50px; background-color: #ccc; }
+ .block { width: 5px; height: 5px; border: solid 1px red; }
+ #dragArea { position: relative; }
+ #dragTarget { position: absolute; top:22px; left:47px;}
+ </style>
+ <script>
+ "use strict";
+ var allEvents = [];
+ function makeParagraph(message) {
+ let paragraph = document.createElement("p");
+ paragraph.textContent = message;
+ return paragraph;
+ }
+ function displayMessage(message) {
+ let eventNode = document.getElementById("events");
+ eventNode.innerHTML = ""
+ eventNode.appendChild(makeParagraph(message));
+ }
+
+ function appendMessage(message) {
+ document.getElementById("events").appendChild(makeParagraph(message));
+ }
+
+ /**
+ * Escape |key| if it's in a surrogate-half character range.
+ *
+ * Example: given "\ud83d" return "U+d83d".
+ *
+ * Otherwise JSON.stringify will convert it to U+FFFD (REPLACEMENT CHARACTER)
+ * when returning a value from executeScript, for example.
+ */
+ function escapeSurrogateHalf(key) {
+ if (typeof key !== "undefined" && key.length === 1) {
+ var charCode = key.charCodeAt(0);
+ var highSurrogate = charCode >= 0xD800 && charCode <= 0xDBFF;
+ var surrogate = highSurrogate || (charCode >= 0xDC00 && charCode <= 0xDFFF);
+ if (surrogate) {
+ key = "U+" + charCode.toString(16);
+ }
+ }
+ return key;
+ }
+
+ function recordKeyboardEvent(event) {
+ var key = escapeSurrogateHalf(event.key);
+ allEvents.push({
+ "code": event.code,
+ "key": key,
+ "which": event.which,
+ "location": event.location,
+ "alt": event.altKey,
+ "ctrl": event.ctrlKey,
+ "meta": event.metaKey,
+ "shift": event.shiftKey,
+ "repeat": event.repeat,
+ "type": event.type
+ });
+ appendMessage(event.type + " " +
+ "code: " + event.code + ", " +
+ "key: " + key + ", " +
+ "which: " + event.which + ", " +
+ "keyCode: " + event.keyCode);
+ }
+ function recordInputEvent(event) {
+ allEvents.push({
+ "data": event.data,
+ "inputType": event.inputType,
+ "isComposing": event.isComposing,
+ });
+ appendMessage("InputEvent " +
+ "data: " + event.data + ", " +
+ "inputType: " + event.inputType + ", " +
+ "isComposing: " + event.isComposing);
+ }
+ function recordPointerEvent(event) {
+ if (event.type === "contextmenu") {
+ event.preventDefault();
+ }
+ allEvents.push({
+ "type": event.type,
+ "button": event.button,
+ "buttons": event.buttons,
+ "pageX": event.pageX,
+ "pageY": event.pageY,
+ "ctrlKey": event.ctrlKey,
+ "metaKey": event.metaKey,
+ "altKey": event.altKey,
+ "shiftKey": event.shiftKey,
+ "target": event.target.id
+ });
+ appendMessage(event.type + " " +
+ "pageX: " + event.pageX + ", " +
+ "pageY: " + event.pageY + ", " +
+ "button: " + event.button + ", " +
+ "buttons: " + event.buttons + ", " +
+ "ctrlKey: " + event.ctrlKey + ", " +
+ "altKey: " + event.altKey + ", " +
+ "metaKey: " + event.metaKey + ", " +
+ "shiftKey: " + event.shiftKey + ", " +
+ "target id: " + event.target.id);
+ }
+ function resetEvents() {
+ allEvents.length = 0;
+ displayMessage("");
+ }
+
+ document.addEventListener("DOMContentLoaded", function() {
+ let keyReporter = document.getElementById("keys");
+ keyReporter.addEventListener("keyup", recordKeyboardEvent);
+ keyReporter.addEventListener("keypress", recordKeyboardEvent);
+ keyReporter.addEventListener("keydown", recordKeyboardEvent);
+ keyReporter.addEventListener("input", recordInputEvent);
+
+ let mouseReporter = document.getElementById("pointers");
+ mouseReporter.addEventListener("click", recordPointerEvent);
+ mouseReporter.addEventListener("dblclick", recordPointerEvent);
+ mouseReporter.addEventListener("mousedown", recordPointerEvent);
+ mouseReporter.addEventListener("mouseup", recordPointerEvent);
+ mouseReporter.addEventListener("contextmenu", recordPointerEvent);
+ });
+ </script>
+</head>
+<body>
+ <div id="trackPointer" class="block"></div>
+ <div>
+ <h2>KeyReporter</h2>
+ <input type="text" id="keys" size="80">
+ </div>
+ <div>
+ <h2>ClickReporter</h2>
+ <div id="pointers" class="area">
+ </div>
+ </div>
+ <div id="resultContainer">
+ <h2>Events</h2>
+ <div id="events"></div>
+ </div>
+</body>
+</html>