mirror of
https://github.com/servo/servo.git
synced 2025-08-11 08:25:32 +01:00
Update web-platform-tests to revision 0d318188757a9c996e20b82db201fd04de5aa255
This commit is contained in:
James Graham
parent
b2a5225831
commit
1a81b18b9f
12321 changed files with 544385 additions and 6 deletions
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from search input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="search" value="Selection"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from tel input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="tel" value="123456789"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from url input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected url to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="url" value="http://example.org"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from email input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected email to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="email" value="mail@example.org"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from number input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="number" value="123456789"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from short text input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected date to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input size="5" value="Drag me"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from password input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>You should not be able to drag and drop selection from password field to the blue box.</p>
|
||||
<p><input type="password" value="FAIL"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from readonly text input to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input readonly="readonly" value="Drag me"/></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from texarea to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{height:1.5em;
|
||||
width:7em;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from search input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input type="search" value="Selection"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from tel input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input type="tel" value="123456789"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from url input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected url to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input type="url" value="http://opera.com"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from email input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected email to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input type="email" value="mail@example.org"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from number input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the textarea. Copy of selection should end up in the textarea once you drop it there.</p>
|
||||
<p><input type="number" value="123456789"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from short text input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected date to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input size="5" value="Drag me"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from password input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>You should not be able to drag and drop selection from password field to the textarea.</p>
|
||||
<p><input type="password" value="FAIL"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from readonly input to textarea</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><input readonly="readonly" value="Drag me"/></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop between textareas</title>
|
||||
<style type="text/css">
|
||||
p:last-child > textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
p:first-child + p > textarea
|
||||
{height:1.5em;
|
||||
width:7em;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the textarea. Selected text should be moved to the textarea once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from search input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input type="search" value="Selection"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from tel input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input type="tel" value="123456789"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from url input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected url to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input type="url" value="http://example.org"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from email input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected email to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input type="email" value="mail@example.org"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from number input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input type="number" value="123456789"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from short input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected date to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input size="5" value="Drag me"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from password input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>You should not be able to drag and drop selection from password field to the blue box.</p>
|
||||
<p><input type="password" value="FAIL"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from readonly input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><input readonly="readonly" value="Drag me"/></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{height:1.5em;
|
||||
width:7em;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Selected text should be moved to the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging two lines of text selection from textarea to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(25,56)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea
|
||||
with selection that
|
||||
spans two lines.
|
||||
Drag selected text to the blue box.
|
||||
Selected text should be moved to the blue box once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging multiline text selection from textarea to block element</title>
|
||||
<style type="text/css">
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(24,58)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea with selection
|
||||
that spans
|
||||
three lines. Drag selected text to the blue box.
|
||||
Copy of selection should end up in the blue box once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging two lines of text selection between textareas</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(25,56)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea
|
||||
with selection that
|
||||
spans two lines.
|
||||
Drag selected text to the textarea below.
|
||||
Selected text should be moved to second textarea once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging multiline text selection between textareas</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(24,58)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea with selection
|
||||
that spans
|
||||
three lines. Drag selected text to the textarea below.
|
||||
Selected text should be moved to second textarea once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging two lines of text selection from textarea to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(25,56)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea
|
||||
with selection that
|
||||
spans two lines.
|
||||
Drag selected text to the blue box.
|
||||
Selected text should be moved to the blue box once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Dragging multiline text selection from textarea to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(24,58)">
|
||||
<p>
|
||||
<textarea>
|
||||
Here is textarea with selection
|
||||
that spans
|
||||
three lines. Drag selected text to the blue box.
|
||||
Selected text should be moved to the blue box once you drop it there.
|
||||
</textarea>
|
||||
</p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from text input to block element</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-input.xhtml"/>
|
||||
<frame src="helper-drop-here-blue-box.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from textarea input to block element</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-textarea-to-other-blue-box.xhtml"/>
|
||||
<frame src="helper-drop-here-blue-box.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from text input to textarea</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-input-to-other-textarea.xhtml"/>
|
||||
<frame src="helper-drop-here-textarea.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop between textareas</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-textarea-to-other-textarea.xhtml"/>
|
||||
<frame src="helper-drop-here-textarea.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from text input to contenteditable element</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-input.xhtml"/>
|
||||
<frame src="helper-drop-here-blue-box-contenteditable.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from textarea to contenteditable element</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-textarea-to-other-blue-box.xhtml"/>
|
||||
<frame src="helper-drop-here-blue-box-contenteditable.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop between text inputs</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-input-to-other-input.xhtml"/>
|
||||
<frame src="helper-drop-here-input.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross frame selection drag and drop from textarea to text input</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="helper-drag-me-textarea-to-other-input.xhtml"/>
|
||||
<frame src="helper-drop-here-input.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:350px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><iframe src="helper-drop-here-blue-box.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:350px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><iframe src="helper-drop-here-blue-box.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to textarea in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:400px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the textarea. Copy of selection should end up in the textarea once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><iframe src="helper-drop-here-textarea.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to another textarea in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:400px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the textarea. Copy of selection should end up in the textarea once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><iframe src="helper-drop-here-textarea.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to contenteditable element in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:350px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><iframe src="helper-drop-here-blue-box-contenteditable.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to contenteditable element in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:350px;
|
||||
height:150px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><iframe src="helper-drop-here-blue-box-contenteditable.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input in iframe to block element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input.xhtml">XHTML document</iframe></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea in iframe to block element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
div[ondragenter]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-blue-box.xhtml">XHTML document</iframe></p>
|
||||
<div
|
||||
ondragenter="event.preventDefault()"
|
||||
ondragover="return false"
|
||||
ondrop="document.querySelector('div').appendChild(document.createTextNode(event.dataTransfer.getData('text/plain')))"
|
||||
/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input in iframe to textarea</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input-to-other-textarea.xhtml">XHTML document</iframe></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea in iframe to another textarea</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-textarea.xhtml">XHTML document</iframe></p>
|
||||
<p><textarea placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input in iframe to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input.xhtml">XHTML document</iframe></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea in iframe to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
div[contenteditable]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;
|
||||
padding:10px;
|
||||
color:white;
|
||||
background-color:navy;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-blue-box.xhtml">XHTML document</iframe></p>
|
||||
<div contenteditable="true"/>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input in iframe to another input element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input-to-other-input.xhtml">XHTML document</iframe></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea in iframe to input element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
textarea
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-input.xhtml">XHTML document</iframe></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from text input to block element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-blue-box.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from textarea to block element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-blue-box.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-blue-box.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from text input to textarea</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input-to-other-textarea.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-textarea.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop between textareas</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-textarea.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-textarea.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from text input to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-blue-box-contenteditable.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
textarea
|
||||
{height:1.5em;
|
||||
width:7em;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Selection should be moved to the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from textarea to contenteditable element</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="064-1.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-blue-box-contenteditable.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop between text inputs</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input-to-other-input.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-input.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Cross iframe selection drag and drop from textarea to text input</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-textarea-to-other-input.xhtml">XHTML document</iframe></p>
|
||||
<p><iframe src="helper-drop-here-input.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drag-me-input.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:100%;
|
||||
height:200px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p><iframe src="helper-drop-here-blue-box.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Nested cross frame selection drag and drop from text input to block element</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="067-1.xhtml"/>
|
||||
<frame src="067-2.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -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: helper file</title>
|
||||
</head>
|
||||
<frameset rows="100%, 0%">
|
||||
<frame src="helper-drag-me-textarea-to-other-textarea.xhtml"/>
|
||||
<frame src="data:text/plain,1"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -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: helper file</title>
|
||||
</head>
|
||||
<frameset rows="100%, 0%">
|
||||
<frame src="helper-drop-here-textarea.xhtml"/>
|
||||
<frame src="data:text/plain,2"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Nested cross frame selection drag and drop between textareas</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="068-1.xhtml"/>
|
||||
<frame src="068-2.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop to textarea in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:400px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p>Drag selected text to the textarea. Copy of selection should end up in the textarea once you drop it there.</p>
|
||||
<p><iframe src="helper-drop-here-textarea.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop to contenteditable element in iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:500px;
|
||||
height:400px;
|
||||
border-style:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><iframe src="helper-drop-here-blue-box-contenteditable.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop between text inputs of different size</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from search to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input type="search" value="Selection"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from tel to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input type="tel" value="123456789"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from url to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected url to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input type="url" value="http://example.org"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from email to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected email to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input type="email" value="mail@example.org"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from number to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected number to the input below. Copy of selection should end up in the input once you drop it there.</p>
|
||||
<p><input type="number" value="123456789"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from short text input to another text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected date to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input size="5" value="Drag me"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from password to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>You should not be able to drag and drop selection from password field to the input below.</p>
|
||||
<p><input type="password" value="FAIL"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from readonly text input to another text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><input readonly="readonly" value="Drag me"/></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to text input</title>
|
||||
<style type="text/css">
|
||||
input
|
||||
{width:300px;
|
||||
height:100px;
|
||||
margin-top:20px;}
|
||||
textarea
|
||||
{height:1.5em;
|
||||
width:7em;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the input below. Selected text should be moved to the input once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><input placeholder="Drop selection here"/></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == 'Drag me')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p>Drag selected text to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to search input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == 'Drag me')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p>Drag selected text to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input type="search" placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to tel input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == '123456789')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>123456789</p>
|
||||
<p>Drag selected number to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input type="tel" placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to url input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == 'http://example.org')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>http://example.org</p>
|
||||
<p>Drag selected url to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input type="url" placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to email input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == 'mail@example.org')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>mail@example.org</p>
|
||||
<p>Drag selected address to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input type="email" placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Events during selection drag and drop to number input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:20px;}
|
||||
.hidden
|
||||
{visibility:hidden;}
|
||||
</style>
|
||||
<script type="application/ecmascript">
|
||||
function evtChange()
|
||||
{document.querySelectorAll('tt')[0].firstChild.nodeValue = 'PASS'}
|
||||
function evtInput()
|
||||
{document.querySelectorAll('tt')[1].firstChild.nodeValue = 'PASS'}
|
||||
function evtDrop()
|
||||
{document.querySelectorAll('tt')[2].firstChild.nodeValue = (event.dataTransfer.getData('text/plain') == '123456789')?'PASS':'FAIL (selection is not properly added to data store)'}
|
||||
function evtKeypress()
|
||||
{document.querySelectorAll('tt')[3].firstChild.nodeValue = 'FAIL (even is not supposed to fire)'}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>123456789</p>
|
||||
<p>Drag selected address to the input below. Follow check results link once you drop selection in the input.</p>
|
||||
<p><input type="number" placeholder="Drop selection here" onchange="evtChange()" oninput="evtInput()" onkeypress="evtKeypress()" ondrop="evtDrop()"/></p>
|
||||
<p><a href="javascript:document.querySelector('ul').removeAttribute('class')">Check results</a></p>
|
||||
<ul class="hidden">
|
||||
<li>Change event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Input event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Drop event: <tt>FAIL (even did not fire)</tt></li>
|
||||
<li>Keypress event: <tt>PASS</tt></li>
|
||||
</ul>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Scrolling during selection drag and drop to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;
|
||||
margin-top:200px;}
|
||||
div
|
||||
{height:150px;
|
||||
width:500px;
|
||||
overflow-y:scroll;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<div>
|
||||
<p>You should be able to drag selected text to the input at the bottom of scrollable container (dragging towards the bottom edge triggers scrolling).</p>
|
||||
<input placeholder="Drop selection here"/>
|
||||
<p>Copy of selection should end up in the input once you drop it there.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Vertical scrolling during selection drag and drop to text input</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;}
|
||||
div > p:first-child
|
||||
{margin-bottom:200px;}
|
||||
body > div
|
||||
{height:150px;
|
||||
width:500px;
|
||||
overflow-y:scroll;}
|
||||
div > div
|
||||
{height:400px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<div>
|
||||
<div>
|
||||
<p>You should be able to drag selected text to the input at the bottom of scrollable container (dragging towards the bottom edge triggers scrolling).</p>
|
||||
<input placeholder="Drop selection here"/>
|
||||
<p>Copy of selection should end up in the input once you drop it there.</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Scrolling during selection drag and drop to iframe</title>
|
||||
<style type="text/css">
|
||||
iframe
|
||||
{width:350px;
|
||||
height:150px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p><iframe src="helper-scroll-then-drop-input.xhtml">XHTML document</iframe></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Scrolling during selection drag and drop to object</title>
|
||||
<style type="text/css">
|
||||
object
|
||||
{width:350px;
|
||||
height:150px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
<p><object type="application/xhtml+xml" data="helper-scroll-then-drop-input.xhtml">XHTML document</object></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop: helper file</title>
|
||||
</head>
|
||||
<body onload="window.getSelection().selectAllChildren(document.querySelector('p'))">
|
||||
<p>Drag me</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop: helper file</title>
|
||||
<style type="text/css">
|
||||
input[placeholder]
|
||||
{width:300px;
|
||||
height:50px;}
|
||||
p:first-child
|
||||
{margin-bottom:1000px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>You should be able to drag selected text to the input at the bottom of scrollable container (dragging towards the bottom edge triggers scrolling).</p>
|
||||
<input placeholder="Drop selection here"/>
|
||||
<p>Copy of selection should end up in the input once you drop it there.</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Scrolling during selection drag and drop to frame</title>
|
||||
</head>
|
||||
<frameset rows="50%, 50%">
|
||||
<frame src="091-1.xhtml"/>
|
||||
<frame src="091-2.xhtml"/>
|
||||
</frameset>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from text input to element in object</title>
|
||||
<style type="text/css">
|
||||
object
|
||||
{width:350px;
|
||||
height:150px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="document.querySelector('input').select()">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><input value="Drag me"/></p>
|
||||
<p><object type="application/xhtml+xml" data="helper-drop-here-blue-box.xhtml">XHTML document</object></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Selection drag and drop from textarea to element in object</title>
|
||||
<style type="text/css">
|
||||
object
|
||||
{width:350px;
|
||||
height:150px;}
|
||||
</style>
|
||||
</head>
|
||||
<body onload="var t = document.querySelector('textarea');t.select();t.setSelectionRange(0,7)">
|
||||
<p>Drag selected text to the blue box. Copy of selection should end up in the blue box once you drop it there.</p>
|
||||
<p><textarea>Drag me</textarea></p>
|
||||
<p><object type="application/xhtml+xml" data="helper-drop-here-blue-box.xhtml">XHTML document</object></p>
|
||||
</body>
|
||||
</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