243 lines
10 KiB
HTML
243 lines
10 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<!--
|
|
https://bugzilla.mozilla.org/show_bug.cgi?id=430392
|
|
-->
|
|
<head>
|
|
<title>Test for Bug 430392</title>
|
|
<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">
|
|
|
|
/** Test for Bug 430392 **/
|
|
|
|
function test() {
|
|
const kNewWhiteSpaceNormalizerEnabled =
|
|
SpecialPowers.getBoolPref("editor.white_space_normalization.blink_compatible");
|
|
|
|
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");
|
|
info(`1st Enter: "${edit.innerHTML}"`);
|
|
// " <div><span contenteditable="false">A</span><br></div><div>[] ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span></div> "
|
|
synthesizeKey("KEY_Enter");
|
|
info(`2nd Enter: "${edit.innerHTML}"`);
|
|
// " <div><span contenteditable="false">A</span><br></div><div><br></div><div>[] ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span></div> "
|
|
synthesizeKey("KEY_Backspace");
|
|
info(`1st Backspace: "${edit.innerHTML}"`);
|
|
// " <div><span contenteditable="false">A</span><br></div><div> ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span></div> "
|
|
synthesizeKey("KEY_Backspace");
|
|
info(`2nd Backspace: "${edit.innerHTML}"`);
|
|
// " <div><span contenteditable="false">A</span> ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span></div> "
|
|
}, [
|
|
"insertParagraph",
|
|
"insertParagraph",
|
|
"deleteContentBackward",
|
|
"deleteContentBackward",
|
|
],
|
|
[
|
|
"insertParagraph",
|
|
"insertParagraph",
|
|
"deleteContentBackward",
|
|
"deleteContentBackward",
|
|
],
|
|
aSeparator => {
|
|
switch (aSeparator) {
|
|
case "div":
|
|
case "p":
|
|
if (kNewWhiteSpaceNormalizerEnabled) {
|
|
// The following white-space of "A" should be converted to an
|
|
// NBSP when it's wrapped in a new paragraph. Then, it'll stay
|
|
// the start of the `Text` after `Backspace`es. Therefore, it
|
|
// won't be back to an ASCII white-space.
|
|
return " A\u00A0; B ; C ";
|
|
}
|
|
// 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.
|
|
// XXX Shouldn't it become invisible, so, shouldn't be removed later.
|
|
// 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 ".
|
|
if (kNewWhiteSpaceNormalizerEnabled) {
|
|
return " A\u00A0; 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});
|
|
info(`1st Shift+Enter: "${edit.innerHTML}"`);
|
|
// " <span contenteditable="false">A</span><br>[] ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span> "
|
|
synthesizeKey("KEY_Enter", {shiftKey: true});
|
|
info(`2nd Shift+Enter: "${edit.innerHTML}"`);
|
|
// " <span contenteditable="false">A</span><br><br>[] ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span> "
|
|
synthesizeKey("KEY_Backspace");
|
|
info(`1st Backspace: "${edit.innerHTML}"`);
|
|
// " <span contenteditable="false">A</span><br>[] ; <span contenteditable="false">B</span> ; <span contenteditable="false">C</span> "
|
|
synthesizeKey("KEY_Backspace");
|
|
info(`2nd Backspace: "${edit.innerHTML}"`);
|
|
// " [] ; <span contenteditable="false">A</span><span contenteditable="false">B</span> ; <span contenteditable="false">C</span> "
|
|
}, [
|
|
"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.
|
|
kNewWhiteSpaceNormalizerEnabled ? " \u00A0; AB ; C " : " ; 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.replaceAll(/\u00A0/g, " "),
|
|
expectedFailText.replaceAll(/\u00A0/g, " "),
|
|
`${arr[0]} changed to different failure (${sep})`
|
|
);
|
|
}
|
|
} else {
|
|
is(
|
|
resultText.replaceAll(/\u00A0/g, " "),
|
|
expectedText.replaceAll(/\u00A0/g, " "),
|
|
`${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>
|