107 lines
3.1 KiB
HTML
107 lines
3.1 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width; initial-scale=1.0">
|
|
<title>Test for touchend on media elements</title>
|
|
<script type="application/javascript" src="apz_test_native_event_utils.js"></script>
|
|
<script type="application/javascript" src="apz_test_utils.js"></script>
|
|
<script src="/tests/SimpleTest/paint_listener.js"></script>
|
|
<script type="application/javascript">
|
|
|
|
async function handleTouchStart() {
|
|
let v = document.getElementById("video");
|
|
let d = document.getElementById("div");
|
|
|
|
let e = await new Promise(resolve => {
|
|
document.body.addEventListener("touchstart", resolve, {once: true});
|
|
});
|
|
|
|
if (e.target === v || e.target === d) {
|
|
e.target.style.display = "none";
|
|
ok(true, "Set display to none on #" + e.target.id);
|
|
} else {
|
|
ok(false, "Got unexpected touchstart on " + e.target);
|
|
}
|
|
await promiseAllPaintsDone();
|
|
}
|
|
|
|
async function handleTouchEnd() {
|
|
let v = document.getElementById("video");
|
|
let d = document.getElementById("div");
|
|
|
|
let e = await new Promise(resolve => {
|
|
document.body.addEventListener("touchend", resolve, {once: true});
|
|
});
|
|
|
|
if (e.target === v || e.target === d) {
|
|
e.target._gotTouchend = true;
|
|
ok(true, "Got touchend event on #" + e.target.id);
|
|
}
|
|
}
|
|
|
|
async function test() {
|
|
var v = document.getElementById("video");
|
|
var d = document.getElementById("div");
|
|
|
|
var utils = SpecialPowers.getDOMWindowUtils(window);
|
|
|
|
let startHandledPromise = handleTouchStart();
|
|
let endHandledPromise = handleTouchEnd();
|
|
var pt = await coordinatesRelativeToScreen({ offsetX: 25, offsetY: 5, target: v });
|
|
utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_CONTACT, pt.x, pt.y, 1, 90, null);
|
|
await startHandledPromise;
|
|
utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_REMOVE, pt.x, pt.y, 1, 90, null);
|
|
await endHandledPromise;
|
|
ok(v._gotTouchend, "Touchend was received on video element");
|
|
|
|
startHandledPromise = handleTouchStart();
|
|
endHandledPromise = handleTouchEnd();
|
|
pt = await coordinatesRelativeToScreen({ offsetX: 25, offsetY: 5, target: d });
|
|
utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_CONTACT, pt.x, pt.y, 1, 90, null);
|
|
await startHandledPromise;
|
|
utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_REMOVE, pt.x, pt.y, 1, 90, null);
|
|
await endHandledPromise;
|
|
ok(d._gotTouchend, "Touchend was received on div element");
|
|
}
|
|
|
|
waitUntilApzStable()
|
|
.then(test)
|
|
.then(subtestDone, subtestFailed);
|
|
|
|
</script>
|
|
<style>
|
|
* {
|
|
font-size: 24px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#video {
|
|
display:block;
|
|
position:absolute;
|
|
top: 100px;
|
|
left:0;
|
|
width: 50%;
|
|
height: 100px;
|
|
border:solid black 1px;
|
|
background-color: #8a8;
|
|
}
|
|
|
|
#div {
|
|
display:block;
|
|
position:absolute;
|
|
top: 100px;
|
|
left: 50%;
|
|
width: 50%;
|
|
height: 100px;
|
|
border:solid black 1px;
|
|
background-color: #88a;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<p>Tap on the colored boxes to hide them.</p>
|
|
<video id="video"></video>
|
|
<div id="div"></div>
|
|
</body>
|
|
</html>
|