Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- Manifest: editor/libeditor/tests/mochitest.toml
<!DOCTYPE HTML>
<html>
<!--
-->
<head>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=430392">Mozilla Bug 430392</a>
<p id="display"></p>
<div id="content">
<div contenteditable="true" id="edit"> <span contenteditable="false">A</span> ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span> </div>
</div>
<pre id="test">
<script class="testbody" type="text/javascript">
function test() {
var edit = document.getElementById("edit");
var html = edit.innerHTML;
var expectedText = edit.textContent;
document.getElementById("edit").focus();
// Each test is [desc, callback, inputType of `beforeinput`, inputType of `input`].
// callback() is called and we check that the textContent didn't change.
// For expected failures, the format is
// [desc, callback, undefined, inputType of `beforeinput`, inputType of `input`, expectedValue],
// and the test will be marked as an expected fail if the textContent changes
// to expectedValue, and an unexpected fail if it's neither the original value
// nor expectedValue.
let tests = [
[
"adding returns",
() => {
getSelection().collapse(edit.firstChild, 0); // [] <span contenteditable=false>A</span> ; <span
synthesizeKey("KEY_ArrowRight"); // <span contenteditable=false>A</span>[] ; <span
synthesizeKey("KEY_Enter");
synthesizeKey("KEY_Enter");
synthesizeKey("KEY_Backspace");
synthesizeKey("KEY_Backspace");
}, [
"insertParagraph",
"insertParagraph",
"deleteContentBackward",
"deleteContentBackward",
],
[
"insertParagraph",
"insertParagraph",
"deleteContentBackward",
"deleteContentBackward",
],
aSeparator => {
switch (aSeparator) {
case "div":
case "p":
// After insertParagraph, the space after "A" becomes a preceding
// white space in the paragraph. Therefore, it's removed when
// joining the block boundary by Backspace.
// So, this is actual expected result for the cases.
return " A; B ; C ";
case "br":
// After insertLineBreak, the first white-space should be replaced
// with and it should not be reconverted at Backspace.
// Therefore, the actual expected result is " A ; B ; C ".
return undefined;
}
throw new Error("handle all cases!");
},
],
[
"adding shift-returns",
() => {
getSelection().collapse(edit.firstChild, 0); // [] <span contenteditable=false>A</span> ; <span
synthesizeKey("KEY_ArrowRight"); // <span contenteditable=false>A</span>[] ; <span
synthesizeKey("KEY_Enter", {shiftKey: true});
synthesizeKey("KEY_Enter", {shiftKey: true});
synthesizeKey("KEY_Backspace");
synthesizeKey("KEY_Backspace");
}, [
"insertLineBreak",
"insertLineBreak",
"deleteContentBackward",
"deleteContentBackward",
], [
"insertLineBreak",
"insertLineBreak",
"deleteContentBackward",
"deleteContentBackward",
],
// Actual expected result should be "A ; B ; C " because when first
// <br> is inserted, the following white-space should be preserved as
// an . Then, it should not be reconverted to a white-space after
// Backspace.
" ; AB ; C ",
],
];
[
["insertorderedlist", "insertOrderedList"],
["insertunorderedlist", "insertUnorderedList"],
["formatblock", "", "p"],
].forEach(item => {
let cmd = item[0];
let param = item[2];
let inputType = item[1];
tests.push([cmd, () => { document.execCommand(cmd, false, param); },
[/* execCommand shouldn't cause beforeinput event */],
[inputType]]);
});
// These are all TODO -- they don't move the non-editable elements
[
["bold", "formatBold"],
["italic", "formatItalic"],
["underline", "formatUnderline"],
["strikethrough", "formatStrikeThrough"],
["subscript", "formatSubscript"],
["superscript", "formatSuperscript"],
["forecolor", "formatFontColor", "blue"],
["backcolor", "formatBackColor", "blue"],
["hilitecolor", "formatBackColor", "blue"],
["fontname", "formatFontName", "monospace"],
["fontsize", "", "1"],
["justifyright", "formatJustifyRight"],
["justifycenter", "formatJustifyCenter"],
["justifyfull", "formatJustifyFull"],
].forEach(item => {
let cmd = item[0];
let param = item[2];
let inputType = item[1];
tests.push([cmd, () => { document.execCommand(cmd, false, param); },
[/* execCommand shouldn't cause beforeinput event */],
[inputType],
" A ; ; BC "]);
});
tests.push(["indent", () => { document.execCommand("indent"); },
[/* execCommand shouldn't cause beforeinput event */],
["formatIndent"],
" ; ; ABC"]);
let beforeinputTypes = [];
let inputTypes = [];
edit.addEventListener("beforeinput", event => { beforeinputTypes.push(event.inputType); });
edit.addEventListener("input", event => { inputTypes.push(event.inputType); });
tests.forEach(arr => {
["div", "br", "p"].forEach(sep => {
document.execCommand("defaultParagraphSeparator", false, sep);
let expectedFailText = typeof arr[4] == "function" ? arr[4](sep) : arr[4];
edit.innerHTML = html;
edit.focus();
getSelection().selectAllChildren(edit);
beforeinputTypes = [];
inputTypes = [];
arr[1]();
const resultText = edit.textContent;
if (expectedFailText !== undefined) {
todo_is(resultText, expectedText, `${arr[0]} should not change text (${sep})`);
if (resultText !== expectedText && resultText !== expectedFailText) {
is(resultText, expectedFailText, `${arr[0]} changed to different failure (${sep})`);
}
} else {
is(resultText, expectedText, `${arr[0]} should not change text (${sep})`);
}
is(beforeinputTypes.length, arr[2].length, `${arr[0]}: number of beforeinput events should be ${arr[2].length} (${sep})`);
for (let i = 0; i < Math.max(beforeinputTypes.length, arr[2].length); i++) {
if (i < beforeinputTypes.length && i < arr[2].length) {
is(beforeinputTypes[i], arr[2][i], `${arr[0]}: ${i + 1}th inputType of beforeinput event should be "${arr[2][i]}" (${sep})`);
} else if (i < beforeinputTypes.length) {
ok(false, `${arr[0]}: Redundant beforeinput event shouldn't be fired, its inputType was "${beforeinputTypes[i]}" (${sep})`);
} else {
ok(false, `${arr[0]}: beforeinput event whose inputType is "${arr[2][i]}" should be fired, but not fired (${sep})`);
}
}
is(inputTypes.length, arr[3].length, `${arr[0]}: number of input events is unexpected (${sep})`);
for (let i = 0; i < Math.max(inputTypes.length, arr[3].length); i++) {
if (i < inputTypes.length && i < arr[3].length) {
is(inputTypes[i], arr[3][i], `${arr[0]}: ${i + 1}th inputType of input event should be "${arr[3][i]}" (${sep})`);
} else if (i < inputTypes.length) {
ok(false, `${arr[0]}: Redundant input event shouldn't be fired, its inputType was "${inputTypes[i]}" (${sep})`);
} else {
ok(false, `${arr[0]}: input event whose inputType is "${arr[3][i]}" should be fired, but not fired (${sep})`);
}
}
});
});
SimpleTest.finish();
}
SimpleTest.waitForExplicitFinish();
SimpleTest.waitForFocus(test);
</script>
</pre>
</body>
</html>