diff options
Diffstat (limited to 'testing/web-platform/tests/html/editing/dnd/roundtrip')
8 files changed, 162 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/001.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/001.xhtml new file mode 100644 index 0000000000..235eca64a1 --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/001.xhtml @@ -0,0 +1,38 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Canvas drag and drop roundtrip</title> +<style type="text/css"> +img + {margin:0 2px;} +</style> +<script type="application/ecmascript"> +function addImage(event) + {var c = document.createElement('img'); + c.setAttribute('src',event.dataTransfer.getData('text/uri-list').replace(/\r\n$/,'')); + document.querySelector('p').appendChild(c);} +function start(event) + {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)" ondragenter="event.preventDefault()" ondragover="return false" ondrop="addImage(event)">Canvas</canvas> +</p> +<p>Drag canvas pattern outside browser window and then drag it back and drop on itself. It should be duplicated once you drop it.</p> +<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();} +</script> +</body> +</html> diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/002.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/002.xhtml new file mode 100644 index 0000000000..84bfda2d09 --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/002.xhtml @@ -0,0 +1,20 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>PNG image drag and drop roundtrip</title> +<style type="text/css"> +img + {margin:0 2px;} +</style> +<script type="application/ecmascript"> +function addImage(event) + {var c = document.createElement('img'); + c.setAttribute('src',event.dataTransfer.getData('text/uri-list').replace(/\r\n$/,'')); + document.querySelector('p').appendChild(c);} +</script> +</head> +<body> +<p><img ondragstart="event.dataTransfer.effectAllowed = 'copy'" ondragenter="event.preventDefault()" ondrop="addImage(event)" ondragover="return false" src="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==" alt="PNG circle"/></p> +<p>Drag circle outside browser window and then drag it back and drop on itself. It should be duplicated once you drop it.</p> +</body> +</html> diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/003.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/003.xhtml new file mode 100644 index 0000000000..6cbdbf3bb8 --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/003.xhtml @@ -0,0 +1,20 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>SVG image drag and drop roundtrip</title> +<style type="text/css"> +img + {margin:0 2px;} +</style> +<script type="application/ecmascript"> +function addImage(event) + {var c = document.createElement('img'); + c.setAttribute('src',event.dataTransfer.getData('text/uri-list').replace(/\r\n$/,'')); + document.querySelector('p').appendChild(c);} +</script> +</head> +<body> +<p><img ondragstart="event.dataTransfer.effectAllowed = 'copy'" ondragenter="event.preventDefault()" ondrop="addImage(event)" ondragover="return false" src="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" alt="SVG circle"/></p> +<p>Drag circle outside browser window and then drag it back and drop on itself. It should be duplicated once you drop it.</p> +</body> +</html> diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/004.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/004.xhtml new file mode 100644 index 0000000000..0b31a5989b --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/004.xhtml @@ -0,0 +1,10 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Text input selection drag and drop roundtrip</title> +</head> +<body onload="document.querySelector('input').select()"> +<p><input value="Drag me" ondragenter="event.preventDefault()" ondragover="return false" ondrop="event.preventDefault();this.value = (event.dataTransfer.getData('text/plain') == 'Drag me')?'PASS':'FAIL'"/></p> +<p>Drag selected text outside browser window and then drag it back and drop on itself. You should see word PASS once you drop it.</p> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/005.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/005.xhtml new file mode 100644 index 0000000000..e482fb2a0f --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/005.xhtml @@ -0,0 +1,10 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Selection drag and drop roundtrip</title> +</head> +<body onload="window.getSelection().selectAllChildren(document.querySelector('span'))"> +<p><span ondragenter="event.preventDefault()" ondragover="return false" ondrop="document.querySelector('span').firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == 'Drag me')?'PASS':'FAIL'">Drag me</span></p> +<p>Drag selected text outside browser window and then drag it back and drop on itself. You should see word PASS once you drop it.</p> +</body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/006.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/006.xhtml new file mode 100644 index 0000000000..45e477aa29 --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/006.xhtml @@ -0,0 +1,14 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Link drag and drop roundtrip</title> +<script type="application/ecmascript"> +function checkLink(event) + {document.querySelector('a').firstChild.nodeValue = (event.dataTransfer.getData('text/uri-list').replace(/\r\n$/,'') == 'data:text/plain,1')?'PASS':'FAIL'} +</script> +</head> +<body> +<p><a href="data:text/plain,1" ondragstart="event.dataTransfer.effectAllowed = 'copy'" ondragenter="event.preventDefault()" ondrop="checkLink(event)" ondragover="return false">Drag me</a></p> +<p>Drag link outside browser window and then drag it back and drop on itself. You should see word PASS once you drop it.</p> +</body> +</html> diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/007.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/007.xhtml new file mode 100644 index 0000000000..a46cb33ee6 --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/007.xhtml @@ -0,0 +1,25 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Drag and drop roundtrip with text/plain data</title> +<style type="text/css"> +div[ondragenter] + {width:40px; + min-height:40px; + margin-top:20px; + padding:40px; + color:white; + background-color:navy;} +</style> +</head> +<body> +<div + draggable="true" + ondragstart="event.dataTransfer.effectAllowed = 'copy';event.dataTransfer.setData('text/plain',' PASS ')" + ondragenter="event.preventDefault()" + ondragover="return false" + ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))" +/> +<p>Drag blue box outside browser window and then drag it back and drop on itself. You should see word PASS once you drop it.</p> +</body> +</html> diff --git a/testing/web-platform/tests/html/editing/dnd/roundtrip/008.xhtml b/testing/web-platform/tests/html/editing/dnd/roundtrip/008.xhtml new file mode 100644 index 0000000000..33caeebefe --- /dev/null +++ b/testing/web-platform/tests/html/editing/dnd/roundtrip/008.xhtml @@ -0,0 +1,25 @@ +<?xml version="1.0" encoding="utf-8"?> +<html xmlns="http://www.w3.org/1999/xhtml"> +<head> +<title>Drag and drop roundtrip with text/uri-list data</title> +<style type="text/css"> +div[ondragenter] + {width:40px; + min-height:40px; + margin-top:20px; + padding:40px; + color:white; + background-color:navy;} +</style> +</head> +<body> +<div + draggable="true" + ondragstart="event.dataTransfer.effectAllowed = 'copy';event.dataTransfer.setData('text/uri-list','data:text/plain,PASS')" + ondragenter="event.preventDefault()" + ondragover="return false" + ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/uri-list').substr(16,4) + ' '))" +/> +<p>Drag blue box outside browser window and then drag it back and drop on itself. You should see word PASS once you drop it.</p> +</body> +</html> |