| OLD | NEW |
|---|
| (Empty) | |
| 1 <!doctype html> |
| 2 <html> |
| 3 <head> |
| 4 <title>relatedTarget attribute for dragenter and dragleave events</title
> |
| 5 <meta name="viewport" content="width=device-width"> |
| 6 <script src="/resources/testharness.js"></script> |
| 7 <script src="/resources/testharnessreport.js"></script> |
| 8 <style> |
| 9 #outerdiv { |
| 10 padding: 50px; |
| 11 background: blue; |
| 12 } |
| 13 #innerdiv { |
| 14 width:200px; |
| 15 height:100px; |
| 16 background: green; |
| 17 } |
| 18 </style> |
| 19 <script> |
| 20 var drag_test = async_test("dragenter and dragleave are correctly fi
red."); |
| 21 var got_dragenter = false; |
| 22 var got_dragleave = false; |
| 23 function run() { |
| 24 var draggable = document.getElementById("draggable"); |
| 25 var innerdiv = document.getElementById("innerdiv"); |
| 26 draggable.addEventListener("dragstart", (e) => { |
| 27 e.dataTransfer.setData("text", draggable.innerHTML); |
| 28 }); |
| 29 innerdiv.addEventListener("dragenter", (e) => { |
| 30 if (!got_dragenter) { |
| 31 test(function() { |
| 32 assert_equals(e.relatedTarget.id, "outerdiv", "drage
nter event should have the correct relatedTarget."); |
| 33 }, "dragenter event should have the correct relatedTarge
t."); |
| 34 got_dragenter = true; |
| 35 } |
| 36 }); |
| 37 innerdiv.addEventListener("dragleave", (e) => { |
| 38 if (!got_dragleave) { |
| 39 test(function() { |
| 40 assert_equals(e.relatedTarget.id, "outerdiv", "dragl
eave event should have the correct relatedTarget."); |
| 41 }, "dragleave event should have the correct relatedTarge
t."); |
| 42 got_dragleave = true; |
| 43 if (got_dragenter) |
| 44 drag_test.done(); |
| 45 } |
| 46 }); |
| 47 } |
| 48 </script> |
| 49 </head> |
| 50 <body onload="run()"> |
| 51 <h1>Drag & Drop: relatedTarget attribute for dragenter and dragleave eve
nts</h1> |
| 52 <h2 id="pointerTypeDescription"></h2> |
| 53 <h4>Test Description: |
| 54 <ol> |
| 55 <li>Drag the text into the green box.</li> |
| 56 <li>Without releasing the drag, drag the text out of the green
box.</li> |
| 57 </ol> |
| 58 </h4> |
| 59 <br> |
| 60 <div id="draggable" draggable="true">Drag this text</br>over the green b
ox</div> |
| 61 <div id="outerdiv"> |
| 62 <div id="innerdiv"></div> |
| 63 </div> |
| 64 </body> |
| 65 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2842483002:
Set relatedtarget for dragleave/enter events (Closed)
