Source code
Revision control
Copy as Markdown
Other Tools
<!doctype html>
<html>
<head>
<title>HTML5 Drag and Drop: Fire dragenter event during the drag and drop processing</title>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
<meta name="assert" content="Fire dragenter event during the drag and drop processing"/>
<script type="text/javascript">
var EVENT, TARGET;
function DragenterEvent(evt)
{
if ((TARGET == evt.target) && (EVENT == evt.type))
{
document.getElementById("test_result").firstChild.data = "PASS";
}
else
{
document.getElementById("test_result").firstChild.data = "FAIL";
}
}
EVENT = "dragenter";
window.onload = function()
{
TARGET = document.getElementById("target");
TARGET.addEventListener(EVENT, DragenterEvent, false);
}
</script>
</head>
<body>
<pre>Description: Fire dragenter event during the drag and drop processing</pre>
<table id='testtable' border='1'>
<tr>
<td>Test Result</td>
<td>Test Assertion</td>
</tr>
<tr>
<td id='test_result'>Manual</td>
<td id='test_assertion'>Test passes if if the word "PASS" appears to the left after following the steps below.
<div id="manualsteps">
Steps:
<ol>
<li> Select the text inside the red box
<li> Drag it and enter the green box
</ol>
</div>
</td>
</tr>
</table>
<p>
</p>
<p>
If the user is indicating a different immediate user selection than during the last iteration (or if this is the first iteration), and if this immediate user selection is not the same as the current target element, then update the current target element as follows:
- If the new immediate user selection is null, Set the current target element to null also.
- If the new immediate user selection is in a non-DOM document or application, Set the current target element to the immediate user selection.
- Otherwise, Fire a DND event named dragenter at the immediate user selection.
</p>
<div style="border:2px red solid; width:200px; height:50px">SampleText</div>
<br /><br />
<input type="text" id="target" style="border:2px green solid; width:200px; height:50px"></input>
</body>
</html>