Update web-platform-tests to revision 0d318188757a9c996e20b82db201fd04de5aa255

This commit is contained in:
James Graham 2015-03-27 09:15:38 +00:00
parent b2a5225831
commit 1a81b18b9f
12321 changed files with 544385 additions and 6 deletions

View file

@ -0,0 +1,29 @@
<!doctype html>
<html>
<head>
<title>Select input inside draggable element</title>
<style type="text/css">
select { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should open and select items in the dropdown, and should <strong>not</strong> drag the block or text.</p>
<div draggable="true">
<select>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
</body>
</html>

View file

@ -0,0 +1,29 @@
<!doctype html>
<html>
<head>
<title>Select multiple input inside draggable element</title>
<style type="text/css">
select { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should open and select items in the dropdown, and should <strong>not</strong> drag the block or text.</p>
<div draggable="true">
<select multiple size="3">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
</body>
</html>

View file

@ -0,0 +1,29 @@
<!doctype html>
<html>
<head>
<title>Draggable select</title>
<style type="text/css">
select { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('select')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should open and select items in the dropdown, and should <strong>not</strong> drag the block or text.</p>
<div>
<select draggable="true">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
</body>
</html>

View file

@ -0,0 +1,29 @@
<!doctype html>
<html>
<head>
<title>Draggable select multiple</title>
<style type="text/css">
select { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('select')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should open and select items in the dropdown, and should <strong>not</strong> drag the block or text.</p>
<div>
<select multiple size="3" draggable="true">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Text input inside draggable element</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should focus the dummy text. Use your mouse to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div draggable="true">
<input value="Dummy text">
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Draggable text input</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('input')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should focus the dummy text. Use your mouse to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div>
<input value="Dummy text" draggable="true">
</div>
</body>
</html>

View file

@ -0,0 +1,36 @@
<!doctype html>
<html>
<head>
<title>Textarea inside draggable element</title>
<style type="text/css">
textarea { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It may optionally focus the dummy text. Use your mouse to select part of the dummy text, moving the mouse vertically and horizontally. It should select the text. Try to drag the input's scrollbar thumb. It should <strong>not</strong> drag the block or text in any case.</p>
<div draggable="true">
<textarea rows="5" cols="50" wrap="off">Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</textarea>
</div>
</body>
</html>

View file

@ -0,0 +1,36 @@
<!doctype html>
<html>
<head>
<title>Draggable textarea</title>
<style type="text/css">
textarea { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('textarea')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It may optionally focus the dummy text. Use your mouse to select part of the dummy text, moving the mouse vertically and horizontally. It should select the text. Try to drag the input's scrollbar thumb. It should <strong>not</strong> drag the block or text in any case.</p>
<div>
<textarea rows="5" cols="50" wrap="off">Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
Dummy text
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</textarea>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Input button inside draggable element</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the block or text.</p>
<div draggable="true">
<input type="button" value="Dummy text">
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Draggable input button</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('input')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the block or text.</p>
<div>
<input type="button" value="Dummy text" draggable="true">
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Button inside draggable element</title>
<style type="text/css">
button { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the block or text.</p>
<div draggable="true">
<button>Dummy text</button>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Draggable button</title>
<style type="text/css">
button { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('button')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the block or text.</p>
<div>
<button draggable="true">Dummy text</button>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Contenteditable inside draggable element</title>
<style type="text/css">
div div { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the text or the orange block. Use your mouse to select the dummy text. It should <strong>not</strong> drag the text or the orange block.</p>
<div draggable="true">
<div contenteditable="true">Dummy text</div>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Draggable contenteditable element</title>
<style type="text/css">
div div { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[1].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. It should <strong>not</strong> drag the text or the orange block. Use your mouse to select the dummy text. It should <strong>not</strong> drag the text or the orange block.</p>
<div>
<div draggable="true" contenteditable="true">Dummy text</div>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Scrollable element inside draggable element</title>
<style type="text/css">
div div { width: 300px; height: 100px; overflow: auto; border: 1px solid orange; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>It should be possible to drag the scrollbar thumbs of the box below without dragging the whole box.</p>
<div draggable="true">
<div>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</div>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Draggable scrollable element</title>
<style type="text/css">
div div { width: 300px; height: 100px; overflow: auto; border: 1px solid orange; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[1].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>It should be possible to drag the scrollbar thumbs of the box below without dragging the whole box.</p>
<div>
<div draggable="true">Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>Dummy text<br>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</div>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Disabled text input with inside draggable element</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. Use your mouse to attempt to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div draggable="true">
<input value="Dummy text" disabled>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Disabled draggable text input</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('input')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. Use your mouse to attempt to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div>
<input value="Dummy text" draggable="true" disabled>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Readonly text input with inside draggable element</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('div')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. Use your mouse to attempt to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div draggable="true">
<input value="Dummy text" readonly>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!doctype html>
<html>
<head>
<title>Readonly draggable text input</title>
<style type="text/css">
input { border: 1px solid orange; border-top-width: 20px; }
</style>
<script type="text/javascript">
window.onload = function () {
document.getElementsByTagName('input')[0].ondragstart = function (e) {
e.dataTransfer.effectAllowed = 'copy';
e.dataTransfer.setData('Text', 'dummy text');
};
};
</script>
</head>
<body>
<p>Press your mouse button down on the orange block and drag downwards. Use your mouse to attempt to select part of the dummy text. It should <strong>not</strong> drag the block or text in either case.</p>
<div>
<input value="Dummy text" draggable="true" readonly>
</div>
</body>
</html>