Initial commit: Core packages

odoo-bringout-oca-ocb-web/web/static/tests/mobile/helpers.js

@@ -0,0 +1,124 @@
+/** @odoo-module **/
+
+import { findElement, triggerEvent } from "../helpers/utils";
+
+async function swipe(target, selector, direction) {
+    const touchTarget = findElement(target, selector);
+    if (direction === "left") {
+        // The scrollable element is set at its right limit
+        touchTarget.scrollLeft = touchTarget.scrollWidth - touchTarget.offsetWidth;
+    } else {
+        // The scrollable element is set at its left limit
+        touchTarget.scrollLeft = 0;
+    }
+
+    await triggerEvent(target, selector, "touchstart", {
+        touches: [
+            {
+                identifier: 0,
+                clientX: 0,
+                clientY: 0,
+                target: touchTarget,
+            },
+        ],
+    });
+    await triggerEvent(target, selector, "touchmove", {
+        touches: [
+            {
+                identifier: 0,
+                clientX: (direction === "left" ? -1 : 1) * touchTarget.clientWidth,
+                clientY: 0,
+                target: touchTarget,
+            },
+        ],
+    });
+    await triggerEvent(target, selector, "touchend", {});
+}
+
+/**
+ * Will simulate a swipe right on the target element with the given selector.
+ *
+ * @param {HTMLElement} target
+ * @param {DOMSelector} [selector]
+ * @returns {Promise}
+ */
+export async function swipeRight(target, selector) {
+    return swipe(target, selector, "right");
+}
+
+/**
+ * Will simulate a swipe left on the target element with the given selector.
+ *
+ * @param {HTMLElement} target
+ * @param {DOMSelector} [selector]
+ * @returns {Promise}
+ */
+export async function swipeLeft(target, selector) {
+    return swipe(target, selector, "left");
+}
+
+/**
+ * Simulate a "TAP" (touch) on the target element with the given selector.
+ *
+ * @param {HTMLElement} target
+ * @param {DOMSelector} [selector]
+ * @returns {Promise}
+ */
+export async function tap(target, selector) {
+    const touchTarget = findElement(target, selector);
+    const box = touchTarget.getBoundingClientRect();
+    const x = box.left + box.width / 2;
+    const y = box.top + box.height / 2;
+    const touch = {
+        identifier: 0,
+        target: touchTarget,
+        clientX: x,
+        clientY: y,
+        pageX: x,
+        pageY: y,
+    };
+    await triggerEvent(touchTarget, null, "touchstart", {
+        touches: [touch],
+    });
+    await triggerEvent(touchTarget, null, "touchend", {});
+}
+
+/**
+ * Simulate a "TAP" (touch) on the target element with the given selector.
+ *
+ * @param {HTMLElement} target
+ * @param {DOMSelector} startSelector
+ * @param {DOMSelector} endSelector
+ * @param {{start: "center"|"top", end: "center"|"bottom"}} [positions]
+ *  Specify where the touches will occur in the start and end elements.
+ * @returns {Promise}
+ */
+export async function tapAndMove(
+    target,
+    startSelector,
+    endSelector,
+    positions = { start: "center", end: "center" }
+) {
+    const startTarget = findElement(target, startSelector);
+    const startBox = startTarget.getBoundingClientRect();
+
+    const touch = {
+        identifier: 0,
+        target: startTarget,
+        pageX: startBox.x + startBox.width / 2,
+        pageY: positions.start === "center" ? startBox.y + startBox.height / 2 : startBox.y + 1,
+    };
+    await triggerEvent(startTarget, null, "touchstart", {
+        touches: [touch],
+    });
+    const endTarget = findElement(target, endSelector);
+    const endBox = endTarget.getBoundingClientRect();
+    touch.pageX = endBox.x + endBox.width / 2;
+    touch.pageY = positions.end === "center" ? endBox.y + endBox.height / 2 : endBox.y - 1;
+    await triggerEvent(startTarget, null, "touchmove", {
+        touches: [touch],
+    });
+    await triggerEvent(startTarget, null, "touchend", {
+        touches: [touch],
+    });
+}