third_party/WebKit/LayoutTests/virtual/pointerevent/fast/events/pointerevents/touch-capture.html - Issue 1838973003: Send lostpointercapture on touch capturing

Side by Side Diff: third_party/WebKit/LayoutTests/virtual/pointerevent/fast/events/pointerevents/touch-capture.html

Issue 1838973003: Send lostpointercapture on touch capturing (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Created 4 years, 8 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View unified diff | Download patch

OLD	NEW
(Empty)
	1 <!DOCTYPE HTML>

	2 <script src="../../../../../resources/js-test.js"></script>

	3 <style>

	4 div.box {

	5 margin: 5px;

	6 padding: 20px;

	7 float: left;

	8 }

	9 #grey {

	10 width: 50px;

	11 height: 50px;

	12 }

	13 </style>

	14

	15 <div id="grey" class="box" style="background-color:grey">

	16 <div id="green" class="box" style="background-color:green;">

	17 </div>

	18 </div>

	19 <div id="blue" class="box" style="background-color:blue;">

	20 </div>

	21

	22 <div id="console"></div>

	23

	24 <script>

	25 description("Verifies that pointer capture works for touch.");

	26

	27 var rect = document.getElementById("green").getBoundingClientRect();

	28 var x1 = rect.left + 5;

	29 var y1 = rect.top + 5;

	30

	31 var rect = document.getElementById("blue").getBoundingClientRect();

	32 var x2 = rect.left + 5;

	33 var y2 = rect.top + 5;

	34

	35 function init() {

	36 var eventList = ["touchstart", "touchmove", "touchend", "touchcancel",

	37 "pointerenter", "pointerleave", "pointerover", "pointerout", "pointermove", "pointerdown", "pointerup", "pointercancel",

	38 "gotpointercapture", "lostpointercapture"];

	39

	40 document.addEventListener("lostpointercapture", function(event) {

	41 if (event.eventPhase == Event.AT_TARGET) {

	42 debug("document received " + event.type + " " + event.pointerId);

	43 }

	44 });

	45 ["grey", "green", "blue"].forEach(function(id) {

	46 var targetDiv = document.getElementById(id);

	47 eventList.forEach(function(eventName) {

	48 targetDiv.addEventListener(eventName, function(event) {

	49 if (event.eventPhase == Event.AT_TARGET) {

	50 if (event.type.includes("pointer"))

	51 debug(id + " received " + event.type + " " + event.pointerId);

	52 else

	53 debug(id + " received " + event.type);

	54 }

	55 });

	56 });

	57 });

	58 }

	59

	60 function singleTouchTestScenario(touchCancel) {

	61 debug(" ** First touch on green box & jiggle **");

	62 eventSender.addTouchPoint(x1, y1)

	63 eventSender.touchStart();

	64 eventSender.updateTouchPoint(0, x1+1, y1+1);

	65 eventSender.touchMove();

	66

	67 debug(" ** Move to blue box & jiggle **");

	68 eventSender.updateTouchPoint(0, x2, y2);

	69 eventSender.touchMove();

	70 eventSender.updateTouchPoint(0, x2+1, y2+1);

	71 eventSender.touchMove();

	72

	73 if (touchCancel) {

	74 debug(" ** Cancel touch **");

	75 eventSender.cancelTouchPoint(0);

	76 eventSender.touchCancel();

	77 } else {

	78 debug(" ** Release touch **");

	79 eventSender.releaseTouchPoint(0);

	80 eventSender.touchEnd();

	81 }

	82

	83 debug("");

	84 }

	85

	86

	87 function multiTouchTestScenario(touchCancel) {

	88 debug(" ** First touch on green & second touch on blue & jiggle **");

	89 eventSender.addTouchPoint(x1, y1)

	90 eventSender.touchStart();

	91 eventSender.addTouchPoint(x2, y2)

	92 eventSender.touchStart();

	93 eventSender.updateTouchPoint(0, x1+1, y1+1);

	94 eventSender.touchMove();

	95 eventSender.updateTouchPoint(1, x2+1, y2+1);

	96 eventSender.touchMove();

	97

	98 debug(" ** Move first touch to blue & second touch to green **");

	99 eventSender.updateTouchPoint(0, x2, y2);

	100 eventSender.touchMove();

	101 eventSender.updateTouchPoint(1, x1, y1);

	102 eventSender.touchMove();

	103

	104 if (touchCancel) {

	105 debug(" ** Cancel first touch **");

	106 eventSender.cancelTouchPoint(0);

	107 eventSender.touchCancel();

	108 } else {

	109 debug(" ** Release first touch **");

	110 eventSender.releaseTouchPoint(0);

	111 eventSender.touchEnd();

	112 }

	113

	114 debug(" ** Jiggle second touch on green **");

	115 eventSender.updateTouchPoint(0, x1+1, y1+1);

	116 eventSender.touchMove();

	117

	118 if (touchCancel) {

	119 debug(" ** Cancel second touch **");

	120 eventSender.cancelTouchPoint(0);

	121 eventSender.touchCancel();

	122 } else {

	123 debug(" ** Release second touch **");

	124 eventSender.releaseTouchPoint(0);

	125 eventSender.touchEnd();

	126 }

	127

	128 debug("");

	129 }

	130

	131 function runTests() {

	132 debug(" ======= Touch and release =======");

	133 singleTouchTestScenario(false);

	134

	135 debug(" ======= Touch and cancel =======");

	136 singleTouchTestScenario(true);

	137

	138 debug(" ======= Multitouch and release =======");

	139 multiTouchTestScenario(false);

	140

	141 debug(" ======= Multitouch and cancel =======");

	142 multiTouchTestScenario(true);

	143

	144 }

	145

	146 init();

	147 if (window.eventSender)

	148 runTests();

	149 else

	150 debug("This test requires eventSender");

	151

	152 </script>

OLD	NEW