| <!DOCTYPE html> |
| <style> |
| * { |
| padding: 0; |
| margin: 0; |
| } |
| |
| ::-webkit-scrollbar { |
| display: none; |
| } |
| |
| html, body { |
| height: 400px; |
| width: 400px; |
| background: #eee; |
| padding: 0; |
| margin: 0; |
| } |
| |
| div#child { |
| position: absolute; |
| top : 0; |
| left: 400px; |
| width: 400px; |
| height: 10000px; |
| background: #ddd; |
| } |
| |
| </style> |
| |
| <body> |
| <div id='child'></div> |
| <div id='console'></div> |
| </body> |
| |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script> |
| const purpose = |
| 'Test that wheel and mouse events are dispatched to document' + |
| 'and window even if they do not hit any element in the page.'; |
| |
| test(() => { |
| assert_own_property(window, 'eventSender', 'window.eventSender is required for this test.'); |
| |
| window.receivers = new Map(); |
| var eventTypes = ['wheel', 'click', 'mousedown', 'mouseup']; |
| var eventTargets = [window, document, document.body, document.getElementById('child')]; |
| |
| for (var eventType of eventTypes) { |
| window.receivers[eventType] = []; |
| for (var target of eventTargets) { |
| target.addEventListener(eventType, registerEvent.bind(target)); |
| } |
| } |
| |
| // received by element, body, doc, window |
| generateEventsAndVerify(500, 500, [document.getElementById('child'), document.body, document, window], 'outside body, inside element.'); |
| // received by body, doc, window |
| generateEventsAndVerify(10, 10, [document.body, document, window], 'inside body, outside element.'); |
| // received by doc, window |
| generateEventsAndVerify(10, 500, [document, window], 'outside body, outside element, inside frame.'); |
| |
| function registerEvent(e) { |
| window.receivers[e.type].push(this); |
| } |
| |
| function generateEventsAndVerify(x, y, expectedReceivers, title) { |
| test(() => { |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseDown(); |
| verifyReceivers('mousedown', expectedReceivers); |
| |
| eventSender.mouseUp(); |
| verifyReceivers('mouseup', expectedReceivers); |
| verifyReceivers('click', expectedReceivers); |
| |
| eventSender.mouseScrollBy(10, 10); |
| verifyReceivers('wheel', expectedReceivers); |
| }, title + ' ' + purpose); |
| } |
| |
| function verifyReceivers(eventType, expectedReceivers) { |
| window.actualReceivers = window.receivers[eventType]; |
| assert_equals(objectsToString(actualReceivers), objectsToString(expectedReceivers), eventType); |
| |
| window.receivers[eventType] = []; |
| } |
| }); |
| |
| function objectsToString(objects) { |
| return String(objects.map(function(o) {return o.constructor.name;})); |
| } |
| |
| </script> |
