mozilla-central/editor/libeditor/tests/test_bug772796.html

Source code

Revision control

Copy as Markdown

Other Tools

Test Info: Errors

<!DOCTYPE HTML>
<html>
<!--
-->
<head>
<meta charset="utf-8">
<title>Test for Bug 772796</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"/>
<style> .pre { white-space: pre } </style>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=772796">Mozilla Bug 772796</a>
<p id="display"></p>
<div id="content" style="display: none">
</div>
<div id="editable" contenteditable></div>
<pre id="test">
<script type="application/javascript">
var tests = [
// FYI: Those tests were ported to join-pre-and-other-block.html
/* 00*/[
"<div>test</div><pre>foobar\nbaz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 01*/[
"<div>test</div><pre><b>foobar\nbaz</b></pre>",
"<div>test<b>foobar</b></div><pre><b>baz</b></pre>", // expected
],
/* 02*/[
"<div>test</div><pre><b>foo</b>bar\nbaz</pre>",
"<div>test<b>foo</b>bar</div><pre>baz</pre>", // expected
],
/* 03*/[
"<div>test</div><pre><b>foo</b>\nbar</pre>",
"<div>test<b>foo</b></div><pre>bar</pre>", // expected
],
/* 04*/[
"<div>test</div><pre><b>foo\n</b>bar\nbaz</pre>",
"<div>test<b>foo</b></div><pre>bar\nbaz</pre>", // expected
],
// The <br> after the foobar is unfortunate but is behaviour that hasn't changed in bug 772796.
// FYI: Those tests were ported to join-pre-and-other-block.html
/* 05*/[
"<div>test</div><pre>foobar<br>baz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 06*/[
"<div>test</div><pre><b>foobar<br>baz</b></pre>",
"<div>test<b>foobar</b></div><pre><b>baz</b></pre>", // expected
],
// Some tests with block elements.
// FYI: Those tests were ported to join-pre-and-other-block.html
/* 07*/[
"<div>test</div><pre><div>foobar</div>baz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 08*/[
"<div>test</div><pre>foobar<div>baz</div></pre>",
"<div>testfoobar</div><pre><div>baz</div></pre>", // expected
],
/* 09*/[
"<div>test</div><pre><div>foobar</div>baz\nfred</pre>",
"<div>testfoobar</div><pre>baz\nfred</pre>", // expected
],
/* 10*/[
"<div>test</div><pre>foobar<div>baz</div>\nfred</pre>",
"<div>testfoobar</div><pre><div>baz</div>\nfred</pre>", // expected
],
/* 11*/[
"<div>test</div><pre><div>foo\nbar</div>baz\nfred</pre>",
"<div>testfoo</div><pre><div>bar</div>baz\nfred</pre>", // expected
],
/* 12*/[
"<div>test</div><pre>foo<div>bar</div>baz\nfred</pre>",
"<div>testfoo</div><pre><div>bar</div>baz\nfred</pre>", // expected
],
// Repeating all tests above with the <pre> on a new line.
// We know that backspace doesn't work (bug 1190161). Third argument shows the current outcome.
/* 13-00*/[
"<div>test</div>\n<pre>foobar\nbaz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 14-01*/[
"<div>test</div>\n<pre><b>foobar\nbaz</b></pre>",
"<div>test<b>foobar</b></div><pre><b>baz</b></pre>", // expected
],
/* 15-02*/[
"<div>test</div>\n<pre><b>foo</b>bar\nbaz</pre>",
"<div>test<b>foo</b>bar</div><pre>baz</pre>", // expected
],
/* 16-03*/[
"<div>test</div>\n<pre><b>foo</b>\nbar</pre>",
"<div>test<b>foo</b></div><pre>bar</pre>", // expected
],
/* 17-04*/[
"<div>test</div>\n<pre><b>foo\n</b>bar\nbaz</pre>",
"<div>test<b>foo</b></div><pre>bar\nbaz</pre>", // expected
],
/* 18-05*/[
"<div>test</div>\n<pre>foobar<br>baz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 19-06*/[
"<div>test</div>\n<pre><b>foobar<br>baz</b></pre>",
"<div>test<b>foobar</b></div><pre><b>baz</b></pre>", // expected
],
/* 20-07*/[
"<div>test</div>\n<pre><div>foobar</div>baz</pre>",
"<div>testfoobar</div><pre>baz</pre>", // expected
],
/* 21-08*/[
"<div>test</div>\n<pre>foobar<div>baz</div></pre>",
"<div>testfoobar</div><pre><div>baz</div></pre>", // expected
],
/* 22-09*/[
"<div>test</div>\n<pre><div>foobar</div>baz\nfred</pre>",
"<div>testfoobar</div><pre>baz\nfred</pre>", // expected
],
/* 23-10*/[
"<div>test</div>\n<pre>foobar<div>baz</div>\nfred</pre>",
"<div>testfoobar</div><pre><div>baz</div>\nfred</pre>", // expected
],
/* 24-11*/[
"<div>test</div>\n<pre><div>foo\nbar</div>baz\nfred</pre>",
"<div>testfoo</div><pre><div>bar</div>baz\nfred</pre>", // expected
],
/* 25-12*/[
"<div>test</div>\n<pre>foo<div>bar</div>baz\nfred</pre>",
"<div>testfoo</div><pre><div>bar</div>baz\nfred</pre>", // expected
],
// Some tests without <div>. These exercise the MoveBlock "right in left"
/* 26-00*/[
"test<pre>foobar\nbaz</pre>",
"testfoobar<pre>baz</pre>", // expected
],
/* 27-01*/[
"test<pre><b>foobar\nbaz</b></pre>",
"test<b>foobar</b><pre><b>baz</b></pre>", // expected
],
/* 28-02*/[
"test<pre><b>foo</b>bar\nbaz</pre>",
"test<b>foo</b>bar<pre>baz</pre>", // expected
],
/* 29-03*/[
"test<pre><b>foo</b>\nbar</pre>",
"test<b>foo</b><pre>bar</pre>", // expected
],
/* 30-04*/[
"test<pre><b>foo\n</b>bar\nbaz</pre>",
"test<b>foo</b><pre>bar\nbaz</pre>", // expected
],
/* 31-05*/[
"test<pre>foobar<br>baz</pre>",
"testfoobar<pre>baz</pre>", // expected
],
/* 32-06*/[
"test<pre><b>foobar<br>baz</b></pre>",
"test<b>foobar</b><pre><b>baz</b></pre>", // expected
],
/* 33-07*/[
"test<pre><div>foobar</div>baz</pre>",
"testfoobar<pre>baz</pre>", // expected
],
/* 34-08*/[
"test<pre>foobar<div>baz</div></pre>",
"testfoobar<pre><div>baz</div></pre>", // expected
],
/* 35-09*/[
"test<pre><div>foobar</div>baz\nfred</pre>",
"testfoobar<pre>baz\nfred</pre>", // expected
],
/* 36-10*/[
"test<pre>foobar<div>baz</div>\nfred</pre>",
"testfoobar<pre><div>baz</div>\nfred</pre>", // expected
],
/* 37-11*/[
"test<pre><div>foo\nbar</div>baz\nfred</pre>",
"testfoo<pre><div>bar</div>baz\nfred</pre>", // expected
],
/* 38-12*/[
"test<pre>foo<div>bar</div>baz\nfred</pre>",
"testfoo<pre><div>bar</div>baz\nfred</pre>", // expected
],
// Some tests with <span class="pre">
// All these exercise MoveBlock "left in right". The "right" is the surrounding "contenteditable" div.
// FYI: Those tests except the cases <span> having <div> were ported to
// join-different-white-space-style-left-paragraph-and-right-line.html
/* 39-00*/[
"<div>test</div><span class=\"pre\">foobar\nbaz</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\">foobar</span></div><span class=\"pre\">baz</span>", // expected
],
/* 40-01*/[
"<div>test</div><span class=\"pre\"><b>foobar\nbaz</b></span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><b>foobar</b></span></div><span class=\"pre\"><b>baz</b></span>", // expected
],
/* 41-02*/[
"<div>test</div><span class=\"pre\"><b>foo</b>bar\nbaz</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><b>foo</b>bar</span></div><span class=\"pre\">baz</span>", // expected
],
/* 42-03*/[
"<div>test</div><span class=\"pre\"><b>foo</b>\nbar</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><b>foo</b></span></div><span class=\"pre\">bar</span>", // expected
],
/* 43-04*/[
"<div>test</div><span class=\"pre\"><b>foo\n</b>bar\nbaz</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><b>foo</b></span></div><span class=\"pre\">bar\nbaz</span>", // expected
],
/* 44-05*/[
"<div>test</div><span class=\"pre\">foobar<br>baz</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\">foobar</span></div><span class=\"pre\">baz</span>", // expected
],
/* 45-06*/[
"<div>test</div><span class=\"pre\"><b>foobar<br>baz</b></span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><b>foobar</b></span></div><span class=\"pre\"><b>baz</b></span>", // expected
],
/* 46-07*/[
"<div>test</div><span class=\"pre\"><div>foobar</div>baz</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><div>foobar</div></span></div><span class=\"pre\">baz</span>", // expected
],
/* 47-08*/[
"<div>test</div><span class=\"pre\">foobar<div>baz</div></span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\">foobar</span></div><span class=\"pre\"><div>baz</div></span>", // expected
],
/* 48-09*/[
"<div>test</div><span class=\"pre\"><div>foobar</div>baz\nfred</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\"><div>foobar</div></span></div><span class=\"pre\">baz\nfred</span>", // expected
],
/* 49-10*/[
"<div>test</div><span class=\"pre\">foobar<div>baz</div>\nfred</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\">foobar</span></div><span class=\"pre\"><div>baz</div>\nfred</span>", // expected
],
/* 50-11*/[
"<div>test</div><span class=\"pre\"><div>foo\nbar</div>baz\nfred</span>",
"<div>test<span style=\"white-space: pre;\">foo</span></div><span class=\"pre\"><div>bar</div>baz\nfred</span>", // expected
],
/* 51-12*/[
"<div>test</div><span class=\"pre\">foo<div>bar</div>baz\nfred</span>",
"<div>test<span class=\"pre\" style=\"white-space: pre;\">foo</span></div><span class=\"pre\"><div>bar</div>baz\nfred</span>", // expected
],
// Some tests with <div class="pre">.
// FYI: Those tests were ported to join-different-white-space-style-paragraphs.html
/* 52-00*/[
"<div>test</div><div class=\"pre\">foobar\nbaz</div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\">baz</div>", // expected
],
/* 53-01*/[
"<div>test</div><div class=\"pre\"><b>foobar\nbaz</b></div>",
"<div>test<b style=\"white-space: pre;\">foobar</b></div><div class=\"pre\"><b>baz</b></div>", // expected
],
/* 54-02*/[
"<div>test</div><div class=\"pre\"><b>foo</b>bar\nbaz</div>",
"<div>test<b style=\"white-space: pre;\">foo</b><span style=\"white-space: pre;\">bar</span></div><div class=\"pre\">baz</div>", // expected
],
/* 55-03*/[
"<div>test</div><div class=\"pre\"><b>foo</b>\nbar</div>",
"<div>test<b style=\"white-space: pre;\">foo</b></div><div class=\"pre\">bar</div>", // expected
],
/* 56-04*/[
"<div>test</div><div class=\"pre\"><b>foo\n</b>bar\nbaz</div>",
"<div>test<b style=\"white-space: pre;\">foo</b></div><div class=\"pre\">bar\nbaz</div>", // expected
],
/* 57-05*/[
"<div>test</div><div class=\"pre\">foobar<br>baz</div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\">baz</div>", // expected
],
/* 58-06*/[
"<div>test</div><div class=\"pre\"><b>foobar<br>baz</b></div>",
"<div>test<b style=\"white-space: pre;\">foobar</b></div><div class=\"pre\"><b>baz</b></div>", // expected
],
/* 59-07*/[
"<div>test</div><div class=\"pre\"><div>foobar</div>baz</div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\">baz</div>", // expected
],
/* 60-08*/[
"<div>test</div><div class=\"pre\">foobar<div>baz</div></div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\"><div>baz</div></div>", // expected
],
/* 61-09*/[
"<div>test</div><div class=\"pre\"><div>foobar</div>baz\nfred</div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\">baz\nfred</div>", // expected
],
/* 62-10*/[
"<div>test</div><div class=\"pre\">foobar<div>baz</div>\nfred</div>",
"<div>test<span style=\"white-space: pre;\">foobar</span></div><div class=\"pre\"><div>baz</div>\nfred</div>", // expected
],
/* 63-11*/[
"<div>test</div><div class=\"pre\"><div>foo\nbar</div>baz\nfred</div>",
"<div>test<span style=\"white-space: pre;\">foo</span></div><div class=\"pre\"><div>bar</div>baz\nfred</div>", // expected
],
/* 64-12*/[
"<div>test</div><div class=\"pre\">foo<div>bar</div>baz\nfred</div>",
"<div>test<span style=\"white-space: pre;\">foo</span></div><div class=\"pre\"><div>bar</div>baz\nfred</div>", // expected
],
// Some tests with lists. These exercise the MoveBlock "left in right".
/* 65*/[
"<ul><pre><li>test</li>foobar\nbaz</pre></ul>",
"<ul><pre><li>testfoobar</li>baz</pre></ul>", // expected
],
/* 66*/[
"<ul><pre><li>test</li><b>foobar\nbaz</b></pre></ul>",
"<ul><pre><li>test<b>foobar</b></li><b>baz</b></pre></ul>", // expected
],
/* 67*/[
"<ul><pre><li>test</li><b>foo</b>bar\nbaz</pre></ul>",
"<ul><pre><li>test<b>foo</b>bar</li>baz</pre></ul>", // expected
],
/* 68*/[
"<ul><pre><li>test</li><b>foo</b>\nbar</pre></ul>",
"<ul><pre><li>test<b>foo</b></li>bar</pre></ul>", // expected
],
/* 69*/[
"<ul><pre><li>test</li><b>foo\n</b>bar\nbaz</pre></ul>",
"<ul><pre><li>test<b>foo</b></li>bar\nbaz</pre></ul>", // expected
],
// Last not least, some simple edge case tests.
// FYI: Those tests were ported to join-pre-and-other-block.html
/* 70*/[
"<div>test</div><pre>foobar\n</pre>baz",
"<div>testfoobar</div>baz", // expected
],
/* 71*/[
"<div>test</div><pre>\nfoo\nbar</pre>",
"<div>testfoo</div><pre>bar</pre>", // expected
],
/* 72*/[
"<div>test</div><pre>\n\nfoo\nbar</pre>",
"<div>test</div><pre>foo\nbar</pre>", // expected
],
];
/** Test for Bug 772796 **/
SimpleTest.waitForExplicitFinish();
SimpleTest.waitForFocus(function() {
var sel = window.getSelection();
var theEdit = document.getElementById("editable");
var testName;
var theDiv;
for (let i = 0; i < tests.length; i++) {
testName = "test" + i.toString();
/* Set up the selection. */
theEdit.innerHTML = "<div id=\"" + testName + "\">" + tests[i][0] + "</div>";
theDiv = document.getElementById(testName);
theDiv.focus();
sel.collapse(theDiv, 0);
synthesizeMouse(theDiv, 100, 2, {}); /* click behind and down */
function normalizeStyeAttributeValues(aElement) {
for (const element of Array.from(
aElement.querySelectorAll("[style]")
)) {
element.setAttribute(
"style",
element
.getAttribute("style")
// Random spacing differences
.replace(/$/, ";")
.replace(/;;$/, ";")
// Gecko likes "transparent"
.replace(/transparent/g, "rgba(0, 0, 0, 0)")
// WebKit likes to look overly precise
.replace(/, 0.496094\)/g, ", 0.5)")
// Gecko converts anything with full alpha to "transparent" which
// then becomes "rgba(0, 0, 0, 0)", so we have to make other
// browsers match
.replace(/rgba\([0-9]+, [0-9]+, [0-9]+, 0\)/g, "rgba(0, 0, 0, 0)")
);
}
}
let todoCount = 0;
/** First round: Forward delete. **/
synthesizeKey("KEY_Delete");
normalizeStyeAttributeValues(theDiv);
if (tests[i].length == 2 || theDiv.innerHTML == tests[i][1]) {
is(theDiv.innerHTML, tests[i][1], "delete(collapsed): inner HTML for " + testName);
} else {
todoCount++;
todo_is(theDiv.innerHTML, tests[i][1], "delete(should be): inner HTML for " + testName);
is(theDiv.innerHTML, tests[i][2], "delete(currently is): inner HTML for " + testName);
}
/* Set up the selection. */
theEdit.innerHTML = "<div id=\"" + testName + "\">" + tests[i][0] + "</div>";
theDiv = document.getElementById(testName);
theDiv.focus();
sel.collapse(theDiv, 0);
synthesizeMouse(theDiv, 100, 2, {}); /* click behind and down */
/** Second round: Backspace. **/
synthesizeKey("KEY_ArrowRight");
synthesizeKey("KEY_Backspace");
normalizeStyeAttributeValues(theDiv);
if (tests[i].length == 2 || theDiv.innerHTML == tests[i][1]) {
is(theDiv.innerHTML, tests[i][1], "backspace: inner HTML for " + testName);
} else {
todoCount++;
todo_is(theDiv.innerHTML, tests[i][1], "backspace(should be): inner HTML for " + testName);
is(theDiv.innerHTML, tests[i][2], "backspace(currently is): inner HTML for " + testName);
}
/* Set up the selection. */
theEdit.innerHTML = "<div id=\"" + testName + "\">" + tests[i][0] + "</div>";
theDiv = document.getElementById(testName);
theDiv.focus();
sel.collapse(theDiv, 0);
synthesizeMouse(theDiv, 100, 2, {}); /* click behind and down */
/** Third round: Delete with non-collapsed selection. **/
if (i == 72) {
if (tests[i].length == 3) {
ok(!!todoCount, `All tests unexpectedly passed in ${testName}`);
}
// This test doesn't work, since we can't select only one newline using the right arrow key.
continue;
}
synthesizeKey("KEY_ArrowLeft");
/* Strangely enough we need to hit "right arrow" three times to select two characters. */
synthesizeKey("KEY_ArrowRight", {shiftKey: true});
synthesizeKey("KEY_ArrowRight", {shiftKey: true});
synthesizeKey("KEY_ArrowRight", {shiftKey: true});
synthesizeKey("KEY_Delete");
normalizeStyeAttributeValues(theDiv);
/* We always expect to the delete the "tf" in "testfoo". */
function makeNonCollapsedExpectation(aExpected) {
return aExpected
.replace("testfoo",
"tesoo")
.replace("test<b>foo",
"tes<b>oo")
.replace("test<b style=\"white-space: pre;\">foo",
"tes<b style=\"white-space: pre;\">oo")
.replace("test<span style=\"white-space: pre;\">foo",
"tes<span style=\"white-space: pre;\">oo")
.replace("test<span style=\"white-space: pre;\"><b>foo",
"tes<span style=\"white-space: pre;\"><b>oo")
.replace("test<span style=\"white-space: pre;\"><div>foo",
"tes<span style=\"white-space: pre;\"><div>oo")
.replace("test<span class=\"pre\" style=\"white-space: pre;\">foo",
"tes<span class=\"pre\" style=\"white-space: pre;\">oo")
.replace("test<span class=\"pre\" style=\"white-space: pre;\"><b>foo",
"tes<span class=\"pre\" style=\"white-space: pre;\"><b>oo")
.replace("test<span class=\"pre\" style=\"white-space: pre;\"><div>foo",
"tes<span class=\"pre\" style=\"white-space: pre;\"><div>oo");
}
const expected = makeNonCollapsedExpectation(tests[i][1]);
if (tests[i].length == 2 || theDiv.innerHTML == expected) {
is(theDiv.innerHTML, expected, "delete(non-collapsed): inner HTML for " + testName);
} else {
todoCount++;
todo_is(theDiv.innerHTML, expected, "delete(non-collapsed, should be): inner HTML for " + testName);
is(
theDiv.innerHTML,
makeNonCollapsedExpectation(tests[i][2]),
"delete(non-collapsed, currently is): inner HTML for " + testName
);
}
if (tests[i].length == 3) {
ok(!!todoCount, `All tests unexpectedly passed in ${testName}`);
}
}
SimpleTest.finish();
});
</script>
</pre>
</body>
</html>