1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/editor/libeditor/base/tests/test_dragdrop.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,181 @@
1.4 +<html>
1.5 +
1.6 +<head>
1.7 + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
1.8 +
1.9 + <script type="application/javascript"
1.10 + src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
1.11 + <script type="application/javascript"
1.12 + src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
1.13 + <script type="application/javascript"
1.14 + src="chrome://mochikit/content/tests/SimpleTest/ChromeUtils.js"></script>
1.15 +</head>
1.16 +
1.17 +<body>
1.18 + <span id="text" style="font-size: 40px;">Some Text</span>
1.19 +
1.20 + <input id="input" value="Drag Me">
1.21 + <textarea id="textarea">Some Text To Drag</textarea>
1.22 + <p id="contenteditable" contenteditable="true">This is some <b id="bold">editable</b> text.</p>
1.23 + <p id="nestedce" contenteditable="true"><span id="first"> </span>First letter <span id="noneditable" contenteditable="false">Middle</span> Last part</p>
1.24 +
1.25 +<script type="application/javascript">
1.26 +
1.27 +SimpleTest.waitForExplicitFinish();
1.28 +
1.29 +// This listener allows us to clear the default data for the selection added for the drag.
1.30 +var shouldClear = false;
1.31 +window.addEventListener("dragstart", function (event) { if (shouldClear) event.dataTransfer.clearData() }, true);
1.32 +
1.33 +function doTest()
1.34 +{
1.35 + const htmlContextData = { type: 'text/_moz_htmlcontext',
1.36 + data: '<html><body></body></html>' };
1.37 + const htmlInfoData = { type: 'text/_moz_htmlinfo', data: '0,0' };
1.38 + const htmlData = { type: 'text/html', data: '<span id="text" style="font-size: 40px;">Some Text</span>' };
1.39 +
1.40 + const htmlContextDataEditable = { type: 'text/_moz_htmlcontext',
1.41 + data: '<html><body><p id="contenteditable" contenteditable="true"></p></body></html>' };
1.42 +
1.43 + var text = document.getElementById("text");
1.44 + var input = document.getElementById("input");
1.45 + var contenteditable = document.getElementById("contenteditable");
1.46 +
1.47 + var selection = window.getSelection();
1.48 +
1.49 + // -------- Test dragging regular text
1.50 + selection.selectAllChildren(text);
1.51 + var result = synthesizeDragStart(text, [[htmlContextData, htmlInfoData, htmlData,
1.52 + {type: "text/plain", data: "Some Text"}]], window, 40, 10);
1.53 + ok(!result, "Test dragging regular text");
1.54 +
1.55 + // -------- Test dragging text from an <input>
1.56 + input.setSelectionRange(1, 4);
1.57 + result = synthesizeDragStart(input, [[{type: "text/plain", data: "rag"}]], window, 25, 6);
1.58 + ok(!result, "Test dragging input");
1.59 +
1.60 + // -------- Test dragging text from a <textarea>
1.61 + textarea.setSelectionRange(1, 7);
1.62 + result = synthesizeDragStart(textarea, [[{type: "text/plain", data: "ome Te"}]], window, 25, 6);
1.63 + ok(!result, "Test dragging textarea");
1.64 + textarea.blur();
1.65 +
1.66 + // -------- Test dragging text from a contenteditable
1.67 + selection.selectAllChildren(contenteditable.childNodes[1]);
1.68 + result = synthesizeDragStart(contenteditable.childNodes[1],
1.69 + [[htmlContextDataEditable, htmlInfoData,
1.70 + {type: 'text/html', data: '<b id="bold">editable</b>' },
1.71 + {type: "text/plain", data: "editable"}]], window, 5, 6);
1.72 + ok(!result, "Test dragging contenteditable");
1.73 + contenteditable.blur();
1.74 +
1.75 + // -------- Test dragging regular text of text/html to <input>
1.76 +
1.77 + selection.selectAllChildren(text);
1.78 + input.value = "";
1.79 + synthesizeDrop(text, input, [], "copy");
1.80 + is(input.value, "Some Text", "Drag text/html onto input");
1.81 +
1.82 + // -------- Test dragging regular text of text/html to disabled <input>
1.83 +
1.84 + selection.selectAllChildren(text);
1.85 + input.value = "";
1.86 + input.disabled = true;
1.87 + synthesizeDrop(text, input, [], "copy");
1.88 + is(input.value, "", "Drag text/html onto disabled input");
1.89 + input.disabled = false;
1.90 +
1.91 + // -------- Test dragging regular text of text/html to readonly <input>
1.92 +
1.93 + selection.selectAllChildren(text);
1.94 + input.readOnly = true;
1.95 + synthesizeDrop(text, input, [], "copy");
1.96 + is(input.value, "", "Drag text/html onto readonly input");
1.97 + input.readOnly = false;
1.98 +
1.99 + // -------- Test dragging regular text of text/html to <input>. This sets
1.100 + // shouldClear to true so that the default drag data is not present
1.101 + // and we can use the data passed to synthesizeDrop. This allows
1.102 + // testing of a drop with just text/html.
1.103 + shouldClear = true;
1.104 + selection.selectAllChildren(text);
1.105 + input.value = "";
1.106 + synthesizeDrop(text, input, [[{type: "text/html", data: "Some <b>Bold<b> Text"}]], "copy");
1.107 + is(input.value, "", "Drag text/html onto input");
1.108 +
1.109 + // -------- Test dragging regular text of text/plain and text/html to <input>
1.110 +
1.111 + selection.selectAllChildren(text);
1.112 + input.value = "";
1.113 + synthesizeDrop(text, input, [[{type: "text/html", data: "Some <b>Bold<b> Text"},
1.114 + {type: "text/plain", data: "Some Plain Text"}]], "copy");
1.115 + is(input.value, "Some Plain Text", "Drag text/html and text/plain onto input");
1.116 +
1.117 + // -------- Test dragging regular text of text/plain to <textarea>
1.118 +
1.119 +// XXXndeakin Can't test textareas due to some event handling issue
1.120 +// selection.selectAllChildren(text);
1.121 +// synthesizeDrop(text, textarea, [[{type: "text/plain", data: "Somewhat Longer Text"}]], "copy");
1.122 +// is(textarea.value, "Somewhat Longer Text", "Drag text/plain onto textarea");
1.123 +
1.124 + // -------- Test dragging special text type of text/plain to contenteditable
1.125 +
1.126 + selection.selectAllChildren(text);
1.127 + synthesizeDrop(text, input, [[{type: "text/x-moz-text-internal", data: "Some Special Text"}]], "copy");
1.128 + is(input.value, "Some Plain Text", "Drag text/x-moz-text-internal onto input");
1.129 +
1.130 + // -------- Test dragging regular text of text/plain to contenteditable
1.131 +
1.132 + selection.selectAllChildren(text);
1.133 + synthesizeDrop(text, contenteditable, [[{type: "text/plain", data: "Sample Text"}]], "copy");
1.134 + is(contenteditable.childNodes.length, 3, "Drag text/plain onto contenteditable child nodes");
1.135 + is(contenteditable.textContent, "This is some editable text.Sample Text",
1.136 + "Drag text/plain onto contenteditable text");
1.137 +
1.138 + // -------- Test dragging regular text of text/html to contenteditable
1.139 +
1.140 + selection.selectAllChildren(text);
1.141 + synthesizeDrop(text, contenteditable, [[{type: "text/html", data: "Sample <i>Italic</i> Text"}]], "copy");
1.142 + is(contenteditable.childNodes.length, 6, "Drag text/html onto contenteditable child nodes");
1.143 + is(contenteditable.childNodes[4].tagName, "I", "Drag text/html onto contenteditable italic");
1.144 + is(contenteditable.childNodes[4].textContent, "Italic", "Drag text/html onto contenteditable italic text");
1.145 +
1.146 + // -------- Test dragging contenteditable to <input>
1.147 +
1.148 + selection.selectAllChildren(document.getElementById("bold"));
1.149 + synthesizeDrop(bold, input, [[{type: "text/html", data: "<b>editable</b>"},
1.150 + {type: "text/plain", data: "editable"}]], "copy");
1.151 + is(input.value, "Some Plain Texteditable", "Move text/html and text/plain from contenteditable onto input");
1.152 +
1.153 + // -------- Test dragging contenteditable to contenteditable
1.154 +
1.155 + shouldClear = false;
1.156 +
1.157 + selection.selectAllChildren(contenteditable.childNodes[4]);
1.158 + synthesizeDrop(contenteditable.childNodes[4], contenteditable, [], "copy");
1.159 + is(contenteditable.childNodes.length, 7, "Move text/html and text/plain from contenteditable onto itself child nodes");
1.160 + is(contenteditable.childNodes[6].tagName, "I", "Move text/html and text/plain from contenteditable onto itself italic");
1.161 + is(contenteditable.childNodes[6].textContent, "Italic", "Move text/html and text/plain from contenteditable onto itself text");
1.162 +
1.163 + // We'd test 'move' here as well as 'copy', but that requires knowledge of
1.164 + // the source of the drag which drag simulation doesn't provide.
1.165 +
1.166 + // -------- Test dragging non-editable nested inside contenteditable to contenteditable
1.167 +
1.168 + input.focus(); // this resets some state in the selection otherwise an inexplicable error occurs calling selectAllChildren.
1.169 + input.blur();
1.170 +
1.171 + var nonEditable = document.getElementById("noneditable");
1.172 + selection.selectAllChildren(nonEditable);
1.173 + synthesizeDrop(nonEditable, document.getElementById("first"), [], "copy");
1.174 + is(document.getElementById("nestedce").textContent, " MiddleFirst letter Middle Last part",
1.175 + "Drag non-editable text/html onto contenteditable text");
1.176 +
1.177 + SimpleTest.finish();
1.178 +}
1.179 +
1.180 +SimpleTest.waitForFocus(doTest);
1.181 +
1.182 +</script>
1.183 +</body>
1.184 +</html>
