diff options
Diffstat (limited to 'dom/events/test/pointerevents/test_remove_frame_when_got_pointer_capture.html')
-rw-r--r-- | dom/events/test/pointerevents/test_remove_frame_when_got_pointer_capture.html | 166 |
1 files changed, 166 insertions, 0 deletions
diff --git a/dom/events/test/pointerevents/test_remove_frame_when_got_pointer_capture.html b/dom/events/test/pointerevents/test_remove_frame_when_got_pointer_capture.html new file mode 100644 index 0000000000..790f2cdd55 --- /dev/null +++ b/dom/events/test/pointerevents/test_remove_frame_when_got_pointer_capture.html @@ -0,0 +1,166 @@ +<!DOCTYPE html> +<html> +<head> + <meta charset="utf-8"> + <title>Test for triggering popup by pointer events</title> + <script src="/tests/SimpleTest/SimpleTest.js"></script> + <script src="/tests/SimpleTest/EventUtils.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> +</head> +<body> +<p id="content"> +</p> +<script> + +SimpleTest.waitForExplicitFinish(); + +function startTest() { + let content = document.getElementById('content'); + let iframe = document.createElement('iframe'); + iframe.width = 200; + iframe.height = 200; + content.appendChild(iframe); + iframe.contentDocument.body.innerHTML = + "<div id='div1' style='width: 50px; height: 50px; background: green'></div>" + + "<div id='div2' style='width: 50px; height: 50px; background: red'></div>"; + + let div1 = iframe.contentDocument.getElementById("div1"); + let div2 = iframe.contentDocument.getElementById("div2"); + let divEvents = [ + "pointerdown", + "gotpointercapture", + "pointermove", + "pointerup", + "lostpointercapture", + "mousedown", + "mousemove", + "mouseup", + ]; + + let documentEvents = [ + "pointerdown", + "pointermove", + "pointerup", + "mousedown", + "mousemove", + "mouseup", + ]; + + divEvents.forEach((event) => { + div1.addEventListener(event, (e) => { + ok(divEvents.includes(e.type), " don't expect " + e.type); + divEvents = divEvents.filter(item => item !== e.type); + }, { once: true }); + }); + + documentEvents.forEach((event) => { + iframe.contentDocument.addEventListener(event, (e) => { + is(e.target, div1, e.type + " should be dispatched to div1"); + }, { once: true }); + }); + + div1.addEventListener("pointerdown", (e) => { + div1.setPointerCapture(e.pointerId); + }); + + div1.addEventListener("gotpointercapture", (e) => { + div1.style.display = "none"; + }); + + info("Tests for mouseup"); + synthesizeMouseAtCenter(div1, {type: "mousedown"}, iframe.contentWindow); + synthesizeMouseAtCenter(div2, {type: "mousemove"}, iframe.contentWindow); + synthesizeMouseAtCenter(div2, {type: "mouseup"}, iframe.contentWindow); + + ok(!divEvents.length, " expect " + divEvents); + + divEvents = [ + "pointerdown", + "gotpointercapture", + "pointermove", + "pointerup", + "lostpointercapture", + "touchstart", + "touchmove", + "touchend", + ]; + + documentEvents = [ + "pointerdown", + "pointermove", + "pointerup", + "touchstart", + "touchmove", + "touchend", + ]; + divEvents.forEach((event) => { + div1.addEventListener(event, (e) => { + ok(divEvents.includes(e.type), " don't expect " + e.type); + divEvents = divEvents.filter(item => item !== e.type); + }, { once: true }); + }); + + documentEvents.forEach((event) => { + iframe.contentDocument.addEventListener(event, (e) => { + is(e.target, div1, e.type + " should be dispatched to div1"); + }, { once: true }); + }); + + info("Tests for touchend"); + div1.style.display = "block"; + synthesizeMouseAtCenter(div1, {type: "mousemove"}, iframe.contentWindow); + synthesizeTouch(div1, 5, 5, { type: "touchstart" }, iframe.contentWindow); + synthesizeTouch(div2, 5, 5, { type: "touchmove" }, iframe.contentWindow); + synthesizeTouch(div2, 5, 5, { type: "touchend" }, iframe.contentWindow); + + ok(!divEvents.length, " expect " + divEvents); + + divEvents = [ + "pointerdown", + "gotpointercapture", + "pointermove", + "pointercancel", + "lostpointercapture", + "touchstart", + "touchmove", + "touchcancel", + ]; + + documentEvents = [ + "pointerdown", + "pointermove", + "pointercancel", + "touchstart", + "touchmove", + "touchcancel", + ]; + divEvents.forEach((event) => { + div1.addEventListener(event, (e) => { + ok(divEvents.includes(e.type), " don't expect " + e.type); + divEvents = divEvents.filter(item => item !== e.type); + }, { once: true }); + }); + + documentEvents.forEach((event) => { + iframe.contentDocument.addEventListener(event, (e) => { + is(e.target, div1, e.type + " should be dispatched to div1"); + }, { once: true }); + }); + + info("Tests for touchcancel"); + div1.style.display = "block"; + synthesizeMouseAtCenter(div1, {type: "mousemove"}, iframe.contentWindow); + synthesizeTouch(div1, 5, 5, { type: "touchstart" }, iframe.contentWindow); + synthesizeTouch(div2, 5, 5, { type: "touchmove" }, iframe.contentWindow); + synthesizeTouch(div2, 5, 5, { type: "touchcancel" }, iframe.contentWindow); + + ok(!divEvents.length, " expect " + divEvents); + + SimpleTest.finish(); +} + +SimpleTest.waitForFocus(startTest); + +</script> +</body> +</html> |