1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
<!DOCTYPE HTML>
<script type="text/javascript" src="/resources/testharness.js"></script>
<script type="text/javascript" src="/resources/testharnessreport.js"></script>
<script type="text/javascript" src="/resources/testdriver.js"></script>
<script type="text/javascript" src="/resources/testdriver-vendor.js"></script>
<script type="text/javascript" src="/resources/testdriver-actions.js"></script>
<script type="text/javascript" src="../pointerevent_support.js"></script>
<style>
#obj {
width: 50px;
height: 50px;
padding: 50px;
background-color: lightblue;
border:1px solid black;
}
div {
display: block;
}
</style>
<h1>Verifies that mouse activities on an object fire pointerevents. It expected to get pointerup when the pointerdown happened on the object for compatibility with flash objects.</h1>
<p>
To test that when clicking inside the blue rectangle all compat mouse events are correct:
<ul>
<li> Click once in the blue rectangle
<li> Click the Done button
</ul>
</p>
<p>
To test that when dragging mouse outside all compat mouse events are correct:
<ul>
<li> Press left mouse button in the blue rectangle
<li> Drag the mouse cursor out of the blue rectangle
<li> Release the left mouse button
<li> Click the Done button
</ul>
</p>
<!-- draggable is set to false because there is a difference between auto draggable value in different browsers -->
<object id="obj" draggable="false"></object>
<button id="done">Done</button>
<div id="log"></div>
<script>
var target = document.getElementById("obj");
var done = document.getElementById("done");
var rect = target.getBoundingClientRect();
var done_clicked = 0;
var receivedEvents = [];
var previous_done_clicked = 0;
["mousedown", "mouseup", "mousemove", "pointerdown", "pointerup", "pointermove"].forEach(function(eventName) {
target.addEventListener(eventName, function(event) {
// This will clear receivedEvents once another test starts
if(previous_done_clicked !== done_clicked){
previous_done_clicked = done_clicked;
receivedEvents = [];
}
receivedEvents.push(event.type);
});
});
document.getElementById('done').addEventListener('click', (e) => done_clicked++);
// Need to prevent the default behaviour for firefox
target.addEventListener("dragstart", (e)=>e.preventDefault());
if(window.promise_test){
promise_test(async() => {
receivedEvents = [];
await new test_driver.Actions()
.pointerMove(Math.ceil(rect.left+5), Math.ceil(rect.top+5))
.pointerDown()
.pointerUp()
.send()
.then(() => clickInTarget("mouse", done));
await resolveWhen(() => done_clicked === 1);
assert_array_equals(receivedEvents.filter(isPointerEvent), ["pointermove", "pointerdown", "pointerup"],
"Click on object should result in the correct sequence of pointer events");
assert_array_equals(receivedEvents.filter(isMouseEvent), ["mousemove", "mousedown", "mouseup"],
"Click on object should result in the correct sequence of mouse events");
assert_true(arePointerEventsBeforeCompatMouseEvents(receivedEvents),
"Click on object should result in the correct sequence of events: " + receivedEvents);
}, "Normal click event sequence within object");
promise_test(async() => {
receivedEvents = [];
await new test_driver.Actions()
.pointerMove(Math.ceil(rect.left+5), Math.ceil(rect.top+5))
.pointerDown()
.pointerMove(Math.ceil(rect.left-5), Math.ceil(rect.top-5))
.pointerUp()
.send()
.then(() => clickInTarget("mouse", done));
await resolveWhen(() => done_clicked === 2);
assert_array_equals(receivedEvents.filter(isPointerEvent), ["pointermove", "pointerdown", "pointermove", "pointerup"],
"Drag from object should result in the correct sequence of pointer events");
assert_array_equals(receivedEvents.filter(isMouseEvent), ["mousemove", "mousedown", "mousemove", "mouseup"],
"Drag from object should result in the correct sequence of mouse events");
assert_true(arePointerEventsBeforeCompatMouseEvents(receivedEvents),
"Drag from object should result in the correct sequence of events: " + receivedEvents);
}, "Click and drag outside of object event sequence");
}
</script>
|
