test_bug1323158.html (3793B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=1323158 5 --> 6 <head> 7 <meta charset="utf-8"> 8 <title>This is a test to check if target and relatedTarget of mouse events are the same as pointer events</title> 9 <script src="/tests/SimpleTest/SimpleTest.js"></script> 10 <script src="/tests/SimpleTest/EventUtils.js"></script> 11 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 12 </head> 13 <body> 14 <p id="content"></p> 15 <script type="text/javascript"> 16 17 /** Test for Bug 1323158 */ 18 SimpleTest.waitForExplicitFinish(); 19 20 function runTests() { 21 let content = document.getElementById('content'); 22 let iframe = document.createElement('iframe'); 23 iframe.width = 500; 24 iframe.height = 500; 25 content.appendChild(iframe); 26 iframe.contentDocument.body.innerHTML = 27 "<br><div id='target0' style='width: 30px; height: 30px; background: black;'></div>" + 28 "<br><div id='target1' style='width: 30px; height: 30px; background: red;'></div>" + 29 "<br><div id='done' style='width: 30px; height: 30px; background: green;'></div>"; 30 31 let target0 = iframe.contentDocument.getElementById("target0"); 32 let target1 = iframe.contentDocument.getElementById("target1"); 33 let done = iframe.contentDocument.getElementById("done"); 34 let pointerBoundaryEvents = ["pointerover", "pointerenter", "pointerleave", "pointerout"]; 35 let mouseBoundaryEvents = ["mouseover", "mouseenter", "mouseleave", "mouseout"]; 36 let receivedPointerBoundaryEvents = {}; 37 let mouseEvent2pointerEvent = {"mouseover": "pointerover", 38 "mouseenter": "pointerenter", 39 "mouseleave": "pointerleave", 40 "mouseout": "pointerout" 41 }; 42 43 pointerBoundaryEvents.forEach((event) => { 44 target1.addEventListener(event, (e) => { 45 receivedPointerBoundaryEvents[event] = e; 46 }, {once: true}); 47 }); 48 49 let attributes = ["target", "relatedTarget"]; 50 mouseBoundaryEvents.forEach((event) => { 51 target1.addEventListener(event, (e) => { 52 let correspondingPointerEv = receivedPointerBoundaryEvents[mouseEvent2pointerEvent[event]]; 53 ok(correspondingPointerEv, "Should receive " + mouseEvent2pointerEvent[event] + " before " + e.type); 54 if (correspondingPointerEv) { 55 attributes.forEach((attr) => { 56 ok(correspondingPointerEv[attr] == e[attr], 57 attr + " of " + e.type + " should be the same as the correcponding pointer event expect " + 58 correspondingPointerEv[attr] + " got " + e[attr]); 59 }); 60 } 61 receivedPointerBoundaryEvents[mouseEvent2pointerEvent[event]] = null; 62 }, {once: true}); 63 }); 64 target0.addEventListener("pointerdown", (e) => { 65 target1.setPointerCapture(e.pointerId); 66 }); 67 done.addEventListener("mouseup", () => { 68 SimpleTest.finish(); 69 }); 70 let source = MouseEvent.MOZ_SOURCE_MOUSE; 71 synthesizeMouse(target0, 5, 5, { type: "mousemove", inputSource: source }, 72 iframe.contentWindow); 73 synthesizeMouse(target0, 5, 5, { type: "mousedown", inputSource: source }, 74 iframe.contentWindow); 75 synthesizeMouse(target0, 5, 5, { type: "mousemove", inputSource: source }, 76 iframe.contentWindow); 77 synthesizeMouse(target0, 5, 5, { type: "mouseup", inputSource: source }, 78 iframe.contentWindow); 79 synthesizeMouse(target0, 5, 5, { type: "mousemove", inputSource: source }, 80 iframe.contentWindow); 81 synthesizeMouse(done, 5, 5, { type: "mousedown", inputSource: source }, 82 iframe.contentWindow); 83 synthesizeMouse(done, 5, 5, { type: "mouseup", inputSource: source }, 84 iframe.contentWindow); 85 } 86 87 SimpleTest.waitForFocus(runTests); 88 89 </script> 90 </body> 91 </html>