mirror of
https://github.com/servo/servo.git
synced 2025-08-12 00:45:33 +01:00
Update web-platform-tests to revision 8a2ceb5f18911302b7a5c1cd2791f4ab50ad4326
This commit is contained in:
Josh Matthews
parent
462c272380
commit
1f531f66ea
5377 changed files with 174916 additions and 84369 deletions
|
|
@ -4,47 +4,47 @@
|
|||
<title>Canvas drag and drop carrying image as dataURL</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:105px;
|
||||
min-height:105px;
|
||||
text-align:center;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
border:solid thin navy;}
|
||||
{width:105px;
|
||||
min-height:105px;
|
||||
text-align:center;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
border:solid thin navy;}
|
||||
p:first-child
|
||||
{padding-left:12px;}
|
||||
{padding-left:12px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function addImage(event)
|
||||
{var c = document.createElement('img');
|
||||
c.setAttribute('src',event.dataTransfer.getData('text/uri-list'));
|
||||
document.querySelector('div').appendChild(c);}
|
||||
{var c = document.createElement('img');
|
||||
c.setAttribute('src',event.dataTransfer.getData('text/uri-list'));
|
||||
document.querySelector('div').appendChild(c);}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/uri-list', document.querySelector('canvas').toDataURL('image/png'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/uri-list', document.querySelector('canvas').toDataURL('image/png'));}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern above to the box below. It should be copied to the box once you drop it there.</p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="addImage(event)"
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="addImage(event)"
|
||||
/>
|
||||
<script type="application/ecmascript">
|
||||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,32 +4,32 @@
|
|||
<title>Drag and drop: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,17 +4,17 @@
|
|||
<title>Canvas drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,32 +4,32 @@
|
|||
<title>Drag and drop from iframe: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:150px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
{width:150px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<p><iframe src="003-1.xhtml">Green box</iframe></p>
|
||||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,32 +4,32 @@
|
|||
<title>Drag and drop from object: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
object
|
||||
{width:150px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
{width:150px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<p><object type="application/xhtml+xml" data="data:application/xhtml+xml,%3Chtml%20xmlns%3D%22http%3A//www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Ctitle%3ECanvas%20drag%20and%20drop%3C/title%3E%3Cstyle%20type%3D%22text/css%22%3Ediv%7Bwidth%3A20px%3Bheight%3A20px%3Bbackground-color%3Agreen%3B%7D%3C/style%3E%3Cscript%20type%3D%22application/ecmascript%22%3Efunction%20start%28event%29%7Bevent.dataTransfer.effectAllowed%20%3D%20%27copy%27%3Bevent.dataTransfer.setData%28%27text/plain%27%2C%20%27green%27%29%3B%7D%3C/script%3E%3C/head%3E%3Cbody%3E%3Cdiv%20draggable%3D%22true%22%20ondragstart%3D%22start%28event%29%22/%3E%3C/body%3E%3C/html%3E">Green box</object></p>
|
||||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,18 +4,18 @@
|
|||
<title>Drag and drop to iframe: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
iframe
|
||||
{width:200px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
{width:200px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -23,4 +23,4 @@ function start(event)
|
|||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p><iframe src="helper-drop-here-canvas.xhtml">Canvas</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,17 +4,17 @@
|
|||
<title>Drag and drop to object: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
object
|
||||
{width:200px;
|
||||
height:200px;}
|
||||
{width:200px;
|
||||
height:200px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -22,4 +22,4 @@ function start(event)
|
|||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p><object type="application/xhtml+xml" data="data:application/xhtml+xml,%3Chtml%20xmlns%3D%22http%3A//www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Ctitle%3ECanvas%20drag%20and%20drop%3C/title%3E%3Cscript%20type%3D%22application/ecmascript%22%3Efunction%20paint%28color%29%7Bvar%20canvas%20%3D%20document.querySelector%28%27canvas%27%29%2Cc%20%3D%20canvas.getContext%28%272d%27%29%3Bc.fillStyle%20%3D%20color%3Bc.beginPath%28%29%3Bc.moveTo%280%2C0%29%3Bc.lineTo%28100%2C0%29%3Bc.lineTo%28100%2C100%29%3Bc.lineTo%280%2C100%29%3Bc.closePath%28%29%3Bc.fill%28%29%3B%7Dfunction%20start%28event%29%7Bevent.dataTransfer.effectAllowed%20%3D%20%27copy%27%3Bevent.dataTransfer.setData%28%27text/plain%27%2C%20document.querySelector%28%27input%27%29.value%29%3B%7D%3C/script%3E%3C/head%3E%3Cbody%20onload%3D%22paint%28%27gray%27%29%22%3E%3Cp%3E%3Ccanvas%20width%3D%22100%22%20height%3D%22100%22%20ondragenter%3D%22event.preventDefault%28%29%22%20ondragover%3D%22return%20false%22%20ondrop%3D%22paint%28event.dataTransfer.getData%28%27text/plain%27%29%29%22%3ECanvas%3C/canvas%3E%3C/p%3E%3C/body%3E%3C/html%3E">Canvas</object></p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
<title>Drag and drop between iframes: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:300px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
{width:300px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -14,4 +14,4 @@ iframe
|
|||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p><iframe src="helper-drop-here-canvas.xhtml">Canvas</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,9 +4,9 @@
|
|||
<title>Drag and drop from iframe to object: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
iframe, object
|
||||
{width:300px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
{width:300px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -14,4 +14,4 @@ iframe, object
|
|||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p><object type="application/xhtml+xml" data="data:application/xhtml+xml,%3Chtml%20xmlns%3D%22http%3A//www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Ctitle%3ECanvas%20drag%20and%20drop%3C/title%3E%3Cscript%20type%3D%22application/ecmascript%22%3Efunction%20paint%28color%29%7Bvar%20canvas%20%3D%20document.querySelector%28%27canvas%27%29%2Cc%20%3D%20canvas.getContext%28%272d%27%29%3Bc.fillStyle%20%3D%20color%3Bc.beginPath%28%29%3Bc.moveTo%280%2C0%29%3Bc.lineTo%28100%2C0%29%3Bc.lineTo%28100%2C100%29%3Bc.lineTo%280%2C100%29%3Bc.closePath%28%29%3Bc.fill%28%29%3B%7Dfunction%20start%28event%29%7Bevent.dataTransfer.effectAllowed%20%3D%20%27copy%27%3Bevent.dataTransfer.setData%28%27text/plain%27%2C%20document.querySelector%28%27input%27%29.value%29%3B%7D%3C/script%3E%3C/head%3E%3Cbody%20onload%3D%22paint%28%27gray%27%29%22%3E%3Cp%3E%3Ccanvas%20width%3D%22100%22%20height%3D%22100%22%20ondragenter%3D%22event.preventDefault%28%29%22%20ondragover%3D%22return%20false%22%20ondrop%3D%22paint%28event.dataTransfer.getData%28%27text/plain%27%29%29%22%3ECanvas%3C/canvas%3E%3C/p%3E%3C/body%3E%3C/html%3E">Canvas</object></p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
<title>Drag and drop between objects: dropping block element onto canvas</title>
|
||||
<style type="text/css">
|
||||
object
|
||||
{width:300px;
|
||||
height:200px;}
|
||||
{width:300px;
|
||||
height:200px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -13,4 +13,4 @@ object
|
|||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
<p><object type="application/xhtml+xml" data="data:application/xhtml+xml,%3Chtml%20xmlns%3D%22http%3A//www.w3.org/1999/xhtml%22%3E%3Chead%3E%3Ctitle%3ECanvas%20drag%20and%20drop%3C/title%3E%3Cscript%20type%3D%22application/ecmascript%22%3Efunction%20paint%28color%29%7Bvar%20canvas%20%3D%20document.querySelector%28%27canvas%27%29%2Cc%20%3D%20canvas.getContext%28%272d%27%29%3Bc.fillStyle%20%3D%20color%3Bc.beginPath%28%29%3Bc.moveTo%280%2C0%29%3Bc.lineTo%28100%2C0%29%3Bc.lineTo%28100%2C100%29%3Bc.lineTo%280%2C100%29%3Bc.closePath%28%29%3Bc.fill%28%29%3B%7Dfunction%20start%28event%29%7Bevent.dataTransfer.effectAllowed%20%3D%20%27copy%27%3Bevent.dataTransfer.setData%28%27text/plain%27%2C%20document.querySelector%28%27input%27%29.value%29%3B%7D%3C/script%3E%3C/head%3E%3Cbody%20onload%3D%22paint%28%27gray%27%29%22%3E%3Cp%3E%3Ccanvas%20width%3D%22100%22%20height%3D%22100%22%20ondragenter%3D%22event.preventDefault%28%29%22%20ondragover%3D%22return%20false%22%20ondrop%3D%22paint%28event.dataTransfer.getData%28%27text/plain%27%29%29%22%3ECanvas%3C/canvas%3E%3C/p%3E%3C/body%3E%3C/html%3E">Canvas</object></p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,18 +4,18 @@
|
|||
<title>Canvas drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>Drag green box above to the gray canvas below. Canvas should turn green when you drop green box on it.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,39 +4,39 @@
|
|||
<title>Drag and drop and vertical scrolling: dropping block element onto canvas inside scrollable container</title>
|
||||
<style type="text/css">
|
||||
div[draggable]
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{height:100px;
|
||||
width:150px;
|
||||
overflow-y:scroll;}
|
||||
{height:100px;
|
||||
width:150px;
|
||||
overflow-y:scroll;}
|
||||
canvas
|
||||
{display:block;
|
||||
margin-top:100px;}
|
||||
{display:block;
|
||||
margin-top:100px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>You should be able to drag green box above to the gray canvas at the bottom of scrollable container (dragging towards the bottom edge triggers scrolling). Canvas should be repainted to match dropped color.</p>
|
||||
<div>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,39 +4,39 @@
|
|||
<title>Drag and drop and horizontal scrolling: dropping block element onto canvas inside scrollable container</title>
|
||||
<style type="text/css">
|
||||
div[draggable]
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{height:150px;
|
||||
width:100px;
|
||||
overflow-x:scroll;}
|
||||
{height:150px;
|
||||
width:100px;
|
||||
overflow-x:scroll;}
|
||||
canvas
|
||||
{display:block;
|
||||
margin-left:100px;}
|
||||
{display:block;
|
||||
margin-left:100px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>You should be able to drag green box above to the gray canvas at the right edge of scrollable container (dragging towards the right edge triggers scrolling). Canvas should be repainted to match dropped color.</p>
|
||||
<div>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,39 +4,39 @@
|
|||
<title>Drag and drop and scrolling: dropping block element onto canvas inside scrollable container</title>
|
||||
<style type="text/css">
|
||||
div[draggable]
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
overflow:scroll;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
overflow:scroll;}
|
||||
canvas
|
||||
{display:block;
|
||||
margin:100px 0 0 100px;}
|
||||
{display:block;
|
||||
margin:100px 0 0 100px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>You should be able to drag green box above to the gray canvas in the right-bottom corner of the scrollable container (dragging towards the corner triggers scrolling). Canvas should be repainted to match dropped color.</p>
|
||||
<div>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,22 +5,22 @@
|
|||
<script src="../../resources/crossorigin.sub.js"></script>
|
||||
<style type="text/css">
|
||||
div {
|
||||
width:105px;
|
||||
min-height:105px;
|
||||
text-align:center;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
border:solid thin navy;
|
||||
width:105px;
|
||||
min-height:105px;
|
||||
text-align:center;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
border:solid thin navy;
|
||||
}
|
||||
p:first-child {
|
||||
padding-left:12px;
|
||||
padding-left:12px;
|
||||
}
|
||||
#image { visibility: hidden; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag the navy square above to the box below.</p>
|
||||
<div></div>
|
||||
|
|
@ -30,29 +30,29 @@ p:first-child {
|
|||
document.getElementsByTagName("img")[0].src = crossOriginUrl("www", "../../resources/100x100-navy.png");
|
||||
|
||||
window.onload = function() {
|
||||
var canvas = document.getElementsByTagName('canvas')[0], div = document.getElementsByTagName('div')[0], failed = [];
|
||||
var context = canvas.getContext('2d');
|
||||
var image = document.getElementById('image');
|
||||
context.drawImage(image, 0, 0);
|
||||
var canvas = document.getElementsByTagName('canvas')[0], div = document.getElementsByTagName('div')[0], failed = [];
|
||||
var context = canvas.getContext('2d');
|
||||
var image = document.getElementById('image');
|
||||
context.drawImage(image, 0, 0);
|
||||
div.ondragover = div.ondragenter = function(e) {
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
};
|
||||
div.ondrop = canvas.ondragstart = function(e) {
|
||||
if( e.type == 'dragstart' ) {
|
||||
e.dataTransfer.setData('Text', 'dummy text');
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
}
|
||||
for( var i = 0; i < e.dataTransfer.types.length; i++ ) {
|
||||
if( e.dataTransfer.types[i].match(/image\//) ) {
|
||||
failed[failed.length] = e.dataTransfer.types[i];
|
||||
}
|
||||
}
|
||||
if( e.type == 'drop' ) {
|
||||
e.preventDefault();
|
||||
document.getElementsByTagName('p')[1].innerHTML = failed.length ? ( 'FAIL (found ' + failed.join() + ')' ) : 'PASS';
|
||||
}
|
||||
};
|
||||
div.ondrop = canvas.ondragstart = function(e) {
|
||||
if( e.type == 'dragstart' ) {
|
||||
e.dataTransfer.setData('Text', 'dummy text');
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
}
|
||||
for( var i = 0; i < e.dataTransfer.types.length; i++ ) {
|
||||
if( e.dataTransfer.types[i].match(/image\//) ) {
|
||||
failed[failed.length] = e.dataTransfer.types[i];
|
||||
}
|
||||
}
|
||||
if( e.type == 'drop' ) {
|
||||
e.preventDefault();
|
||||
document.getElementsByTagName('p')[1].innerHTML = failed.length ? ( 'FAIL (found ' + failed.join() + ')' ) : 'PASS';
|
||||
}
|
||||
};
|
||||
};
|
||||
]]></script>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -4,16 +4,16 @@
|
|||
<title>Canvas drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
{width:20px;
|
||||
height:20px;
|
||||
background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div draggable="true" ondragstart="start(event)"/></body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,24 +4,24 @@
|
|||
<title>Canvas drag and drop: helper file</title>
|
||||
<script type="application/ecmascript">
|
||||
function paint(color)
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
c.fillStyle = color;
|
||||
c.beginPath();
|
||||
c.moveTo(0,0);
|
||||
c.lineTo(100,0);
|
||||
c.lineTo(100,100);
|
||||
c.lineTo(0,100);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
event.dataTransfer.setData('text/plain', 'green');}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="paint('gray')">
|
||||
<p>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
<canvas width="100" height="100" ondragenter="event.preventDefault()" ondragover="return false" ondrop="paint(event.dataTransfer.getData('text/plain'))">Canvas</canvas>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@
|
|||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
var doneonce = false;
|
||||
var doneonce = false;
|
||||
document.getElementsByTagName('div')[0].ondragstart = function(e) {
|
||||
alert( doneonce ? 'Dismiss this dialog. PASS if the browser does not crash.' : 'Dismiss this dialog. The browser should not crash. Without re-focusing the page first, try dragging the orange square a second time. If a second alert does not appear, release the drag, and then try dragging the orange square a third time.' );
|
||||
doneonce = true;
|
||||
alert( doneonce ? 'Dismiss this dialog. PASS if the browser does not crash.' : 'Dismiss this dialog. The browser should not crash. Without re-focusing the page first, try dragging the orange square a second time. If a second alert does not appear, release the drag, and then try dragging the orange square a third time.' );
|
||||
doneonce = true;
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -12,31 +12,31 @@
|
|||
window.onload = function() {
|
||||
var blue = document.getElementsByTagName('div')[0], fails = [];
|
||||
blue.ondragover = blue.ondragenter = function(e) {
|
||||
e.preventDefault();
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
if( e.dataTransfer.getData('text') ) {
|
||||
fails[fails.length] = '"' + e.dataTransfer.getData('text') + '" exposed during event ' + e.type;
|
||||
}
|
||||
fails[fails.length] = '"' + e.dataTransfer.getData('text') + '" exposed during event ' + e.type;
|
||||
}
|
||||
};
|
||||
blue.ondrop = function(e) {
|
||||
e.preventDefault();
|
||||
blue.ondrop = function(e) {
|
||||
e.preventDefault();
|
||||
if( !e.dataTransfer.types.length ) {
|
||||
fails[fails.length] = 'no types found during event drop';
|
||||
}
|
||||
var foundtext = false;
|
||||
fails[fails.length] = 'no types found during event drop';
|
||||
}
|
||||
var foundtext = false;
|
||||
for( var i = 0; i < e.dataTransfer.types.length; i++ ) {
|
||||
if( e.dataTransfer.types[i] == 'text/plain' ) {
|
||||
foundtext = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if( !foundtext ) {
|
||||
fails[fails.length] = 'text/plain type not found during event drop';
|
||||
}
|
||||
if( e.dataTransfer.types[i] == 'text/plain' ) {
|
||||
foundtext = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if( !foundtext ) {
|
||||
fails[fails.length] = 'text/plain type not found during event drop';
|
||||
}
|
||||
if( e.dataTransfer.getData('text') != 'dummy text' ) {
|
||||
fails[fails.length] = 'getData returned ' + e.dataTransfer.getData('text') + ' instead of "dummy text"';
|
||||
}
|
||||
document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL:<br>' + fails.join('<br>') ) : 'PASS';
|
||||
fails[fails.length] = 'getData returned ' + e.dataTransfer.getData('text') + ' instead of "dummy text"';
|
||||
}
|
||||
document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL:<br>' + fails.join('<br>') ) : 'PASS';
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ window.onload = function() {
|
|||
var orange = document.getElementsByTagName('div')[0];
|
||||
orange.ondragstart = function(e) {
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ window.onload = function() {
|
|||
var orange = document.getElementsByTagName('div')[0];
|
||||
orange.ondragstart = function(e) {
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -12,88 +12,88 @@
|
|||
window.onload = function() {
|
||||
var blue = document.getElementsByTagName('div')[0], fails = [];
|
||||
blue.ondragover = blue.ondragenter = function(e) {
|
||||
e.preventDefault();
|
||||
e.preventDefault();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
if( !parent.evs[e.type] ) { parent.evs[e.type] = {}; }
|
||||
parent.evs[e.type].dataTransfer = e.dataTransfer;
|
||||
parent.evs[e.type].items = e.dataTransfer.items;
|
||||
parent.evs[e.type].types = e.dataTransfer.types;
|
||||
parent.evs[e.type].files = e.dataTransfer.files;
|
||||
if( parent.evs[e.type].dataTransfer != e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].items !== e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].types !== e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].files !== e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning the same object during '+e.type;
|
||||
}
|
||||
//http://dev.w3.org/html5/spec/dnd.html#datatransfer
|
||||
//"The * attribute must return a * object associated with the DataTransfer object."
|
||||
//Note that it is associated with the DataTransfer object, *not* the data store
|
||||
//http://dev.w3.org/html5/spec/dnd.html#dragevent
|
||||
//"when a user agent is required to fire a DND event named e at an element, using a particular drag data store...
|
||||
//Let dataTransfer be a newly created DataTransfer object associated with the given drag data store."
|
||||
//A new DataTransfer object therefore means a new set of properties, not the same ones as last event
|
||||
if( parent.evs.dragstart.dataTransfer === e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.items && parent.evs.dragstart.items === e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.types && parent.evs.dragstart.types === e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.files && parent.evs.dragstart.files === e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( !parent.evs[e.type] ) { parent.evs[e.type] = {}; }
|
||||
parent.evs[e.type].dataTransfer = e.dataTransfer;
|
||||
parent.evs[e.type].items = e.dataTransfer.items;
|
||||
parent.evs[e.type].types = e.dataTransfer.types;
|
||||
parent.evs[e.type].files = e.dataTransfer.files;
|
||||
if( parent.evs[e.type].dataTransfer != e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].items !== e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].types !== e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].files !== e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning the same object during '+e.type;
|
||||
}
|
||||
//http://dev.w3.org/html5/spec/dnd.html#datatransfer
|
||||
//"The * attribute must return a * object associated with the DataTransfer object."
|
||||
//Note that it is associated with the DataTransfer object, *not* the data store
|
||||
//http://dev.w3.org/html5/spec/dnd.html#dragevent
|
||||
//"when a user agent is required to fire a DND event named e at an element, using a particular drag data store...
|
||||
//Let dataTransfer be a newly created DataTransfer object associated with the given drag data store."
|
||||
//A new DataTransfer object therefore means a new set of properties, not the same ones as last event
|
||||
if( parent.evs.dragstart.dataTransfer === e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.items && parent.evs.dragstart.items === e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.types && parent.evs.dragstart.types === e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.files && parent.evs.dragstart.files === e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
};
|
||||
blue.ondrop = function(e) {
|
||||
parent.evs[e.type] = {};
|
||||
parent.evs[e.type].dataTransfer = e.dataTransfer;
|
||||
parent.evs[e.type].items = e.dataTransfer.items;
|
||||
parent.evs[e.type].types = e.dataTransfer.types;
|
||||
parent.evs[e.type].files = e.dataTransfer.files;
|
||||
if( parent.evs[e.type].dataTransfer !== e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].items !== e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].types !== e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].files !== e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning the same object during '+e.type;
|
||||
}
|
||||
if( parent.evs.dragstart.dataTransfer === e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.items && parent.evs.dragstart.items === e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.types && parent.evs.dragstart.types === e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.files && parent.evs.dragstart.files === e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL:<br>' + fails.join('<br>') ) : 'PASS';
|
||||
blue.ondrop = function(e) {
|
||||
parent.evs[e.type] = {};
|
||||
parent.evs[e.type].dataTransfer = e.dataTransfer;
|
||||
parent.evs[e.type].items = e.dataTransfer.items;
|
||||
parent.evs[e.type].types = e.dataTransfer.types;
|
||||
parent.evs[e.type].files = e.dataTransfer.files;
|
||||
if( parent.evs[e.type].dataTransfer !== e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].items !== e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].types !== e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is not returning the same object during '+e.type;
|
||||
}
|
||||
if( !e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning anything during '+e.type;
|
||||
} else if( parent.evs[e.type].files !== e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is not returning the same object during '+e.type;
|
||||
}
|
||||
if( parent.evs.dragstart.dataTransfer === e.dataTransfer ) {
|
||||
fails[fails.length] = '.dataTransfer is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.items && parent.evs.dragstart.items === e.dataTransfer.items ) {
|
||||
fails[fails.length] = '.items is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.types && parent.evs.dragstart.types === e.dataTransfer.types ) {
|
||||
fails[fails.length] = '.types is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
if( e.dataTransfer.files && parent.evs.dragstart.files === e.dataTransfer.files ) {
|
||||
fails[fails.length] = '.files is returning the same object during '+e.type+' as it did during dragstart';
|
||||
}
|
||||
document.getElementsByTagName('p')[0].innerHTML = fails.length ? ( 'FAIL:<br>' + fails.join('<br>') ) : 'PASS';
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -14,12 +14,12 @@ window.onload = function() {
|
|||
var orange = document.getElementsByTagName('div')[0];
|
||||
orange.ondragstart = function(e) {
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
evs[e.type] = {};
|
||||
evs[e.type].dataTransfer = e.dataTransfer;
|
||||
evs[e.type].items = e.dataTransfer.items;
|
||||
evs[e.type].types = e.dataTransfer.types;
|
||||
evs[e.type].files = e.dataTransfer.files;
|
||||
e.dataTransfer.setData('text', 'dummy text');
|
||||
evs[e.type] = {};
|
||||
evs[e.type].dataTransfer = e.dataTransfer;
|
||||
evs[e.type].items = e.dataTransfer.items;
|
||||
evs[e.type].types = e.dataTransfer.types;
|
||||
evs[e.type].files = e.dataTransfer.files;
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -4,51 +4,51 @@
|
|||
<title>dataTransfer.setData/getData during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green and test results should appear below.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -57,15 +57,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,44 +4,44 @@
|
|||
<title>dataTransfer.setData/getData during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAEq0lEQVR42u1dvU4bQRAeR0RCCilSp0peIoKGB4DSXYRDlcZlFClKBI4bB/kV/AymIDwCTahiicaioEOxhCsjWVTJziyKMfYZn+9ud3bvG2mEZB13u9+nndmf2Rki7fKFXtEBbVKD9o22jB4bPaND6hm9Mjo0enevw/vfevKMfbYl/8vv4HdBUkvFALhltG2A7dN3+pur8jv53fwN/hZkjjRo3eiuAatjdJA7CcnkDOSb/G1uQ6mFzUeDagaQrvl764yEJOU22LbUymXaGrRhOt40OvJOQvLIGUkbP9GLeIn4SM9NJ+tOTVI+Jq0ubY9sVFRNxy6DIWKWmEvpQ/ByQNumI+fBEjHrZ86lT8HJV3ptGn8aDRGzxJxKHwMZFe9Mg6+jJWNCyrX0VbUc0nuj4+jJmPiWsfRZodN+ZvSoNETMjpYjwUCFfKaXpjEnpSVjQsqJYOF5ZLw1elF6MiakXAgmnpw378DegIgZUm4EGw8jA2QsIuUbvXHpM2CmljFfhfsUO5uCA0/j6AudfZV5arv6WuVHcYs+ALwqKTkvHnmLoEwr8CJW9Llts9iNwvj3plzsfeWyIRnzrq37kfIzq6naBpA5a6bzlJgOl/SMkl+rklEFgIX5k5THwTYgIdwzcP2jhM/o19KsOeoArnBS6suaqo2gQnXCJWSwXNwXB4gBMFekNBeTwSGUmiMK4yNktDhsleNaAZRrUvYWmasuQHJOSDdpdKyriEIvo9maexWC70gAIF/bKTvzzFUH4HgbJZ3HdFSw9vC6lfKHpq7X8X07AOOblK2HhLQBindC2g/9Rx+gePcj/cnqHIDoUFm1c9gjwNAy/d0kyXIAMLSYrQ8kqScAhhbH3iLJBwIwtBByTJKkBWBoIeSMJHMOwNBCyG+SdEYAQ4tTvyLJMQUwtBAyJEn8BTC0EHIHQhQSApOlzGTBqaty6jzVAhhaCOlhYahuYYitE02EHGNzURchLZItX4ChhZB9HFBpUjmgwhGuHv0feI0gBw1T3j7CgHT5jzYC5XQRsjUdSsrhjADGl7ka0EylBgRb+ySkMy9rww7A8Waududf2MH9Qh9k3CbXLsGVNh/mqrvojuEeQHI+Qmq4Fq1ndIyeruaDxAEuCWk+ncmB0z3gepubtQenMUHyGTWELJl8xk6B15CeqVAyLtPXtUICsyJnVivWs+J0dAAwbzLOkQRTk2YuKsapTQFkXqPjlDILEinnRcZ1fpXdkGo866xqnH9FNyTjz0JIQZXcuPQCAE5rqo6oMEFBl7RknBRfTg8lj5Yl48JdGT0ueIWiYIvIuHFfPg9l85LJcF42b+JTUFjysZnyVlhy2qfA0asovTo9+0JxYnWC8t0KBQXuFYrdkIy3mBj3LbeNQrejZTuqOlbcl8znGTqcfjXoM3pboqgaPhEPxda1qgcVYsRt5TanDkgISWzcV1N1hCS3jdu4dNxUDMIhlBzXysHGGspkcBtsW2pPh3fGLrZ2ya5cXHFp0qxJ6si3E68EQCpy344vQRZxO5jfye+2d/oqgHsV02Z3lvcl9QTnA+EkLZw5h9MZcY4pTvxldXj/W0+esc+25H/5HQGYon+Q5f+MwFz+8QAAAABJRU5ErkJggg==', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -51,4 +51,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,45 +4,45 @@
|
|||
<title>dataTransfer.setData/getData during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -52,4 +52,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>dataTransfer.setData/getData during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>dataTransfer.setData/getData during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,45 +4,45 @@
|
|||
<title>dataTransfer.setData/getData during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -52,4 +52,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,47 +4,47 @@
|
|||
<title>dataTransfer.setData/getData during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -54,4 +54,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>Influence of reload during drag and drop on datastore</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location.reload();}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location.reload();}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,27 +4,27 @@
|
|||
<title>Redirect during drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
html, body
|
||||
{height:100%;}
|
||||
{height:100%;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('body').setAttribute('style','background-color:teal;color:white;');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('body').setAttribute('style','background-color:teal;color:white;');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -32,4 +32,4 @@ function say(it)
|
|||
<p>Drop box here. Page should turn green and test results should appear below.</p>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,22 +4,22 @@
|
|||
<title>Influence of redirect during drag and drop on datastore</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location = '009-1.xhtml'}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location = '009-1.xhtml'}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -27,4 +27,4 @@ function start(event)
|
|||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>Try to drag box above. You should be redirected to the new page and be able to drop it there.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,24 +4,24 @@
|
|||
<title>History navigation during drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{margin:200px 0 0 200px;
|
||||
width:200px;
|
||||
height:100px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{margin:200px 0 0 200px;
|
||||
width:200px;
|
||||
height:100px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
div[ondragenter]:before
|
||||
{display:block;
|
||||
content:"";
|
||||
border-style:solid;
|
||||
position:relative;
|
||||
top:-50px;
|
||||
left:-200px;
|
||||
border-width:100px;
|
||||
border-color:transparent navy transparent transparent;}
|
||||
{display:block;
|
||||
content:"";
|
||||
border-style:solid;
|
||||
position:relative;
|
||||
top:-50px;
|
||||
left:-200px;
|
||||
border-width:100px;
|
||||
border-color:transparent navy transparent transparent;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Drag box to the blue arrow but don't drop it yet. You should be returned back to start page.</p>
|
||||
<div ondragenter="event.preventDefault()" ondragover="history.go(-1)"/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,37 +4,37 @@
|
|||
<title>Influence of history navigation during drag and drop on datastore</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location = '010-1.xhtml'}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
window.location = '010-1.xhtml'}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -44,4 +44,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,23 +4,23 @@
|
|||
<title>Drag and drop datastore: dragging element to iframe</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
iframe
|
||||
{width:500px;
|
||||
height:500px;}
|
||||
{width:500px;
|
||||
height:500px;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -29,4 +29,4 @@ function start(event)
|
|||
<p>Drag box above to the frame below.</p>
|
||||
<iframe src="helper-drop-box-here.xhtml">XHTML document</iframe>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,24 +4,24 @@
|
|||
<title>Drag and drop datastore: dragging element to object</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
object
|
||||
{width:500px;
|
||||
height:500px;
|
||||
border:solid medium navy;}
|
||||
{width:500px;
|
||||
height:500px;
|
||||
border:solid medium navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -30,4 +30,4 @@ function start(event)
|
|||
<p>Drag box above to the frame below.</p>
|
||||
<object type="application/xhtml+xml" data="helper-drop-box-here.xhtml">XHTML document</object>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,20 +4,20 @@
|
|||
<title>Drag and drop datastore: helper file</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -25,4 +25,4 @@ function start(event)
|
|||
<div draggable="true" ondragstart="start(event)"/>
|
||||
<p>Drag box above to the frame below.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,45 +4,45 @@
|
|||
<title>Drag and drop datastore: helper file</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -52,4 +52,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,62 +1,62 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Using dataTransfer in new thread</title>
|
||||
<style type="text/css">
|
||||
<head>
|
||||
<title>Using dataTransfer in new thread</title>
|
||||
<style type="text/css">
|
||||
blockquote { height: 100px; width: 100px; background: orange; margin: 0; padding: 0; float: left; }
|
||||
blockquote + blockquote { background: blue; }
|
||||
blockquote + blockquote + blockquote { background: fuchsia; }
|
||||
blockquote + div { clear: left; }
|
||||
</style>
|
||||
<script type="text/javascript" src="/resources/testharness.js"></script>
|
||||
<script type="text/javascript">
|
||||
</style>
|
||||
<script type="text/javascript" src="/resources/testharness.js"></script>
|
||||
<script type="text/javascript">
|
||||
setup(function () {},{explicit_done:true,explicit_timeout:true});
|
||||
window.onload = function () {
|
||||
|
||||
var orange = document.getElementsByTagName('blockquote')[0],
|
||||
blue = document.getElementsByTagName('blockquote')[1],
|
||||
fuchsia = document.getElementsByTagName('blockquote')[2],
|
||||
evtdone = {};
|
||||
var orange = document.getElementsByTagName('blockquote')[0],
|
||||
blue = document.getElementsByTagName('blockquote')[1],
|
||||
fuchsia = document.getElementsByTagName('blockquote')[2],
|
||||
evtdone = {};
|
||||
|
||||
orange.ondragstart = function (e) {
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
e.dataTransfer.setData('text','dragstart real data');
|
||||
var dataTransfer = e.dataTransfer;
|
||||
setTimeout(function () {
|
||||
test(function () {
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 1' );
|
||||
dataTransfer.setData('text','new thread after dragstart');
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 2' );
|
||||
},'dragstart data store should be protected after new thread starts');
|
||||
},0);
|
||||
};
|
||||
orange.ondragstart = function (e) {
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
e.dataTransfer.setData('text','dragstart real data');
|
||||
var dataTransfer = e.dataTransfer;
|
||||
setTimeout(function () {
|
||||
test(function () {
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 1' );
|
||||
dataTransfer.setData('text','new thread after dragstart');
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 2' );
|
||||
},'dragstart data store should be protected after new thread starts');
|
||||
},0);
|
||||
};
|
||||
|
||||
fuchsia.ondragenter = fuchsia.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
fuchsia.ondragenter = fuchsia.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
fuchsia.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
var dataTransfer = e.dataTransfer;
|
||||
setTimeout(function () {
|
||||
test(function () {
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 1' );
|
||||
dataTransfer.setData('text','new thread after dragstart');
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 2' );
|
||||
},'drop data store should be protected after new thread starts');
|
||||
done();
|
||||
},0);
|
||||
};
|
||||
fuchsia.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
var dataTransfer = e.dataTransfer;
|
||||
setTimeout(function () {
|
||||
test(function () {
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 1' );
|
||||
dataTransfer.setData('text','new thread after dragstart');
|
||||
assert_equals( dataTransfer.getData('text'), '', 'step 2' );
|
||||
},'drop data store should be protected after new thread starts');
|
||||
done();
|
||||
},0);
|
||||
};
|
||||
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>Drag the orange square over the blue square then the fuchsia square, then release it.</p>
|
||||
<blockquote draggable="true"></blockquote>
|
||||
<blockquote></blockquote>
|
||||
<blockquote></blockquote>
|
||||
<div id="log"></div>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>Drag the orange square over the blue square then the fuchsia square, then release it.</p>
|
||||
<blockquote draggable="true"></blockquote>
|
||||
<blockquote></blockquote>
|
||||
<blockquote></blockquote>
|
||||
<div id="log"></div>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.clearData during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,37 +15,37 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:text/plain,FAIL', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -55,4 +55,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.clearData during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,37 +15,37 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -55,4 +55,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.clearData during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,37 +16,37 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -56,4 +56,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.clearData during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,37 +16,37 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -56,4 +56,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.clearData during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,43 +15,43 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:text/plain,FAIL', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -61,4 +61,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
<title>dataTransfer.clearData during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -17,37 +17,37 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -57,4 +57,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.clearData during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,43 +15,43 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length > l)
|
||||
{say('items.length (dragover) : FAIL' + event.dataTransfer.items.length)}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length < l)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green and test results should appear below.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -60,15 +60,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,45 +4,45 @@
|
|||
<title>dataTransfer.clearData and reload during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
window.location.reload();}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.clearData(dataTypes[i]);}
|
||||
window.location.reload();}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -52,4 +52,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>Clear datastore data during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:text/plain,FAIL', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>Clear datastore data during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,47 +4,47 @@
|
|||
<title>Clear datastore data during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -54,4 +54,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>Clear datastore data during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,36 +16,36 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'],
|
||||
l = 0;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -55,4 +55,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,52 +4,52 @@
|
|||
<title>Clear datastore data during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:text/plain,FAIL', 'FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -59,4 +59,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,48 +4,48 @@
|
|||
<title>Clear datastore data during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -55,4 +55,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,52 +4,52 @@
|
|||
<title>Clear datastore data during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['FAIL', 'data:text/plain,FAIL', '<result>FAIL</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">FAIL</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>FAIL</p></body></html>', 'FAIL'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
l = event.dataTransfer.items.length;
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
event.dataTransfer.clearData();
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length != 0)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length == 0)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == '')?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green and test results should appear below.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -58,15 +58,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,110 +15,110 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -127,15 +127,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,104 +15,104 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAEq0lEQVR42u1dvU4bQRAeR0RCCilSp0peIoKGB4DSXYRDlcZlFClKBI4bB/kV/AymIDwCTahiicaioEOxhCsjWVTJziyKMfYZn+9ud3bvG2mEZB13u9+nndmf2Rki7fKFXtEBbVKD9o22jB4bPaND6hm9Mjo0enevw/vfevKMfbYl/8vv4HdBUkvFALhltG2A7dN3+pur8jv53fwN/hZkjjRo3eiuAatjdJA7CcnkDOSb/G1uQ6mFzUeDagaQrvl764yEJOU22LbUymXaGrRhOt40OvJOQvLIGUkbP9GLeIn4SM9NJ+tOTVI+Jq0ubY9sVFRNxy6DIWKWmEvpQ/ByQNumI+fBEjHrZ86lT8HJV3ptGn8aDRGzxJxKHwMZFe9Mg6+jJWNCyrX0VbUc0nuj4+jJmPiWsfRZodN+ZvSoNETMjpYjwUCFfKaXpjEnpSVjQsqJYOF5ZLw1elF6MiakXAgmnpw378DegIgZUm4EGw8jA2QsIuUbvXHpM2CmljFfhfsUO5uCA0/j6AudfZV5arv6WuVHcYs+ALwqKTkvHnmLoEwr8CJW9Llts9iNwvj3plzsfeWyIRnzrq37kfIzq6naBpA5a6bzlJgOl/SMkl+rklEFgIX5k5THwTYgIdwzcP2jhM/o19KsOeoArnBS6suaqo2gQnXCJWSwXNwXB4gBMFekNBeTwSGUmiMK4yNktDhsleNaAZRrUvYWmasuQHJOSDdpdKyriEIvo9maexWC70gAIF/bKTvzzFUH4HgbJZ3HdFSw9vC6lfKHpq7X8X07AOOblK2HhLQBindC2g/9Rx+gePcj/cnqHIDoUFm1c9gjwNAy/d0kyXIAMLSYrQ8kqScAhhbH3iLJBwIwtBByTJKkBWBoIeSMJHMOwNBCyG+SdEYAQ4tTvyLJMQUwtBAyJEn8BTC0EHIHQhQSApOlzGTBqaty6jzVAhhaCOlhYahuYYitE02EHGNzURchLZItX4ChhZB9HFBpUjmgwhGuHv0feI0gBw1T3j7CgHT5jzYC5XQRsjUdSsrhjADGl7ka0EylBgRb+ySkMy9rww7A8Waududf2MH9Qh9k3CbXLsGVNh/mqrvojuEeQHI+Qmq4Fq1ndIyeruaDxAEuCWk+ncmB0z3gepubtQenMUHyGTWELJl8xk6B15CeqVAyLtPXtUICsyJnVivWs+J0dAAwbzLOkQRTk2YuKsapTQFkXqPjlDILEinnRcZ1fpXdkGo866xqnH9FNyTjz0JIQZXcuPQCAE5rqo6oMEFBl7RknBRfTg8lj5Yl48JdGT0ueIWiYIvIuHFfPg9l85LJcF42b+JTUFjysZnyVlhy2qfA0asovTo9+0JxYnWC8t0KBQXuFYrdkIy3mBj3LbeNQrejZTuqOlbcl8znGTqcfjXoM3pboqgaPhEPxda1qgcVYsRt5TanDkgISWzcV1N1hCS3jdu4dNxUDMIhlBzXysHGGspkcBtsW2pPh3fGLrZ2ya5cXHFp0qxJ6si3E68EQCpy344vQRZxO5jfye+2d/oqgHsV02Z3lvcl9QTnA+EkLZw5h9MZcY4pTvxldXj/W0+esc+25H/5HQGYon+Q5f+MwFz+8QAAAABJRU5ErkJggg==', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -122,4 +122,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,104 +15,104 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -122,4 +122,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.items during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,104 +16,104 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -123,4 +123,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.items during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,104 +16,104 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -123,4 +123,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,104 +15,104 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -122,4 +122,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
<title>dataTransfer.items during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -17,104 +17,104 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{if(dataTypes.indexOf(event.dataTransfer.items[i-1].type) == -1)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -124,4 +124,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items and getData during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,115 +15,115 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -132,15 +132,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items and getData during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,110 +15,110 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAEq0lEQVR42u1dvU4bQRAeR0RCCilSp0peIoKGB4DSXYRDlcZlFClKBI4bB/kV/AymIDwCTahiicaioEOxhCsjWVTJziyKMfYZn+9ud3bvG2mEZB13u9+nndmf2Rki7fKFXtEBbVKD9o22jB4bPaND6hm9Mjo0enevw/vfevKMfbYl/8vv4HdBUkvFALhltG2A7dN3+pur8jv53fwN/hZkjjRo3eiuAatjdJA7CcnkDOSb/G1uQ6mFzUeDagaQrvl764yEJOU22LbUymXaGrRhOt40OvJOQvLIGUkbP9GLeIn4SM9NJ+tOTVI+Jq0ubY9sVFRNxy6DIWKWmEvpQ/ByQNumI+fBEjHrZ86lT8HJV3ptGn8aDRGzxJxKHwMZFe9Mg6+jJWNCyrX0VbUc0nuj4+jJmPiWsfRZodN+ZvSoNETMjpYjwUCFfKaXpjEnpSVjQsqJYOF5ZLw1elF6MiakXAgmnpw378DegIgZUm4EGw8jA2QsIuUbvXHpM2CmljFfhfsUO5uCA0/j6AudfZV5arv6WuVHcYs+ALwqKTkvHnmLoEwr8CJW9Llts9iNwvj3plzsfeWyIRnzrq37kfIzq6naBpA5a6bzlJgOl/SMkl+rklEFgIX5k5THwTYgIdwzcP2jhM/o19KsOeoArnBS6suaqo2gQnXCJWSwXNwXB4gBMFekNBeTwSGUmiMK4yNktDhsleNaAZRrUvYWmasuQHJOSDdpdKyriEIvo9maexWC70gAIF/bKTvzzFUH4HgbJZ3HdFSw9vC6lfKHpq7X8X07AOOblK2HhLQBindC2g/9Rx+gePcj/cnqHIDoUFm1c9gjwNAy/d0kyXIAMLSYrQ8kqScAhhbH3iLJBwIwtBByTJKkBWBoIeSMJHMOwNBCyG+SdEYAQ4tTvyLJMQUwtBAyJEn8BTC0EHIHQhQSApOlzGTBqaty6jzVAhhaCOlhYahuYYitE02EHGNzURchLZItX4ChhZB9HFBpUjmgwhGuHv0feI0gBw1T3j7CgHT5jzYC5XQRsjUdSsrhjADGl7ka0EylBgRb+ySkMy9rww7A8Waududf2MH9Qh9k3CbXLsGVNh/mqrvojuEeQHI+Qmq4Fq1ndIyeruaDxAEuCWk+ncmB0z3gepubtQenMUHyGTWELJl8xk6B15CeqVAyLtPXtUICsyJnVivWs+J0dAAwbzLOkQRTk2YuKsapTQFkXqPjlDILEinnRcZ1fpXdkGo866xqnH9FNyTjz0JIQZXcuPQCAE5rqo6oMEFBl7RknBRfTg8lj5Yl48JdGT0ueIWiYIvIuHFfPg9l85LJcF42b+JTUFjysZnyVlhy2qfA0asovTo9+0JxYnWC8t0KBQXuFYrdkIy3mBj3LbeNQrejZTuqOlbcl8znGTqcfjXoM3pboqgaPhEPxda1qgcVYsRt5TanDkgISWzcV1N1hCS3jdu4dNxUDMIhlBzXysHGGspkcBtsW2pPh3fGLrZ2ya5cXHFp0qxJ6si3E68EQCpy344vQRZxO5jfye+2d/oqgHsV02Z3lvcl9QTnA+EkLZw5h9MZcY4pTvxldXj/W0+esc+25H/5HQGYon+Q5f+MwFz+8QAAAABJRU5ErkJggg==', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -128,4 +128,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items and getData during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,110 +15,110 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -128,4 +128,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.items and getData during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,110 +16,110 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -129,4 +129,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.items and getData during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,110 +16,110 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -129,4 +129,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.items and getData during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,110 +15,110 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -128,4 +128,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
<title>dataTransfer.items and getData during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -17,109 +17,109 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -129,4 +129,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,47 +4,47 @@
|
|||
<title>Text and url aliases</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text', 'url', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -54,4 +54,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.types during canvas drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,141 +15,141 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondrag="dragElement(event)">Canvas</canvas>
|
||||
</p>
|
||||
<p>Drag canvas pattern to the silver box below and drop it. Silver box should turn green.</p>
|
||||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
|
|
@ -158,15 +158,15 @@ function say(it)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
data[1] = canvas.toDataURL('image/png');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.types during PNG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,136 +15,136 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAEq0lEQVR42u1dvU4bQRAeR0RCCilSp0peIoKGB4DSXYRDlcZlFClKBI4bB/kV/AymIDwCTahiicaioEOxhCsjWVTJziyKMfYZn+9ud3bvG2mEZB13u9+nndmf2Rki7fKFXtEBbVKD9o22jB4bPaND6hm9Mjo0enevw/vfevKMfbYl/8vv4HdBUkvFALhltG2A7dN3+pur8jv53fwN/hZkjjRo3eiuAatjdJA7CcnkDOSb/G1uQ6mFzUeDagaQrvl764yEJOU22LbUymXaGrRhOt40OvJOQvLIGUkbP9GLeIn4SM9NJ+tOTVI+Jq0ubY9sVFRNxy6DIWKWmEvpQ/ByQNumI+fBEjHrZ86lT8HJV3ptGn8aDRGzxJxKHwMZFe9Mg6+jJWNCyrX0VbUc0nuj4+jJmPiWsfRZodN+ZvSoNETMjpYjwUCFfKaXpjEnpSVjQsqJYOF5ZLw1elF6MiakXAgmnpw378DegIgZUm4EGw8jA2QsIuUbvXHpM2CmljFfhfsUO5uCA0/j6AudfZV5arv6WuVHcYs+ALwqKTkvHnmLoEwr8CJW9Llts9iNwvj3plzsfeWyIRnzrq37kfIzq6naBpA5a6bzlJgOl/SMkl+rklEFgIX5k5THwTYgIdwzcP2jhM/o19KsOeoArnBS6suaqo2gQnXCJWSwXNwXB4gBMFekNBeTwSGUmiMK4yNktDhsleNaAZRrUvYWmasuQHJOSDdpdKyriEIvo9maexWC70gAIF/bKTvzzFUH4HgbJZ3HdFSw9vC6lfKHpq7X8X07AOOblK2HhLQBindC2g/9Rx+gePcj/cnqHIDoUFm1c9gjwNAy/d0kyXIAMLSYrQ8kqScAhhbH3iLJBwIwtBByTJKkBWBoIeSMJHMOwNBCyG+SdEYAQ4tTvyLJMQUwtBAyJEn8BTC0EHIHQhQSApOlzGTBqaty6jzVAhhaCOlhYahuYYitE02EHGNzURchLZItX4ChhZB9HFBpUjmgwhGuHv0feI0gBw1T3j7CgHT5jzYC5XQRsjUdSsrhjADGl7ka0EylBgRb+ySkMy9rww7A8Waududf2MH9Qh9k3CbXLsGVNh/mqrvojuEeQHI+Qmq4Fq1ndIyeruaDxAEuCWk+ncmB0z3gepubtQenMUHyGTWELJl8xk6B15CeqVAyLtPXtUICsyJnVivWs+J0dAAwbzLOkQRTk2YuKsapTQFkXqPjlDILEinnRcZ1fpXdkGo866xqnH9FNyTjz0JIQZXcuPQCAE5rqo6oMEFBl7RknBRfTg8lj5Yl48JdGT0ueIWiYIvIuHFfPg9l85LJcF42b+JTUFjysZnyVlhy2qfA0asovTo9+0JxYnWC8t0KBQXuFYrdkIy3mBj3LbeNQrejZTuqOlbcl8znGTqcfjXoM3pboqgaPhEPxda1qgcVYsRt5TanDkgISWzcV1N1hCS3jdu4dNxUDMIhlBzXysHGGspkcBtsW2pPh3fGLrZ2ya5cXHFp0qxJ6si3E68EQCpy344vQRZxO5jfye+2d/oqgHsV02Z3lvcl9QTnA+EkLZw5h9MZcY4pTvxldXj/W0+esc+25H/5HQGYon+Q5f+MwFz+8QAAAABJRU5ErkJggg==', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -154,4 +154,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.types during SVG image drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,136 +15,136 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20version%3D%221.1%22%20width%3D%22100px%22%20height%3D%22100px%22%20viewBox%3D%220%200%20100%20100%22%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2250%22%20r%3D%2250%22%20fill%3D%22green%22/%3E%3C/svg%3E', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -154,4 +154,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.types during text input selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,136 +16,136 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -155,4 +155,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<title>dataTransfer.types during selection drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -16,136 +16,136 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -155,4 +155,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<title>dataTransfer.types during link drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -15,136 +15,136 @@ var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/
|
|||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = event.dataTransfer.items.length; i != 0; i--)
|
||||
{delete event.dataTransfer.items[i-1]}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -154,4 +154,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
<title>dataTransfer.types during block element drag and drop</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:green;}
|
||||
p + div
|
||||
{background-color:gray;}
|
||||
{background-color:gray;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
|
|
@ -17,135 +17,135 @@ var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/
|
|||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'],
|
||||
e = 0, result = true;
|
||||
function start(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.items.add(data[i],dataTypes[i])}
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragstart) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondragstart): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragstart): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragstart): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragstart): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dragElement(event)
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrag) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrag): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrag): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrag): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragenter) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragenter): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragenter): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragenter): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to drag event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function overElement(event)
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
{event.preventDefault();
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondragover) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondragover): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondragover): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondragover): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should not reveal data to dragover event handler)')}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
function dataDrop(event)
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
{e = 0;
|
||||
event.dataTransfer.items.clear();
|
||||
if(event.dataTransfer.items.length != dataTypes.length)
|
||||
{say('items.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
if(event.dataTransfer.types.length != dataTypes.length)
|
||||
{say('types.length (ondrop) : FAIL (items.length should be' + dataTypes.length + ')')}
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{if(event.dataTransfer.types[i] != dataTypes[i])
|
||||
{say('Types (ondrop): FAIL (dataTransfer.types[' + i + '] returns wrong value)')}
|
||||
if(event.dataTransfer.getData(dataTypes[i]) != data[i])
|
||||
{say('getData (ondrop): FAIL (getData(' + dataTypes[i] + ') returns wrong data)')}
|
||||
}
|
||||
for(var i = 0; i != event.dataTransfer.items.length; i++)
|
||||
{delete event.dataTransfer.items[i];
|
||||
if(event.dataTransfer.items[i].kind != 'string')
|
||||
{say('Item kind (ondrop): FAIL (items[' + i + '].kind should be string)')}
|
||||
if(event.dataTransfer.items[i].type != dataTypes[i])
|
||||
{say('Item type (ondrop): FAIL (items[' + i + '].type should be' + dataTypes[i] + ')')}
|
||||
event.dataTransfer.items[i].getAsString(
|
||||
function ()
|
||||
{if(arguments[0] != data[e++])
|
||||
{say('getAsString : FAIL (items[' + i + '].getAsString should pass' + data[e] + ')')}
|
||||
}
|
||||
);
|
||||
}
|
||||
document.querySelector('p + div').setAttribute('style','background-color:' + (result?'green':'red'));}
|
||||
function say(it)
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{result = false;
|
||||
document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -155,4 +155,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="overElement(event)" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,83 +1,83 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Adding a file to dnd data store</title>
|
||||
<style type="text/css">
|
||||
<head>
|
||||
<title>Adding a file to dnd data store</title>
|
||||
<style type="text/css">
|
||||
span { display: inline-block; height: 100px; width: 100px; background: orange; }
|
||||
span + span { background: blue; }
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
window.onload = function () {
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
var drop = document.getElementsByTagName('span')[1];
|
||||
drop.ondragenter = drop.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
drop.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
var drop = document.getElementsByTagName('span')[1];
|
||||
drop.ondragenter = drop.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
drop.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square onto the blue square and release it:<br><span draggable="true"></span> <span></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square onto the blue square and release it:<br><span draggable="true"></span> <span></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,83 +1,83 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Adding a file to dnd data store with drag out of window</title>
|
||||
<style type="text/css">
|
||||
<head>
|
||||
<title>Adding a file to dnd data store with drag out of window</title>
|
||||
<style type="text/css">
|
||||
span { display: inline-block; height: 100px; width: 100px; background: orange; }
|
||||
span + span { background: blue; }
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
window.onload = function () {
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
var drop = document.getElementsByTagName('span')[1];
|
||||
drop.ondragenter = drop.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
drop.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
var drop = document.getElementsByTagName('span')[1];
|
||||
drop.ondragenter = drop.ondragover = function (e) {
|
||||
e.preventDefault();
|
||||
};
|
||||
drop.ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square outside the browser window (not over the taskbar), then back onto the blue square and release it:<br><span draggable="true"></span> <span></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square outside the browser window (not over the taskbar), then back onto the blue square and release it:<br><span draggable="true"></span> <span></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,46 +1,46 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>text/uri-list conversion</title>
|
||||
<style type="text/css">
|
||||
<head>
|
||||
<title>text/uri-list conversion</title>
|
||||
<style type="text/css">
|
||||
div { height: 100px; width: 100px; background: orange; }
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
window.onload = function () {
|
||||
var drag = document.getElementsByTagName('div')[0], fails = [];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('url','http://example.com/');
|
||||
if( !e.dataTransfer.getData('url') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = "FAIL - getData('url') returned nothing";
|
||||
} else if( e.dataTransfer.getData('url') != e.dataTransfer.getData('text/uri-list') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - text/uri-list is not the same as url';
|
||||
} else {
|
||||
var drag = document.getElementsByTagName('div')[0], fails = [];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('url','http://example.com/');
|
||||
if( !e.dataTransfer.getData('url') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = "FAIL - getData('url') returned nothing";
|
||||
} else if( e.dataTransfer.getData('url') != e.dataTransfer.getData('text/uri-list') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - text/uri-list is not the same as url';
|
||||
} else {
|
||||
|
||||
e.dataTransfer.setData('url','#foo\r\n http://example.com/#bar \r\n http://example.org/');
|
||||
if( e.dataTransfer.getData('url') != 'http://example.com/#bar' ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - only the first URL should be returned - "'+e.dataTransfer.getData('url')+'"';
|
||||
} else if( e.dataTransfer.getData('text/uri-list') != '#foo\r\n http://example.com/#bar \r\n http://example.org/' ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - text/uri-list should return the full data';
|
||||
} else {
|
||||
e.dataTransfer.setData('url','#foo\r\n http://example.com/#bar \r\n http://example.org/');
|
||||
if( e.dataTransfer.getData('url') != 'http://example.com/#bar' ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - only the first URL should be returned - "'+e.dataTransfer.getData('url')+'"';
|
||||
} else if( e.dataTransfer.getData('text/uri-list') != '#foo\r\n http://example.com/#bar \r\n http://example.org/' ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - text/uri-list should return the full data';
|
||||
} else {
|
||||
|
||||
e.dataTransfer.setData('url',' ');
|
||||
if( e.dataTransfer.getData('url') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - space was not a valid URL so an empty string should have been returned';
|
||||
} else {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
e.dataTransfer.setData('url',' ');
|
||||
if( e.dataTransfer.getData('url') ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - space was not a valid URL so an empty string should have been returned';
|
||||
} else {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
e.preventDefault();
|
||||
};
|
||||
}
|
||||
e.preventDefault();
|
||||
};
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div draggable="true"></div>
|
||||
<p>Attempt to drag the orange square.</p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div draggable="true"></div>
|
||||
<p>Attempt to drag the orange square.</p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,45 +4,45 @@
|
|||
<title>Caseinsensitivity in dataTransfer.setData/getData</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
{height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
background-color:silver;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/uri-list', 'text/plain', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['data:text/plain,1', 'PASS', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData((i%2 == 0)?(dataTypes[i].toUpperCase()):(dataTypes[i].replace(/i/g,'I')), data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData((i%2 == 0)?(dataTypes[i].toUpperCase()):(dataTypes[i].replace(/i/g,'I')), data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData((i%2 == 0)?(dataTypes[i].replace(/t/g,'T')):(dataTypes[i].toUpperCase())) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData((i%2 == 0)?(dataTypes[i].replace(/t/g,'T')):(dataTypes[i].toUpperCase())) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -52,4 +52,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,46 +4,46 @@
|
|||
<title>Various data item type strings in dataTransfer.setData/getData</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
{min-height:100px;
|
||||
width:100px;
|
||||
padding:20px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'http://', '<?xml version="1.0" encoding="utf-8"?>', '<html xmlns="http://www.w3.org/1999/xhtml"/>', '<mn>1</mn>', '☺', 'type="text/html"', '[({#;:,.`~*-_=+\|/%!?&$@^})]'],
|
||||
data = ['Drag me', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
{event.dataTransfer.effectAllowed = 'copy';
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], data[i]);}
|
||||
say('items.length (dragstart) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
}
|
||||
function dragElement(event)
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
{for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during drag)')}
|
||||
}
|
||||
if(event.dataTransfer.items.length < dataTypes.length)
|
||||
{say('items.length (dragover) : FAIL')}
|
||||
}
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(string' + i + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(string' + i + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('div').setAttribute('style','background-color:green');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -53,4 +53,4 @@ function say(it)
|
|||
<div ondragenter="enterElement(event)" ondragover="return false;" ondrop="dataDrop(event)"/>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,79 +1,79 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Dropping file into dropzone</title>
|
||||
<style type="text/css">
|
||||
<head>
|
||||
<title>Dropping file into dropzone</title>
|
||||
<style type="text/css">
|
||||
span { display: inline-block; height: 100px; width: 100px; background: orange; }
|
||||
span + span { background: blue; }
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
window.onload = function () {
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
document.getElementsByTagName('span')[1].ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
var drag = document.getElementsByTagName('span')[0];
|
||||
drag.ondragstart = function (e) {
|
||||
e.dataTransfer.setData('text','PASS');
|
||||
e.dataTransfer.effectAllowed = 'copy';
|
||||
var filein = document.getElementsByTagName('input')[0];
|
||||
if( !filein.files ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file API is not supported.';
|
||||
return;
|
||||
}
|
||||
if( !filein.files[0] ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - no file was found in the file input.';
|
||||
return;
|
||||
}
|
||||
var thefile = filein.files[0];
|
||||
try {
|
||||
e.dataTransfer.items.add(thefile);
|
||||
} catch(err) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - error when adding file';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
};
|
||||
document.getElementsByTagName('span')[1].ondrop = function (e) {
|
||||
e.preventDefault();
|
||||
if( document.getElementsByTagName('p')[0].innerHTML ) { return; }
|
||||
if( e.dataTransfer.files.length != 1 ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'FAIL - file was not attached to data store during drop';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
if( !window.FileReader ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No FileReader constructor';
|
||||
e.preventDefault();
|
||||
return;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after load';
|
||||
} else if( !document.getElementsByTagName('p')[0].innerHTML ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'PASS';
|
||||
}
|
||||
};
|
||||
reader.readAsBinaryString(e.dataTransfer.files[0]);
|
||||
setTimeout(function () {
|
||||
if( !reader.result ) {
|
||||
document.getElementsByTagName('p')[0].innerHTML = 'No file data after timeout';
|
||||
}
|
||||
},1000);
|
||||
};
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty plain text file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square onto the blue square and release it:<br><span draggable="true"></span> <span dropzone="copy file:text/plain"></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<ol>
|
||||
<li>Select a non-empty plain text file on your computer using the following input: <input type="file"></li>
|
||||
<li>Drag the orange square onto the blue square and release it:<br><span draggable="true"></span> <span dropzone="copy file:text/plain"></span><br>
|
||||
If a prompt appears, accept it.</li>
|
||||
<li>Fail if new text does not appear below.</li>
|
||||
</ol>
|
||||
<p></p>
|
||||
<noscript><p>Enable JavaScript and reload</p></noscript>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,27 +4,27 @@
|
|||
<title>Drag and drop datastore: helper file</title>
|
||||
<style type="text/css">
|
||||
html, body
|
||||
{height:100%;}
|
||||
{height:100%;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
<![CDATA[
|
||||
var dataTypes = ['text/plain', 'text/uri-list', 'application/xml', 'application/xhtml+xml', 'application/mathml+xml', 'image/svg+xml', 'text/html', 'text/x-example'],
|
||||
data = ['PASS', 'data:text/plain,1', '<result>PASS</result>', '<html xmlns="http://www.w3.org/1999/xhtml"><head><title>Data store item</title></head><body><p>PASS</p></body></html>', '<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>1</mn></math>', '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="50px" viewBox="0 0 100 50"><text x="0" y="40" font-size="40" fill="green">PASS</text></svg>', '<!DOCTYPE html><html><head><title>Data store item</title></head><body><p>PASS</p></body></html>', 'PASS'];
|
||||
function enterElement(event)
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
{event.preventDefault();
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{event.dataTransfer.setData(dataTypes[i], 'FAIL');
|
||||
if(event.dataTransfer.getData(dataTypes[i]))
|
||||
{say('getData(' + dataTypes[i] + ') : FAIL (data store should not be readable during dragenter)')}
|
||||
}
|
||||
say('items.length (dragenter) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));}
|
||||
function dataDrop(event)
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('body').setAttribute('style','background-color:teal;color:white;');}
|
||||
{say('items.length (drop) : ' + ((event.dataTransfer.items.length >= dataTypes.length)?'PASS':'FAIL'));
|
||||
for(var i = 0; i != dataTypes.length; i++)
|
||||
{say('getData(' + dataTypes[i] + ') : ' + ((event.dataTransfer.getData(dataTypes[i]) == data[i])?'PASS':'FAIL'));}
|
||||
document.querySelector('body').setAttribute('style','background-color:teal;color:white;');}
|
||||
function say(it)
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
{document.querySelector('pre').appendChild(document.createTextNode(it + '\n'));}
|
||||
]]>
|
||||
</script>
|
||||
</head>
|
||||
|
|
@ -32,4 +32,4 @@ function say(it)
|
|||
<p>Drop box here. Frame should turn green and test results should appear below.</p>
|
||||
<pre/>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,25 +1,25 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Exposing drag & drop events on document and window</title>
|
||||
<script type="text/javascript" src="/resources/testharness.js"></script>
|
||||
<script type="text/javascript" src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<head>
|
||||
<title>Exposing drag & drop events on document and window</title>
|
||||
<script type="text/javascript" src="/resources/testharness.js"></script>
|
||||
<script type="text/javascript" src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="log">Enable script and reload</div>
|
||||
<script type="text/javascript">
|
||||
<div id="log">Enable script and reload</div>
|
||||
<script type="text/javascript">
|
||||
var allEvents = ['ondragstart','ondrag','ondragover','ondragenter','ondragleave','ondrop','ondragend'];
|
||||
var allObjects = [['window',window],['document',document],['HTMLElement',document.createElement('div')]];
|
||||
var fails = [];
|
||||
for( var i = 0; i < allObjects.length; i++ ) {
|
||||
for( var j = 0; j < allEvents.length; j++ ) {
|
||||
test(function () {
|
||||
assert_true(allEvents[j] in allObjects[i][1]);
|
||||
}, allEvents[j] + ' in ' + allObjects[i][0]);
|
||||
}
|
||||
for( var j = 0; j < allEvents.length; j++ ) {
|
||||
test(function () {
|
||||
assert_true(allEvents[j] in allObjects[i][1]);
|
||||
}, allEvents[j] + ' in ' + allObjects[i][0]);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Text input selection drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function selectText()
|
||||
{document.querySelector('input').select()}
|
||||
{document.querySelector('input').select()}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,25 +4,25 @@
|
|||
<title>Link drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag link and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,25 +4,25 @@
|
|||
<title>PNG image drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag circle and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,25 +4,25 @@
|
|||
<title>SVG image drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag circle and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,30 +4,30 @@
|
|||
<title>Canvas drag and drop: allowed effects 'copy','move','link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'], i = 0;
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i] && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
<p>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondragenter="event.preventDefault()" ondragover="return false" ondrop="addImage(event)">Canvas</canvas>
|
||||
<canvas width="100" height="100" draggable="true" ondragstart="start(event)" ondragenter="event.preventDefault()" ondragover="return false" ondrop="addImage(event)">Canvas</canvas>
|
||||
</p>
|
||||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
|
|
@ -37,14 +37,14 @@ function start(event)
|
|||
var canvas = document.querySelector('canvas'),
|
||||
c = canvas.getContext('2d');
|
||||
for(var x = 0; x != 50; x++)
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
{c.fillStyle = (x%2 == 0)?'navy':'white';
|
||||
c.beginPath();
|
||||
c.moveTo(x,x);
|
||||
c.lineTo(100-x,x);
|
||||
c.lineTo(100-x,100-x);
|
||||
c.lineTo(x,100-x);
|
||||
c.closePath();
|
||||
c.fill();}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'copy','copyLink','copyMove'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','copyLink','copyMove'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,25 +4,25 @@
|
|||
<title>Link drag and drop: allowed effects 'link','linkMove','uninitialized'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['link','linkMove','copyMove'], i = 0;
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag link and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,27 +4,27 @@
|
|||
<title>Text input selection drag and drop: allowed effects 'move','uninitialized'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['move','uninitialized'], i = 0;
|
||||
function selectText()
|
||||
{document.querySelector('input').select()}
|
||||
{document.querySelector('input').select()}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'move' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%2;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'move' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%2;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i];
|
||||
event.dataTransfer.dropEffect = 'move'}
|
||||
{event.dataTransfer.effectAllowed = effects[i];
|
||||
event.dataTransfer.dropEffect = 'move'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -33,4 +33,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,26 +4,26 @@
|
|||
<title>Selection drag and drop: allowed effects 'all','uninitialized'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['all','uninitialized'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%2;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%2;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'link','copyLink','linkMove'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['link','copyLink','linkMove'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i];}
|
||||
{event.dataTransfer.effectAllowed = effects[i];}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'move','copyMove','linkMove'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['move','copyMove','linkMove'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[i].substring(0,4) && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i];}
|
||||
{event.dataTransfer.effectAllowed = effects[i];}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'copy','all','uninitialized'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','all','uninitialized'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,28 +4,28 @@
|
|||
<title>Selection drag and drop: allowed effects 'copy','copyMove','invalid'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','all','uninitialized'], i = 0;
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event)
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
{event.target.appendChild(document.createTextNode((event.dataTransfer.dropEffect == 'copy' && event.dataTransfer.effectAllowed == effects[i])?' PASS ':' FAIL '));
|
||||
i = (i + 1)%3;
|
||||
selectText();}
|
||||
function start(event)
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
{event.dataTransfer.effectAllowed = effects[i]}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -35,4 +35,4 @@ function start(event)
|
|||
<div ondragenter="event.preventDefault()" ondragover="return false" ondrop="dropSelection(event)"/>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -4,25 +4,25 @@
|
|||
<title>Selection drag and drop: dropzone 'copy','move' and 'link'</title>
|
||||
<style type="text/css">
|
||||
div
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
{display:inline-block;
|
||||
vertical-align:top;
|
||||
background-color:olive;
|
||||
color:white;
|
||||
padding:20px;
|
||||
width:100px;
|
||||
height:100px;}
|
||||
div:nth-child(2)
|
||||
{background-color:green;}
|
||||
{background-color:green;}
|
||||
div:nth-child(3)
|
||||
{background-color:teal;}
|
||||
{background-color:teal;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
var effects = ['copy','move','link'];
|
||||
function selectText()
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
{window.getSelection().selectAllChildren(document.querySelector('p'))}
|
||||
function dropSelection(event,element)
|
||||
{document.querySelectorAll('div')[element].appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[element])?' PASS ':' FAIL '));
|
||||
selectText();}
|
||||
{document.querySelectorAll('div')[element].appendChild(document.createTextNode((event.dataTransfer.dropEffect == effects[element])?' PASS ':' FAIL '));
|
||||
selectText();}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="selectText()">
|
||||
|
|
@ -32,4 +32,4 @@ function dropSelection(event,element)
|
|||
<p>Drag me</p>
|
||||
<p>You should be able to drag selection and drop it onto any of the green boxes.</p>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue