Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(551)

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

Issue 2098883002: Make PointerEvent an experimental web platform feature. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Rebased, fixed js path. Created 4 years, 5 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
OLDNEW
(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 mouse.");
26
27 var implicitReleaseOutside = false;
28 var explicitRelease = false;
29 var removeElement = false;
30 var pointerMoveCount = 0;
31
32 var rect = document.getElementById("green").getBoundingClientRect();
33 var x1 = rect.left + 5;
34 var y1 = rect.top + 5;
35
36 var rect = document.getElementById("grey").getBoundingClientRect();
37 var x2 = rect.left + 5;
38 var y2 = rect.top + 5;
39
40 var rect = document.getElementById("blue").getBoundingClientRect();
41 var x3 = rect.left + 5;
42 var y3 = rect.top + 5;
43
44 function init() {
45 var eventList = ["mouseenter", "mouseleave", "mouseover", "mouseout", "mousemo ve", "mousedown", "mouseup",
46 "pointerenter", "pointerleave", "pointerover", "pointerout", "pointermove", "pointerdown", "pointerup",
47 "gotpointercapture", "lostpointercapture"];
48
49 document.addEventListener("lostpointercapture", function(event) {
50 if (event.eventPhase == Event.AT_TARGET) {
51 debug("document received " + event.type);
52 }
53 });
54 ["grey", "green", "blue"].forEach(function(id) {
55 var targetDiv = document.getElementById(id);
56 eventList.forEach(function(eventName) {
57 targetDiv.addEventListener(eventName, function(event) {
58 if (event.eventPhase == Event.AT_TARGET) {
59 debug(id + " received " + event.type);
60 if (id == "green" && event.type == "pointerdown") {
61 debug(" **** Set Pointer Capture ***** ");
62 targetDiv.setPointerCapture(event.pointerId);
63 }
64 if (id == "green" && event.type == "pointermove") {
65 if (explicitRelease && pointerMoveCount++ > 3) {
66 debug(" **** Release Pointer Capture ***** ");
67 targetDiv.releasePointerCapture(event.pointerId);
68 explicitRelease = false;
69 }
70 if (removeElement && pointerMoveCount++ > 3) {
71 debug(" **** Remove Element ***** ");
72 targetDiv.parentNode.removeChild(targetDiv);
73 removeElement = false;
74 }
75 }
76 }
77 });
78 });
79 });
80 }
81
82 function testScenario() {
83 debug(" **** Move to green box & mouse press & jiggle ***** ");
84 eventSender.mouseMoveTo(x1, y1);
85 eventSender.mouseDown(1);
86 eventSender.mouseMoveTo(x1+1, y1+1);
87
88 debug(" **** Move to grey box & jiggle ***** ");
89 eventSender.mouseMoveTo(x2, y2);
90 eventSender.mouseMoveTo(x2+1, y2+1);
91
92 debug(" **** Move to blue box & jiggle ****");
93 eventSender.mouseMoveTo(x3, y3);
94
95 if (implicitReleaseOutside) {
96 debug(" **** Release the mouse outside of the page & move back to blue bo x ****");
97 eventSender.setMouseButtonState(-1, []);
98 }
99 eventSender.mouseMoveTo(x3+1, y3+1);
100 eventSender.mouseMoveTo(x3, y3);
101
102 if (!implicitReleaseOutside) {
103 debug(" **** Move back to green & again to blue & mouse release ***** ");
104 eventSender.mouseMoveTo(x1, y1);
105 eventSender.mouseMoveTo(x3, y3);
106 eventSender.mouseUp(1);
107
108 debug(" **** Jiggle in blue box ***** ");
109 eventSender.mouseMoveTo(x3+1, y3+1);
110 }
111
112 debug(" **** Move to (0,0) ***** ");
113 eventSender.mouseMoveTo(0, 0);
114 eventSender.mouseDown(0);
115 eventSender.mouseUp(0);
116 eventSender.leapForward(500);
117 }
118
119 function runTests() {
120 debug(" ======= Set pointer capture and release implicitly =======");
121 testScenario();
122
123 implicitReleaseOutside = true;
124 debug("");
125 debug(" ======= Set pointer capture and release implicitly outside of the page =======");
126 testScenario();
127 implicitReleaseOutside = false;
128
129 explicitRelease = true;
130 pointerMoveCount = 0;
131 debug("");
132 debug(" ======= Set pointer capture and release explicitly =======");
133 testScenario();
134 explicitRelease = false;
135
136 removeElement = true;
137 pointerMoveCount = 0;
138 debug("");
139 debug(" ======= Set pointer capture and remove element =======");
140 testScenario();
141 removeElement = false;
142 }
143
144 init();
145 if (window.eventSender)
146 runTests();
147 else
148 debug("This test requires eventSender");
149
150 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698