| <!DOCTYPE html> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <style> |
| html, body { |
| width: 100%; |
| height: 100%; |
| } |
| </style> |
| <body contenteditable> |
| <pre id="output"> |
| This test is best run under DumpRenderTree. To manually test, drop a file anywhere in the body. |
| This will dump the contents of the DataTransfer on drop as output text. |
| You should see an item of kind "file" in the resulting item list, as well as an entry in the item list. |
| There should <i>not</i> be an item of kind "string" and type "file". |
| </pre> |
| </body> |
| <script> |
| |
| function write(markup) { |
| output.insertAdjacentHTML("beforeend", markup); |
| } |
| |
| function outputForFile(file) { |
| return file ? `(name = '${file.name}', size = ${file.size} bytes, type = '${file.type}')` : "(null)"; |
| } |
| |
| function writeOutputForEvent(event) { |
| output.textContent = ""; |
| |
| write(`<br><h3>*** Handling ${event.type} ***</h3>`); |
| const pasteboard = event.dataTransfer || event.clipboardData; |
| write(`<div><strong>Types => data</strong></div>`); |
| for (const type of pasteboard.types) |
| write(`<div>${type} => "${pasteboard.getData(type)}"</div>`); |
| let index = 0; |
| write(`<div><strong>Item list</strong></div>`); |
| for (const item of pasteboard.items) { |
| if (item.kind === "file") |
| write(`<div>[${index++}] => ${outputForFile(item.getAsFile())}</div>`); |
| else |
| write(`<div>[${index++}] => (kind = ${item.kind}, type = ${item.type})</div>`); |
| } |
| write(`<div><strong>File list</strong></div>`); |
| index = 0; |
| for (const file of pasteboard.files) |
| write(`<div>[${index++}] => ${outputForFile(file)}</div>`); |
| } |
| |
| document.body.addEventListener("drop", event => { |
| event.preventDefault(); |
| writeOutputForEvent(event); |
| }); |
| |
| if (window.testRunner && window.internals && window.eventSender) { |
| internals.settings.setCustomPasteboardDataEnabled(true); |
| testRunner.dumpAsText(); |
| |
| eventSender.beginDragWithFiles(["resources/apple.gif"]); |
| eventSender.mouseMoveTo(100, 100); |
| eventSender.mouseUp(); |
| } |
| </script> |
