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
|
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<script>
description('<select> selection test for scrolling.');
var parent = document.createElement('div');
parent.innerHTML = '<select id="sl1" multiple size=5>'
+ '<option>one</option>'
+ '<option>two</option>'
+ '<option>three</option>'
+ '<option>four</option>'
+ '<option>five</option>'
+ '<option>six</option>'
+ '<option>seven</option>'
+ '<option>eight</option>'
+ '<option>nine</option>'
+ '<option>ten</option>'
+ '<option>eleven</option>'
+ '<option>twelve</option>'
+ '<option>thirteen</option>'
+ '<option>fourteen</option>'
+ '<option>fifteen</option>'
+ '<option>sixteen</option>'
+ '<option>seventeen</option>'
+ '</select>'
+ '<select id="sl2" multiple style="height: 135px; border: 10px solid; padding: 5px;">'
+ '<option>one</option>'
+ '<option>two</option>'
+ '<option>three</option>'
+ '</select>';
document.body.appendChild(parent);
// Determine the item height.
var sl1 = document.getElementById('sl1');
var sl2 = document.getElementById('sl2');
var itemHeight = Math.floor(sl1.offsetHeight / sl1.size);
sl1.removeAttribute('size');
var height = itemHeight * 9 + 9;
sl1.setAttribute('style', 'height: ' + height + 'px; border: 10px solid; padding: 5px;');
function mouseDownOnSelect(selId, index)
{
var sl = document.getElementById(selId);
var borderPaddingTop = 15;
var borderPaddingLeft = 15;
var y = index * itemHeight + itemHeight / 2 - window.pageYOffset + borderPaddingTop;
eventSender.mouseMoveTo(sl.offsetLeft + borderPaddingLeft, sl.offsetTop + y);
eventSender.mouseDown();
eventSender.mouseUp();
}
function selectionPattern(selectId)
{
var select = document.getElementById(selectId);
var result = "";
for (var i = 0; i < select.options.length; i++)
result += select.options[i].selected ? '1' : '0';
return result;
}
mouseDownOnSelect("sl1", 0);
shouldBe('selectionPattern("sl1")', '"10000000000000000"');
mouseDownOnSelect("sl1", 1);
shouldBe('selectionPattern("sl1")', '"01000000000000000"');
mouseDownOnSelect("sl1", 6);
shouldBe('selectionPattern("sl1")', '"00000010000000000"');
mouseDownOnSelect("sl1", 7);
shouldBe('selectionPattern("sl1")', '"00000001000000000"');
mouseDownOnSelect("sl1", 8);
shouldBe('selectionPattern("sl1")', '"00000001000000000"');
mouseDownOnSelect("sl1", 0);
shouldBe('selectionPattern("sl1")', '"10000000000000000"');
for (i = 0; i < 9; i++)
mouseDownOnSelect("sl1", 7);
shouldBe('selectionPattern("sl1")', '"00000001000000000"');
mouseDownOnSelect("sl2", 1);
shouldBe('selectionPattern("sl2")', '"010"');
mouseDownOnSelect("sl2", 3);
shouldBe('selectionPattern("sl2")', '"010"');
mouseDownOnSelect("sl2", 2);
shouldBe('selectionPattern("sl2")', '"001"');
</script>
</body>
</html>
|