| <!DOCTYPE HTML> |
| <script src="../../resources/js-test.js"></script> |
| <style> |
| #outer { |
| background: grey; |
| position: absolute; |
| left: 100px; |
| top: 100px; |
| width: 100px; |
| height: 100px; |
| } |
| #inner { |
| background: red; |
| position: absolute; |
| left: 30px; |
| top: 30px; |
| width: 40px; |
| height: 40px; |
| } |
| </style> |
| |
| <div id="outer"> |
| <div id="inner"></div> |
| </div> |
| |
| <div id="console"></div> |
| |
| <script> |
| description("Verifies that dragging mouse in/out of an element doesn't fire redundant mouseenter or mouseleave events (crbug.com/356090 & crbug.com/470258)"); |
| |
| var wasInside = {}; |
| |
| function init() { |
| ["outer", "inner"].forEach(function(id) { |
| wasInside[id] = false; |
| |
| var targetDiv = document.getElementById(id); |
| |
| targetDiv.addEventListener("mouseenter", function(event) { |
| debug(id + " received mouseenter"); |
| shouldBeFalse("wasInside['" + id + "']"); |
| wasInside[id] = true; |
| }); |
| |
| targetDiv.addEventListener("mouseleave", function(event) { |
| debug(id + " received mouseleave"); |
| shouldBeTrue("wasInside['" + id + "']"); |
| wasInside[id] = false; |
| }); |
| |
| ["mouseover", "mouseout", "mousedown", "mouseup"].forEach(function(eventName) { |
| targetDiv.addEventListener(eventName, function(event) { |
| if (event.eventPhase == Event.AT_TARGET) |
| debug(id + " received " + eventName); |
| }); |
| }); |
| }); |
| } |
| |
| init(); |
| if (window.eventSender) { |
| var y = 150; |
| |
| debug("--- drag across inner ---"); |
| eventSender.mouseMoveTo(1, y); |
| eventSender.mouseMoveTo(110, y); |
| eventSender.mouseDown(); |
| eventSender.mouseMoveTo(140, y); |
| eventSender.mouseMoveTo(150, y); |
| eventSender.mouseMoveTo(160, y); |
| eventSender.mouseMoveTo(190, y); |
| eventSender.mouseUp(); |
| eventSender.mouseMoveTo(201, y); |
| |
| debug(""); |
| |
| debug("--- drag into inner ---"); |
| eventSender.mouseMoveTo(190, y); |
| eventSender.mouseDown(); |
| eventSender.mouseMoveTo(150, y); |
| eventSender.mouseUp(); |
| |
| debug(""); |
| |
| debug("--- drag out of inner ---"); |
| eventSender.mouseDown(); |
| eventSender.mouseMoveTo(110, y); |
| eventSender.mouseUp(); |
| |
| debug(""); |
| |
| } else { |
| debug("This test requires eventSender"); |
| } |
| </script> |
