summaryrefslogtreecommitdiffstats
path: root/dom/events/test/window_bug1429572.html
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--dom/events/test/window_bug1429572.html351
1 files changed, 351 insertions, 0 deletions
diff --git a/dom/events/test/window_bug1429572.html b/dom/events/test/window_bug1429572.html
new file mode 100644
index 0000000000..694794b1e4
--- /dev/null
+++ b/dom/events/test/window_bug1429572.html
@@ -0,0 +1,351 @@
+<html>
+ <head>
+ <title></title>
+ <script src="/tests/SimpleTest/EventUtils.js"></script>
+ <script>
+ var tests = [
+ simpleNonShadowTest,
+ nonShadowInputDate,
+ jsDispatchedNonShadowTouchEvents,
+ shadowDOMTest1,
+ shadowDOMTest2,
+ shadowDOMTest3,
+ jsDispatchedShadowTouchEvents,
+ jsDispatchedShadowTouchEvents2
+ ];
+ var host;
+ var host2;
+ var shadowRoot;
+ var shadowRoot2;
+ var winUtils;
+
+ var touchCounter = 0;
+ function createTouchArray(targetList) {
+ var touchArray = [];
+ for (var i = 0; i < targetList.length; ++i) {
+ touchArray.push(new Touch({identifier: ++touchCounter, target: targetList[i]}));
+ }
+ return touchArray;
+ }
+
+ function synthesizeTouches(targets, xOffsets) {
+ if (xOffsets) {
+ opener.is(targets.length, xOffsets.length, "Wrong xOffsets length!");
+ }
+ var touches = [];
+ var xs = [];
+ var ys = [];
+ var rxs = [];
+ var rys = [];
+ var angles = [];
+ var forces = [];
+ var tiltXs = [];
+ var tiltYs = [];
+ var twists = [];
+ for (var i = 0; i < targets.length; ++i) {
+ touches.push(++touchCounter);
+ var rect = targets[i].getBoundingClientRect();
+ if (xOffsets) {
+ xs.push(rect.left + (rect.width / 2) + xOffsets[i]);
+ } else {
+ xs.push(rect.left + (rect.width / 2));
+ }
+ ys.push(rect.top + (rect.height / 2));
+ rxs.push(1);
+ rys.push(1);
+ angles.push(0);
+ forces.push(1);
+ tiltXs.push(0);
+ tiltYs.push(0);
+ twists.push(0);
+ }
+ winUtils.sendTouchEvent("touchstart",
+ touches, xs, ys, rxs, rys, angles, forces, tiltXs, tiltYs, twists, 0);
+ winUtils.sendTouchEvent("touchend",
+ touches, xs, ys, rxs, rys, angles, forces, tiltXs, tiltYs, twists, 0);
+ }
+
+ function next() {
+ if (!tests.length) {
+ opener.done();
+ window.close();
+ } else {
+ var test = tests.shift();
+ requestAnimationFrame(function() { setTimeout(test); });
+ }
+ }
+
+ function simpleNonShadowTest() {
+ var s1 = document.getElementById("span1");
+ var s2 = document.getElementById("span2");
+ var s3 = document.getElementById("span3");
+ var nonShadow = document.getElementById("nonshadow");
+ var event;
+ nonShadow.ontouchstart = function(e) {
+ event = e;
+ opener.is(e.targetTouches.length, 1, "Should have only one entry in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain event.target.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ synthesizeTouches([s1, s2, s3]);
+
+ opener.is(event.targetTouches.length, 1, "Should have only one entry in targetTouches. (2)");
+ opener.is(event.targetTouches[0].target, event.target, "targetTouches should contain event.target. (2)");
+ opener.is(event.touches.length, 3, "touches list should contain all the touch objects. (2)");
+ opener.is(event.changedTouches.length, 3, "changedTouches list should contain all the touch objects. (2)");
+
+ next();
+ }
+
+ function jsDispatchedNonShadowTouchEvents() {
+ var s1 = document.getElementById("span1");
+ var s2 = document.getElementById("span2");
+ var s3 = document.getElementById("span3");
+ var nonShadow = document.getElementById("nonshadow");
+ var didCallListener = false;
+ nonShadow.ontouchstart = function(e) {
+ didCallListener = true;
+ opener.is(e.targetTouches.length, 3, "Should have all the entries in targetTouches.");
+ opener.is(e.targetTouches[0].target, s1, "targetTouches should contain s1 element.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ var touchArray = createTouchArray([s1, s2, s3]);
+ var touchEvent = new TouchEvent("touchstart",
+ {
+ touches: touchArray,
+ targetTouches: touchArray,
+ changedTouches: touchArray
+ });
+ opener.is(touchEvent.targetTouches.length, 3, "Should have 3 entries in targetTouches");
+ nonShadow.dispatchEvent(touchEvent);
+ opener.ok(didCallListener, "Should have called the listener.");
+ opener.is(touchEvent.targetTouches.length, 3, "Should have all the entries in targetTouches. (2)");
+ opener.is(touchEvent.targetTouches[0].target, s1, "targetTouches should contain s1 element. (2)");
+ opener.is(touchEvent.touches.length, 3, "touches list should contain all the touch objects. (2)");
+ opener.is(touchEvent.changedTouches.length, 3, "changedTouches list should contain all the touch objects. (2)");
+
+ nonShadow.ontouchstart = null;
+ next();
+ }
+
+ function nonShadowInputDate() {
+ // This is a test for dispathing several touches to an element with
+ // native anonymous content.
+ var s1 = document.getElementById("span1");
+ var date = document.getElementById("date");
+ var nonShadow = document.getElementById("nonshadow");
+ var hasDateAsTarget = false;
+ var didCallListener = false;
+ nonShadow.ontouchstart = function(e) {
+ didCallListener = true;
+ if (e.targetTouches[0].target == date) {
+ hasDateAsTarget = true;
+ opener.is(e.targetTouches.length, 2, "Should have two entries in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain date.");
+ opener.is(e.targetTouches[1].target, e.target, "targetTouches should contain date twice.");
+ }
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+
+ var rect = date.getBoundingClientRect();
+ var quarter = rect.width / 4;
+ synthesizeTouches([date, date, s1], [-quarter, quarter, 0]);
+ opener.ok(didCallListener, "Should have called listener.");
+ opener.ok(hasDateAsTarget, "Should have seen touchstart with date element as the target.")
+ nonShadow.ontouchstart = null;
+ next();
+ }
+
+ function shadowDOMTest1() {
+ var shadowS1 = shadowRoot.getElementById("shadowSpan1");
+
+ // Ensure retargeting works.
+ var hostHandled = false;
+ host.ontouchstart = function(e) {
+ hostHandled = true;
+ opener.is(e.targetTouches.length, 1, "Should have only one entry in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain event.target.");
+ opener.is(e.target, host, "Event and touch should have been retargeted.");
+ opener.is(e.touches.length, 1, "touches list should contain one touch object.");
+ opener.is(e.changedTouches.length, 1, "changedTouches list should contain one touch objects.");
+ }
+
+ // Ensure retargeting doesn't happen inside shadow DOM.
+ var shadowHandled = false;
+ shadowS1.ontouchstart = function(e) {
+ shadowHandled = true;
+ opener.is(e.targetTouches.length, 1, "Should have only one entry in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain event.target.");
+ opener.is(e.target, shadowS1, "Event and touch should not have been retargeted.");
+ opener.is(e.touches.length, 1, "touches list should contain one touch object.");
+ opener.is(e.changedTouches.length, 1, "changedTouches list should contain one touch objects.");
+ }
+ synthesizeTouches([shadowS1]);
+ opener.ok(hostHandled, "Should have called listener on host.");
+ opener.ok(shadowHandled, "Should have called listener on shadow DOM element.");
+ host.ontouchstart = null;
+ shadowS1.ontouchstart = null;
+
+ next();
+ }
+
+ function shadowDOMTest2() {
+ var shadowS1 = shadowRoot.getElementById("shadowSpan1");
+ var shadowS2 = shadowRoot.getElementById("shadowSpan2");
+ var s1 = document.getElementById("span1");
+
+ var hostHandled = false;
+ host.ontouchstart = function(e) {
+ opener.is(e.target, host, "Event.target should be the host element.");
+ hostHandled = true;
+ opener.is(e.targetTouches.length, 2, "Should have two entries in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain event.target.");
+ opener.is(e.targetTouches[1].target, e.target, "targetTouches should contain event.target twice.");
+ opener.is(e.touches.length, 3, "touches list should contain one touch object.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain one touch objects.");
+ }
+
+ synthesizeTouches([shadowS1, shadowS2, s1]);
+ opener.ok(hostHandled, "Should have called listener on host.");
+ host.ontouchstart = null;
+
+ next();
+ }
+
+
+ function shadowDOMTest3() {
+ var shadowS1 = shadowRoot.getElementById("shadowSpan1");
+ var shadowS2 = shadowRoot2.getElementById("shadowSpan2");
+ var s1 = document.getElementById("span1");
+
+ var hostHandled = false;
+ host.ontouchstart = function(e) {
+ opener.is(e.target, host, "Event.target should be the host element.");
+ hostHandled = true;
+ opener.is(e.targetTouches.length, 1, "Should have one entry in targetTouches.");
+ opener.is(e.targetTouches[0].target, e.target, "targetTouches should contain event.target.");
+ opener.is(e.touches.length, 3, "touches list should contain one touch object.");
+ opener.is(e.touches[0].target, host, "Should have retargeted the first Touch object.");
+ opener.is(e.touches[1].target, host2, "Should have retargeted the second Touch object.");
+ opener.is(e.touches[3].target, s1, "Touch object targeted to light DOM should keep its target as is.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain one touch objects.");
+ }
+
+ synthesizeTouches([shadowS1, shadowS2, s1]);
+ opener.ok(hostHandled, "Should have called listener on host.");
+ host.ontouchstart = null;
+
+ next();
+ }
+
+ function jsDispatchedShadowTouchEvents() {
+ var s1 = document.getElementById("span1");
+ var shadowS1 = shadowRoot.getElementById("shadowSpan1");
+ var shadowS2 = shadowRoot.getElementById("shadowSpan2");
+ var hostHandled = false;
+ var shadowHandled = false;
+ host.ontouchstart = function(e) {
+ hostHandled = true;
+ opener.is(e.targetTouches.length, 2, "Should have all the shadow entries in targetTouches.");
+ opener.is(e.targetTouches[0].target, host, "targetTouches shouldn't reveal shadow DOM.");
+ opener.is(e.targetTouches[1].target, host, "targetTouches shouldn't reveal shadow DOM.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ shadowS1.ontouchstart = function(e) {
+ shadowHandled = true;
+ opener.is(e.targetTouches.length, 3, "Should have all the in targetTouches.");
+ opener.is(e.targetTouches[0].target, shadowS1, "targetTouches should contain two shadow elements.");
+ opener.is(e.targetTouches[1].target, shadowS2, "targetTouches should contain two shadow elements.");
+ opener.is(e.targetTouches[2].target, s1, "targetTouches should contain a slight element.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ var touchArray = createTouchArray([shadowS1, shadowS2, s1]);
+ var touchEvent = new TouchEvent("touchstart",
+ {
+ composed: true,
+ touches: touchArray,
+ targetTouches: touchArray,
+ changedTouches: touchArray
+ });
+ opener.is(touchEvent.targetTouches.length, 3, "Should have 3 entries in targetTouches");
+ shadowS1.dispatchEvent(touchEvent);
+ opener.ok(hostHandled, "Should have called listener on host.");
+ opener.ok(shadowHandled, "Should have called listener on shadow DOM element.");
+ host.ontouchstart = null;
+ shadowS1.ontouchstart = null;
+ next();
+ }
+
+ function jsDispatchedShadowTouchEvents2() {
+ var s1 = document.getElementById("span1");
+ var shadowS1 = shadowRoot.getElementById("shadowSpan1");
+ var shadowS2 = shadowRoot2.getElementById("shadowSpan2");
+ var hostHandled = false;
+ var shadowHandled = false;
+ host.ontouchstart = function(e) {
+ hostHandled = true;
+ opener.is(e.targetTouches.length, 1, "Should have one shadow entry in targetTouches.");
+ opener.is(e.targetTouches[0].target, host, "targetTouches shouldn't reveal shadow DOM.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.touches[0].target, host, "Should have retargeted the first Touch object.");
+ opener.is(e.touches[1].target, host2, "Should have retargeted the second Touch object.");
+ opener.is(e.touches[2].target, s1, "Touch object targeted to light DOM should keep its target as is.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ shadowS1.ontouchstart = function(e) {
+ shadowHandled = true;
+ opener.is(e.targetTouches.length, 3, "Should have all the in targetTouches.");
+ opener.is(e.targetTouches[0].target, shadowS1, "targetTouches should contain two shadow elements.");
+ opener.is(e.targetTouches[1].target, shadowS2, "targetTouches should contain two shadow elements.");
+ opener.is(e.targetTouches[2].target, s1, "targetTouches should contain a slight element.");
+ opener.is(e.touches.length, 3, "touches list should contain all the touch objects.");
+ opener.is(e.changedTouches.length, 3, "changedTouches list should contain all the touch objects.");
+ }
+ var touchArray = createTouchArray([shadowS1, shadowS2, s1]);
+ var touchEvent = new TouchEvent("touchstart",
+ {
+ composed: true,
+ touches: touchArray,
+ targetTouches: touchArray,
+ changedTouches: touchArray
+ });
+ opener.is(touchEvent.targetTouches.length, 3, "Should have 3 entries in targetTouches");
+ shadowS1.dispatchEvent(touchEvent);
+ opener.ok(hostHandled, "Should have called listener on host.");
+ opener.ok(shadowHandled, "Should have called listener on shadow DOM element.");
+ host.ontouchstart = null;
+ shadowS1.ontouchstart = null;
+ next();
+ }
+
+ function start() {
+ winUtils = _getDOMWindowUtils(this);
+ host = document.getElementById("host");
+ shadowRoot = host.attachShadow({ mode: "open" });
+ shadowRoot.innerHTML =
+ "<span id='shadowSpan1'>shadowFoo </span><span id='shadowSpan2'>shadowBar </span><span id='shadowSpan3'>shadowBaz </span><slot></slot>";
+
+ host2 = document.getElementById("host2");
+ shadowRoot2 = host2.attachShadow({ mode: "open" });
+ shadowRoot2.innerHTML =
+ "<span id='shadowSpan1'>shadowFoo </span><span id='shadowSpan2'>shadowBar </span><span id='shadowSpan3'>shadowBaz </span><slot></slot>";
+ next();
+ }
+ </script>
+ <style>
+ </style>
+ </head>
+ <body onload="start();">
+ <div id="nonshadow">
+ <span id="span1">foo </span><span id="span2">bar </span><span id="span3"> baz</span>
+ <input type="date" id="date">
+ </div>
+ <div id="host"><span id="assignedNode"> assigned node </span></div>
+ <div id="host2"><span id="assignedNode2"> assigned node 2 </span></div>
+ </body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-03 17:31:34 +0000