OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <script src="../../resources/js-test.js"></script> | 4 <script src="../../resources/js-test.js"></script> |
5 <script> | 5 <script> |
| 6 window.jsTestIsAsync = true; |
| 7 var testScrolls = []; |
| 8 var currentTest = -1; |
6 var div; | 9 var div; |
7 var pixelsPerWheelTick = 40; | 10 var pixelsPerWheelTick = 40; |
8 | 11 |
9 function tryScroll() { | 12 function tryScroll() { |
10 eventSender.mouseMoveTo(div.offsetLeft + 5, div.offsetTop + 5); | 13 eventSender.mouseMoveTo(div.offsetLeft + 5, div.offsetTop + 5); |
11 eventSender.mouseScrollBy(0,-1); | 14 eventSender.mouseScrollBy(0,-1); |
12 eventSender.mouseScrollBy(-1,0); | 15 eventSender.mouseScrollBy(-1,0); |
13 } | 16 } |
14 | 17 |
15 function checkOffsets() { | 18 function startNextTestCase() { |
16 div = document.getElementById("overflow-1"); | 19 currentTest++; |
17 debug("===overflow:scroll with overflow"); | 20 if (currentTest >= testScrolls.length) { |
18 shouldBe('div.scrollTop', 'window.pixelsPerWheelTick'); | 21 finishJSTest(); |
19 shouldBe('div.scrollLeft', 'window.pixelsPerWheelTick'); | 22 return; |
20 | 23 } |
21 div = document.getElementById("overflow-2"); | 24 var testCase = testScrolls[currentTest]; |
22 debug("===overflow:auto with overflow"); | 25 div = document.getElementById(testCase.elem); |
23 shouldBe('div.scrollTop', 'window.pixelsPerWheelTick'); | 26 tryScroll(); |
24 shouldBe('div.scrollLeft', 'window.pixelsPerWheelTick'); | 27 shouldBecomeEqual("div.scrollTop == " + testCase.expTop + " && " + |
25 | 28 "div.scrollLeft == " + testCase.expLeft, "true", startNextTestCa
se); |
26 div = document.getElementById("overflow-3"); | |
27 debug("===overflow:hidden with overflow"); | |
28 shouldBe('div.scrollTop', '0'); | |
29 shouldBe('div.scrollLeft', '0'); | |
30 | |
31 div = document.getElementById("overflow-4"); | |
32 debug("===overflow:overlay with overflow"); | |
33 shouldBe('div.scrollTop', 'window.pixelsPerWheelTick'); | |
34 shouldBe('div.scrollLeft', 'window.pixelsPerWheelTick'); | |
35 | |
36 div = document.getElementById("no-overflow-1"); | |
37 debug("===overflow:scroll without overflow"); | |
38 shouldBe('div.scrollTop', '0'); | |
39 shouldBe('div.scrollLeft', '0'); | |
40 | |
41 div = document.getElementById("no-overflow-2"); | |
42 debug("===overflow:auto without overflow"); | |
43 shouldBe('div.scrollTop', '0'); | |
44 shouldBe('div.scrollLeft', '0'); | |
45 | |
46 div = document.getElementById("no-overflow-3"); | |
47 debug("===overflow:hidden without overflow"); | |
48 shouldBe('div.scrollTop', '0'); | |
49 shouldBe('div.scrollLeft', '0'); | |
50 | |
51 div = document.getElementById("no-overflow-4"); | |
52 debug("===overflow:overlay without overflow"); | |
53 shouldBe('div.scrollTop', '0'); | |
54 shouldBe('div.scrollLeft', '0'); | |
55 | |
56 testRunner.notifyDone(); | |
57 } | 29 } |
58 | 30 |
59 function test() { | 31 function test() { |
60 if (window.eventSender && window.testRunner) { | 32 if (window.eventSender && window.testRunner) { |
61 testRunner.waitUntilDone(); | 33 testRunner.waitUntilDone(); |
62 | |
63 description('This tests that scrollable areas with the appropria
te overflow mode set' | 34 description('This tests that scrollable areas with the appropria
te overflow mode set' |
64 + ' are in fact scrollable by the user.'); | 35 + ' are in fact scrollable by the user.'); |
65 | 36 |
66 div = document.getElementById("overflow-1"); | 37 testScrolls = [ |
67 tryScroll(); | 38 {elem: "overflow-1", expLeft: "window.pixelsPerWheelTick" ,
expTop: "window.pixelsPerWheelTick"}, |
68 div = document.getElementById("overflow-2"); | 39 {elem: "overflow-2", expLeft: "window.pixelsPerWheelTick" ,
expTop: "window.pixelsPerWheelTick"}, |
69 tryScroll(); | 40 {elem: "overflow-3", expLeft: 0 , expTop: 0}, |
70 div = document.getElementById("overflow-3"); | 41 {elem: "overflow-4", expLeft: "window.pixelsPerWheelTick" ,
expTop: "window.pixelsPerWheelTick"}, |
71 tryScroll(); | 42 {elem: "no-overflow-1", expLeft: 0 , expTop: 0}, |
72 div = document.getElementById("overflow-4"); | 43 {elem: "no-overflow-2", expLeft: 0 , expTop: 0}, |
73 tryScroll(); | 44 {elem: "no-overflow-3", expLeft: 0 , expTop: 0}, |
74 div = document.getElementById("no-overflow-1"); | 45 {elem: "no-overflow-4", expLeft: 0 , expTop: 0}, |
75 tryScroll(); | 46 ]; |
76 div = document.getElementById("no-overflow-2"); | 47 startNextTestCase(); |
77 tryScroll(); | |
78 div = document.getElementById("no-overflow-3"); | |
79 tryScroll(); | |
80 div = document.getElementById("no-overflow-4"); | |
81 tryScroll(); | |
82 | |
83 setTimeout('checkOffsets();', 100); | |
84 } else { | 48 } else { |
85 debug("FAIL: This test requires window.eventSender."); | 49 debug("FAIL: This test requires window.eventSender."); |
86 } | 50 } |
87 } | 51 } |
88 | |
89 </script> | 52 </script> |
90 </head> | 53 </head> |
91 <body style="margin: 0" onload="test()"> | 54 <body style="margin: 0" onload="test()"> |
92 scroll with overflow | 55 scroll with overflow |
93 <div id="overflow-1" style="width: 100px; height: 100px; overflow-x: scroll;
overflow-y: scroll"> | 56 <div id="overflow-1" style="width: 100px; height: 100px; overflow-x: scroll;
overflow-y: scroll"> |
94 <div style="width: 200px; height: 200px;">Content</div> | 57 <div style="width: 200px; height: 200px;">Content</div> |
95 </div> | 58 </div> |
96 auto with overflow | 59 auto with overflow |
97 <div id="overflow-2" style="width: 100px; height: 100px; overflow-x: auto; o
verflow-y: auto"> | 60 <div id="overflow-2" style="width: 100px; height: 100px; overflow-x: auto; o
verflow-y: auto"> |
98 <div style="width: 200px; height: 200px;">Content</div> | 61 <div style="width: 200px; height: 200px;">Content</div> |
(...skipping 18 matching lines...) Expand all Loading... |
117 hidden without overflow | 80 hidden without overflow |
118 <div id="no-overflow-3" style="width: 100px; height: 100px; overflow-x: hidd
en; overflow-y: hidden"> | 81 <div id="no-overflow-3" style="width: 100px; height: 100px; overflow-x: hidd
en; overflow-y: hidden"> |
119 <div style="width: 20px; height: 20px;">Content</div> | 82 <div style="width: 20px; height: 20px;">Content</div> |
120 </div> | 83 </div> |
121 overlay without overflow | 84 overlay without overflow |
122 <div id="no-overflow-4" style="width: 100px; height: 100px; overflow-x: over
lay; overflow-y: overlay"> | 85 <div id="no-overflow-4" style="width: 100px; height: 100px; overflow-x: over
lay; overflow-y: overlay"> |
123 <div style="width: 20px; height: 20px;">Content</div> | 86 <div style="width: 20px; height: 20px;">Content</div> |
124 </div> | 87 </div> |
125 </body> | 88 </body> |
126 </html> | 89 </html> |
OLD | NEW |