| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #target { |
| border: 1px solid; |
| width: 100px; |
| height: 100px; |
| } |
| </style> |
| <script src="../../../resources/js-test-pre.js"></script> |
| <script> |
| var didDispatchWheel = false; |
| |
| jsTestIsAsync = true; |
| |
| function dispatchAndHandleGestureEvent(eventToWaitFor, scale, shouldPreventDefault) { |
| debug(""); |
| |
| return new Promise((resolve, reject) => { |
| function wheelHandler(event) { |
| debug(`Handling 'wheel' event at (${event.pageX}, ${event.pageY})...`); |
| |
| shouldBeTrue("event.ctrlKey"); |
| shouldBeCloseTo("event.deltaY", scale * -100, 0.01); |
| |
| if (!shouldPreventDefault) |
| handled(); |
| } |
| |
| function gestureHandler(event) { |
| debug(`Handling '${event.type}' event at (${event.pageX}, ${event.pageY})...`); |
| |
| if (!shouldPreventDefault) |
| return; |
| |
| debug("Calling `preventDefault`..."); |
| event.preventDefault(); |
| |
| if (event.type === eventToWaitFor) { |
| didDispatchWheel = false; |
| // Give time for a `"wheel"` event to be dispatched so failures can be found. |
| setTimeout(() => { |
| shouldBeFalse("didDispatchWheel"); |
| handled(); |
| }); |
| } |
| } |
| |
| function handled() { |
| target.removeEventListener("wheel", wheelHandler); |
| target.removeEventListener("gesturestart", gestureHandler); |
| target.removeEventListener("gesturechange", gestureHandler); |
| target.removeEventListener("gestureend", gestureHandler); |
| resolve(); |
| } |
| |
| target.addEventListener("wheel", wheelHandler, {once: true}); |
| |
| // Add listeners for each phase just in case multiple are dispatched (which would be wrong). |
| target.addEventListener("gesturestart", gestureHandler, {once: true}); |
| target.addEventListener("gesturechange", gestureHandler, {once: true}); |
| target.addEventListener("gestureend", gestureHandler, {once: true}); |
| |
| debug(`Dispatching '${eventToWaitFor}'...`); |
| switch (eventToWaitFor) { |
| case "gesturestart": |
| eventSender.scaleGestureStart(scale); |
| break; |
| case "gesturechange": |
| eventSender.scaleGestureChange(scale); |
| break; |
| case "gestureend": |
| eventSender.scaleGestureEnd(scale); |
| break; |
| } |
| }); |
| } |
| |
| async function runTest() { |
| if (!window.eventSender) { |
| debug("FAIL: This test requires window.eventSender."); |
| return; |
| } |
| |
| eventSender.mouseMoveTo(target.offsetLeft + (target.offsetWidth / 2), target.offsetTop + (target.offsetHeight / 2)); |
| |
| debug("Test that wheel events are not dispatched if gesture events are not preventDefault."); |
| await dispatchAndHandleGestureEvent("gesturestart", 0.01, false); |
| await dispatchAndHandleGestureEvent("gesturechange", 0.02, false); |
| await dispatchAndHandleGestureEvent("gesturechange", 0.03, false); |
| await dispatchAndHandleGestureEvent("gestureend", 0.04, false); |
| |
| debug(""); |
| |
| debug("Test that wheel events are not dispatched if gesture events are preventDefault."); |
| await dispatchAndHandleGestureEvent("gesturestart", 0.01, true); |
| await dispatchAndHandleGestureEvent("gesturechange", 0.02, true); |
| await dispatchAndHandleGestureEvent("gesturechange", 0.03, true); |
| await dispatchAndHandleGestureEvent("gestureend", 0.04, true); |
| |
| debug(""); |
| finishJSTest(); |
| } |
| </script> |
| </head> |
| <body> |
| <div id="target"></div> |
| <div id="console"></div> |
| <script> |
| description("Tests wheel event dispatching for gesture events."); |
| |
| runTest(); |
| </script> |
| <script src="../../../resources/js-test-post.js"></script> |
| </body> |
| </html> |