| <!DOCTYPE html> |
| <script src="../../../resources/js-test.js"></script> |
| <style type="text/css"> |
| html, body, .workspace { |
| height: 100%; |
| } |
| button { |
| cursor: pointer; |
| padding: 0px; |
| margin: 0px; |
| } |
| .minbox { |
| height: 30px; |
| width: 1px; |
| } |
| #div1, #div2 { |
| height: 80px; |
| border: 1px solid #aaaaaa; |
| } |
| </style> |
| <body> |
| <div class="workspace"></div> |
| <div class="minbox"> |
| <div id="test"> |
| <button>POINTER</button> |
| </div> |
| </div> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| var events = []; |
| var targets = []; |
| |
| window.scrollTo(0, 200); |
| |
| // A position over to the right of <button> and #test. |
| var button = document.getElementById("test").children[0]; |
| var x = button.getBoundingClientRect().right + 1; |
| var y = button.getBoundingClientRect().top; |
| |
| if (window.eventSender) { |
| function appendEventLog(e) { |
| events.push(e.type); |
| targets.push(e.currentTarget.nodeName); |
| } |
| |
| function runNextTest(eventType1, eventType2) |
| { |
| document.addEventListener(eventType1, appendEventLog); |
| document.body.addEventListener(eventType1, appendEventLog); |
| document.addEventListener(eventType2, appendEventLog); |
| document.body.addEventListener(eventType2, appendEventLog); |
| eventSender.mouseMoveTo(x, y); // html element in iframe |
| eventSender.mouseMoveTo(x, y + 200); // out of iframe |
| eventSender.mouseMoveTo(x, y - 100); // body element in iframe |
| eventSender.mouseMoveTo(x, y + 200); // out of iframe |
| document.removeEventListener(eventType1, appendEventLog); |
| document.body.removeEventListener(eventType1, appendEventLog); |
| document.removeEventListener(eventType2, appendEventLog); |
| document.body.removeEventListener(eventType2, appendEventLog); |
| } |
| runNextTest('mousemove', ''); |
| runNextTest('mouseover', ''); |
| runNextTest('mouseout', ''); |
| runNextTest('mouseenter', 'mouseleave'); |
| } |
| var i = 0; |
| function verifyEventLog(eventType, target) |
| { |
| shouldBeEqualToString('events[' + i + ']', eventType); |
| shouldBeEqualToString('targets[' + i + ']', target); |
| i++; |
| } |
| verifyEventLog('mousemove', '#document'); // x, y |
| verifyEventLog('mousemove', 'BODY'); // x, y - 100 |
| verifyEventLog('mousemove', '#document'); // x, y - 100 |
| verifyEventLog('mouseover', '#document'); // x, y |
| verifyEventLog('mouseover', 'BODY'); // x, y - 100 |
| verifyEventLog('mouseover', '#document'); // x, y - 100 |
| verifyEventLog('mouseout', '#document'); // x, y |
| verifyEventLog('mouseout', 'BODY'); // x, y - 100 |
| verifyEventLog('mouseout', '#document'); // x, y - 100 |
| verifyEventLog('mouseenter', '#document');// x, y |
| verifyEventLog('mouseleave', '#document');// x, y |
| verifyEventLog('mouseenter', '#document');// x, y - 100 |
| verifyEventLog('mouseenter', 'BODY'); // x, y - 100 |
| verifyEventLog('mouseleave', 'BODY'); // x, y + 200 |
| verifyEventLog('mouseleave', '#document');// x, y + 200 |
| </script> |
| </body> |
