1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/imptests/editing/conformancetest/test_event.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,290 @@
1.4 +<!doctype html>
1.5 +<title>Editing event tests</title>
1.6 +<style>body { font-family: serif }</style>
1.7 +<script src=/resources/testharness.js></script>
1.8 +<script src=/resources/testharnessreport.js></script>
1.9 +<div id=test></div>
1.10 +<div id=log></div>
1.11 +<script>
1.12 +"use strict";
1.13 +
1.14 +var div = document.querySelector("#test");
1.15 +add_completion_callback(function() { div.parentNode.removeChild(div) });
1.16 +
1.17 +function copyEvent(e) {
1.18 + var ret = {};
1.19 + ret.original = e;
1.20 + ["type", "target", "currentTarget", "eventPhase", "bubbles", "cancelable",
1.21 + "defaultPrevented", "isTrusted", "command", "value"].forEach(function(k) {
1.22 + ret[k] = e[k];
1.23 + });
1.24 + return ret;
1.25 +}
1.26 +
1.27 +var tests = [
1.28 + {
1.29 + name: "Simple editable div",
1.30 + html: "<div contenteditable>foo<b>bar</b>baz</div>",
1.31 + initRange: function(range) {
1.32 + range.setStart(div.querySelector("b").firstChild, 0);
1.33 + range.setEnd(div.querySelector("b"), 1);
1.34 + },
1.35 + target: function() { return div.firstChild },
1.36 + command: "bold",
1.37 + value: "",
1.38 + },
1.39 + {
1.40 + name: "Editable b",
1.41 + html: "foo<b contenteditable>bar</b>baz",
1.42 + initRange: function(range) {
1.43 + range.setStart(div.querySelector("b").firstChild, 0);
1.44 + range.setEnd(div.querySelector("b"), 1);
1.45 + },
1.46 + target: function() { return div.querySelector("b") },
1.47 + command: "bold",
1.48 + value: "",
1.49 + },
1.50 + {
1.51 + name: "No editable content",
1.52 + html: "foo<b>bar</b>baz",
1.53 + initRange: function(range) {
1.54 + range.setStart(div.querySelector("b").firstChild, 0);
1.55 + range.setEnd(div.querySelector("b"), 1);
1.56 + },
1.57 + target: function() { return null },
1.58 + command: "bold",
1.59 + value: "",
1.60 + },
1.61 + {
1.62 + name: "Partially-selected editable content",
1.63 + html: "foo<b contenteditable>bar</b>baz",
1.64 + initRange: function(range) {
1.65 + range.setStart(div.querySelector("b").firstChild, 0);
1.66 + range.setEnd(div, 3);
1.67 + },
1.68 + target: function() { return null },
1.69 + command: "bold",
1.70 + value: "",
1.71 + },
1.72 + {
1.73 + name: "Selection spans two editing hosts",
1.74 + html: "<div contenteditable>foo</div><div contenteditable>bar</div>",
1.75 + initRange: function(range) {
1.76 + range.setStart(div.querySelector("div").firstChild, 2);
1.77 + range.setEnd(div.querySelector("div + div").firstChild, 1);
1.78 + },
1.79 + target: function() { return null },
1.80 + command: "bold",
1.81 + value: "",
1.82 + },
1.83 + {
1.84 + name: "Selection includes two editing hosts",
1.85 + html: "foo<div contenteditable>bar</div>baz<div contenteditable>quz</div>qoz",
1.86 + initRange: function(range) {
1.87 + range.setStart(div.firstChild, 2);
1.88 + range.setEnd(div.lastChild, 1);
1.89 + },
1.90 + target: function() { return null },
1.91 + command: "bold",
1.92 + value: "",
1.93 + },
1.94 + {
1.95 + name: "Changing selection from handler",
1.96 + html: "<div contenteditable>foo</div><div contenteditable>bar</div>",
1.97 + initRange: function(range) {
1.98 + range.setStart(div.querySelector("div").firstChild, 0);
1.99 + range.setEnd(div.querySelector("div").firstChild, 3);
1.100 + },
1.101 + target: function() { return div.firstChild },
1.102 + finalTarget: function() { return div.lastChild },
1.103 + beforeInputAction: function() {
1.104 + getSelection().removeAllRanges();
1.105 + var range = document.createRange();
1.106 + range.setStart(div.querySelector("div + div").firstChild, 0);
1.107 + range.setEnd(div.querySelector("div + div").firstChild, 3);
1.108 + getSelection().addRange(range);
1.109 + },
1.110 + command: "bold",
1.111 + value: "",
1.112 + },
1.113 +];
1.114 +
1.115 +var commandTests = {
1.116 + backColor: ["green"],
1.117 + createLink: ["http://www.w3.org/community/editing/"],
1.118 + fontName: ["serif", "Helvetica"],
1.119 + fontSize: ["6", "15px"],
1.120 + foreColor: ["green"],
1.121 + hiliteColor: ["green"],
1.122 + italic: [],
1.123 + removeFormat: [],
1.124 + strikeThrough: [],
1.125 + subscript: [],
1.126 + superscript: [],
1.127 + underline: [],
1.128 + unlink: [],
1.129 + delete: [],
1.130 + formatBlock: ["p"],
1.131 + forwardDelete: [],
1.132 + indent: [],
1.133 + insertHorizontalRule: ["id"],
1.134 + insertHTML: ["<b>hi</b>"],
1.135 + insertImage: ["http://example.com/some-image"],
1.136 + insertLineBreak: [],
1.137 + insertOrderedList: [],
1.138 + insertParagraph: [],
1.139 + insertText: ["abc"],
1.140 + insertUnorderedList: [],
1.141 + justifyCenter: [],
1.142 + justifyFull: [],
1.143 + justifyLeft: [],
1.144 + justifyRight: [],
1.145 + outdent: [],
1.146 + redo: [],
1.147 + selectAll: [],
1.148 + styleWithCSS: [],
1.149 + undo: [],
1.150 + useCSS: [],
1.151 +};
1.152 +
1.153 +Object.keys(commandTests).forEach(function(command) {
1.154 + commandTests[command] = ["", "quasit"].concat(commandTests[command]);
1.155 + commandTests[command].forEach(function(value) {
1.156 + tests.push({
1.157 + name: "Command " + command + ", value " + format_value(value),
1.158 + html: "<div contenteditable>foo<b>bar</b>baz</div>",
1.159 + initRange: function(range) {
1.160 + range.setStart(div.querySelector("b").firstChild, 0);
1.161 + range.setEnd(div.querySelector("b"), 1);
1.162 + },
1.163 + target: function() {
1.164 + return ["redo", "selectAll", "styleWithCSS", "undo", "useCSS"]
1.165 + .indexOf(command) == -1 ? div.firstChild : null;
1.166 + },
1.167 + command: command,
1.168 + value: value,
1.169 + });
1.170 + });
1.171 +});
1.172 +
1.173 +tests.forEach(function(obj) {
1.174 + [true, false].forEach(function(cancel) {
1.175 + // Kill all event handlers first
1.176 + var newDiv = div.cloneNode(false);
1.177 + div.parentNode.insertBefore(newDiv, div);
1.178 + div.parentNode.removeChild(div);
1.179 + div = newDiv;
1.180 +
1.181 + div.innerHTML = obj.html;
1.182 +
1.183 + var originalContents = div.cloneNode(true);
1.184 +
1.185 + getSelection().removeAllRanges();
1.186 + var range = document.createRange();
1.187 + obj.initRange(range);
1.188 + getSelection().addRange(range);
1.189 +
1.190 + var target = obj.target();
1.191 + var finalTarget = "finalTarget" in obj ? obj.finalTarget() : target;
1.192 + var command = obj.command;
1.193 + var value = obj.value;
1.194 +
1.195 + var beforeInputEvents = [];
1.196 + var inputEvents = [];
1.197 + div.addEventListener("beforeinput", function(e) {
1.198 + var copied = copyEvent(e);
1.199 + copied.inputEventsLength = inputEvents.length;
1.200 + beforeInputEvents.push(copied);
1.201 + if (cancel) {
1.202 + e.preventDefault();
1.203 + }
1.204 + if ("beforeInputAction" in obj) {
1.205 + obj.beforeInputAction();
1.206 + }
1.207 + });
1.208 + div.addEventListener("input", function(e) { inputEvents.push(copyEvent(e)) });
1.209 +
1.210 + // Uncomment this code instead of the execCommand() to make all the
1.211 + // tests pass, as a sanity check
1.212 + //var e = new Event("beforeinput", {bubbles: true, cancelable: true});
1.213 + //e.command = command;
1.214 + //e.value = value;
1.215 + //var ret = target ? target.dispatchEvent(e) : false;
1.216 + //if (ret) {
1.217 + // var e = new Event("input", {bubbles: true});
1.218 + // e.command = command;
1.219 + // e.value = value;
1.220 + // finalTarget.dispatchEvent(e);
1.221 + //}
1.222 +
1.223 + var exception = null;
1.224 + try {
1.225 + document.execCommand(command, false, value);
1.226 + } catch(e) {
1.227 + exception = e;
1.228 + }
1.229 +
1.230 + test(function() {
1.231 + assert_equals(exception, null, "Unexpected exception");
1.232 + }, obj.name + ": execCommand() must not throw, "
1.233 + + (cancel ? "canceled" : "uncanceled"));
1.234 +
1.235 + test(function() {
1.236 + assert_equals(beforeInputEvents.length, target ? 1 : 0,
1.237 + "number of beforeinput events fired");
1.238 + if (beforeInputEvents.length == 0) {
1.239 + assert_equals(inputEvents.length, 0, "number of input events fired");
1.240 + return;
1.241 + }
1.242 + var e = beforeInputEvents[0];
1.243 + assert_equals(e.inputEventsLength, 0, "number of input events fired");
1.244 + assert_equals(e.type, "beforeinput", "event.type");
1.245 + assert_equals(e.target, target, "event.target");
1.246 + assert_equals(e.currentTarget, div, "event.currentTarget");
1.247 + assert_equals(e.eventPhase, Event.BUBBLING_PHASE, "event.eventPhase");
1.248 + assert_equals(e.bubbles, true, "event.bubbles");
1.249 + assert_equals(e.cancelable, true, "event.cancelable");
1.250 + assert_equals(e.defaultPrevented, false, "event.defaultPrevented");
1.251 + assert_equals(e.command, command, "e.command");
1.252 + assert_equals(e.value, value, "e.value");
1.253 + assert_own_property(window, "EditingBeforeInputEvent",
1.254 + "window.EditingBeforeInputEvent must exist");
1.255 + assert_equals(Object.getPrototypeOf(e.original),
1.256 + EditingBeforeInputEvent.prototype,
1.257 + "event prototype");
1.258 + assert_true(originalContents.isEqualNode(div),
1.259 + "div contents not yet changed");
1.260 + assert_equals(e.isTrusted, true, "event.isTrusted");
1.261 + }, obj.name + ": beforeinput event, " + (cancel ? "canceled" : "uncanceled"));
1.262 +
1.263 + test(function() {
1.264 + assert_equals(inputEvents.length, target && !cancel ? 1 : 0,
1.265 + "number of input events fired");
1.266 + if (!target || cancel) {
1.267 + assert_true(originalContents.isEqualNode(div),
1.268 + "div contents must not be changed");
1.269 + return;
1.270 + }
1.271 + var e = inputEvents[0];
1.272 + assert_equals(e.type, "input", "event.type");
1.273 + assert_equals(e.target, finalTarget, "event.target");
1.274 + assert_equals(e.currentTarget, div, "event.currentTarget");
1.275 + assert_equals(e.eventPhase, Event.BUBBLING_PHASE, "event.eventPhase");
1.276 + assert_equals(e.bubbles, true, "event.bubbles");
1.277 + assert_equals(e.cancelable, false, "event.cancelable");
1.278 + assert_equals(e.defaultPrevented, false, "event.defaultPrevented");
1.279 + assert_equals(e.command, command, "e.command");
1.280 + assert_equals(e.value, value, "e.value");
1.281 + assert_own_property(window, "EditingInputEvent",
1.282 + "window.EditingInputEvent must exist");
1.283 + assert_equals(Object.getPrototypeOf(e.original),
1.284 + EditingInputEvent.prototype,
1.285 + "event prototype");
1.286 + assert_equals(e.isTrusted, true, "event.isTrusted");
1.287 + }, obj.name + ": input event, " + (cancel ? "canceled" : "uncanceled"));
1.288 + });
1.289 +});
1.290 +
1.291 +// Thanks, Gecko.
1.292 +document.body.bgColor = "";
1.293 +</script>
