<html>
<head>
<script src="../../resources/js-test.js"></script>
<style>
#dropTarget, #dragMe { text-align: center; display: table-cell; vertical-align: middle }
#dropTarget {width: 256px; height: 256px; border: 1px dashed}
#dragMe {-webkit-user-drag: element; -webkit-user-select: none; background: #ff0000; width: 64px; height: 64px; color: white}
</style>
<script>
var dragMe;
var dropTarget;
var effectAllowedElem;
var dropEffectElem;
var consoleElm;
var event;
window.onload = function()
{
dragMe = document.getElementById("dragMe");
dropTarget = document.getElementById("dropTarget");
consoleElm = document.getElementById("console");
if (!dragMe || !dropTarget || !consoleElm)
return;
dragMe.ondragstart = dragStart;
dragMe.ondragend = dragEnd;
dropTarget.ondragenter = dragEntered;
dropTarget.ondragover = dragOver;
dropTarget.ondrop = drop;
runTest();
}
function dragStart(e)
{
var validEffectAllowedList = ["all", "copy", "copyLink", "copyMove", "link", "linkMove", "move", "none", "uninitialized"];
var effectAllowedListToTest = ["all", "copy", "bogus", "copyLink", "wrong", "copyMove", "linkCopyMove", "link",
"linkMove", "move", "none", "uninitialized", "dummy", "bogus", "fake", "illegal", null, undefined , ""];
event = e;
for (var i = 0; i < effectAllowedListToTest.length; i++) {
var effectAllowedBefore = e.dataTransfer.effectAllowed;
e.dataTransfer.effectAllowed = effectAllowedListToTest[i];
if (validEffectAllowedList.indexOf(effectAllowedListToTest[i]) != -1)
shouldBeEqualToString("event.dataTransfer.effectAllowed", effectAllowedListToTest[i]);
else
shouldBeEqualToString("event.dataTransfer.effectAllowed", effectAllowedBefore);
}
e.dataTransfer.setData('Text', e.target.textContent);
}
function dragEnd(e)
{
return;
}
function dragEntered(e)
{
dragEnteredAndUpdated(e);
}
function dragOver(e)
{
dragEnteredAndUpdated(e);
}
function dragEnteredAndUpdated(e)
{
var validDropEffectList = ["none", "copy", "link", "move", "link"];
var dropEffectListToTest = ["all", "copy", "bogus", "copyLink", "wrong", "copyMove", "linkCopyMove", "link",
"linkMove", "move", "none", "uninitialized", "dummy", "bogus", "fake", "illegal", null, undefined , ""];
event = e;
for (var i = 0; i < dropEffectListToTest.length; i++) {
var dropEffectBefore = e.dataTransfer.dropEffect;
e.dataTransfer.dropEffect = dropEffectListToTest[i];
if (validDropEffectList.indexOf(dropEffectListToTest[i]) != -1)
shouldBeEqualToString("event.dataTransfer.dropEffect", dropEffectListToTest[i]);
else
shouldBeEqualToString("event.dataTransfer.dropEffect", dropEffectBefore);
}
cancelDrag(e);
}
function drop(e)
{
cancelDrag(e);
}
function cancelDrag(e)
{
e.preventDefault();
}
function runTest()
{
if (!window.eventSender)
return;
if (window.testRunner)
testRunner.dumpAsText();
var startX = dragMe.offsetLeft + 10;
var startY = dragMe.offsetTop + dragMe.offsetHeight / 2;
var endX = dropTarget.offsetLeft + 10;
var endY = dropTarget.offsetTop + dropTarget.offsetHeight / 2;
eventSender.mouseMoveTo(startX, startY);
eventSender.mouseDown();
eventSender.leapForward(100);
eventSender.mouseMoveTo(endX, endY);
eventSender.mouseUp();
var testContainer = document.getElementById("test-container");
if (testContainer)
document.body.removeChild(testContainer);
debug('<br /><span class="pass">TEST COMPLETE</span>');
}
</script>
</head>
<body>
<p id="description"></p>
<div id="test-container">
<br/><br/>
<div id="dropTarget">Drop the red square onto me.<br/><br/></div>
<hr/>
<p>Items that can be dragged to the drop target:</p>
<div id="dragMe" draggable="true">Square</div>
<hr/>
</div>
<div id="console"></div>
<script>
description("This test checks that effectAllowed and dropEffect cannot be set to values that aren't defined in the spec");
</script>
</body>
</html>