Chromium Code Reviews| 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 fired."); | |
|
dtapuska
2017/04/25 19:46:06
Um this line is commented out.. How does this work
Navid Zolghadr
2017/05/09 19:54:05
Done.
| |
| 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); | |
|
dtapuska
2017/04/25 19:46:06
Is this necessary?
Navid Zolghadr
2017/05/05 23:33:17
For some reason without this FF doesn't start the
| |
| 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 |