caaa21e89882ecafb1600ba1a075ce9f0bbcbc73
[WebKit-https.git] / LayoutTests / fast / events / mouse-relative-position.html
1 <html>
2 <head>
3 <script src="../js/resources/js-test-pre.js"></script>
4 <style>
5     html, body {
6         margin: 0;
7         padding: 0;
8     }
9     
10     #test1 {
11         margin: 100px;
12         width: 200px;
13         height: 200px;
14         background: silver;
15     }
16
17     #test2 {
18         margin: -90px 0 0 100px;
19         width: 190px;
20         height: 190px;
21         border: 1px solid silver;
22         padding: 4px;
23     }
24
25     #test2 > div {
26         position: relative;
27         height: 150px;
28         width: 150px;
29         overflow: auto;
30         background: white;
31     }
32
33     #test2 > div > input {
34         width: 80px;
35         margin: 150px;
36         border: 1px solid;
37     }
38
39     input, span {
40         font-size: 14px;
41         display: inline-block;
42         height: 20px;
43         overflow: hidden;
44     }
45
46 </style>
47 <body>
48     <div id="test1">
49         <span>span</span>
50     </div>
51     <div id="test2">
52         <div>
53             <input type="text" value="input">
54         </div>
55     </div>
56     <div id="console"></div>
57 </body>
58 <script>
59     var TOLERANCE = 5;
60     function isAcceptable(expected, result)
61     {
62         for (var i = 0; i < 4; i++) {
63             if (Math.abs(expected[i] - result[i]) > TOLERANCE)
64                 return false;
65         }
66         return true;
67     }
68     
69     function simulateElementClick(element, expected)
70     {
71         element.scrollIntoView(true);
72         if (!window.eventSender)
73             return 'This test requires eventSender';
74
75         var result;
76         function listener(event)
77         {
78             result = [event.offsetX, event.offsetY, event.layerX, event.layerY];
79         }
80             
81         var rect = element.getBoundingClientRect();
82         element.addEventListener('click', listener, false);
83         eventSender.mouseMoveTo(rect.left + rect.width / 2, rect.top + rect.height / 2);
84         eventSender.mouseDown();
85         eventSender.mouseUp();
86         element.removeEventListener('click', listener, false);
87
88         if (result && isAcceptable(expected, result))
89             return expected.join(', ');
90
91         return result.join(', ');        
92     }
93
94     var testElement = document.getElementById('test1');
95     var spanElement = testElement.getElementsByTagName('span')[0];
96     var testElement2 = document.getElementById('test2');
97     var inputElement = testElement2.getElementsByTagName('input')[0];
98
99     shouldBe("simulateElementClick(testElement, [100, 100, 200, 200]);", "'100, 100, 200, 200'");
100     shouldBe("simulateElementClick(spanElement, [16, 10, 16, 10]);", "'16, 10, 16, 10'");
101     shouldBe("simulateElementClick(inputElement, [40, 10, 40, 10]);", "'40, 10, 40, 10'");
102 </script>
103 </html>