editor/libeditor/html/tests/test_bug674861.html

Thu, 22 Jan 2015 13:21:57 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 22 Jan 2015 13:21:57 +0100
branch
TOR_BUG_9701
changeset 15
b8a032363ba2
permissions
-rw-r--r--

Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6

michael@0 1 <!DOCTYPE HTML>
michael@0 2 <html>
michael@0 3 <!--
michael@0 4 https://bugzilla.mozilla.org/show_bug.cgi?id=674861
michael@0 5 -->
michael@0 6 <head>
michael@0 7 <title>Test for Bug 674861</title>
michael@0 8 <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
michael@0 9 <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script>
michael@0 10 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
michael@0 11 </head>
michael@0 12 <body>
michael@0 13 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=674861">Mozilla Bug 674861</a>
michael@0 14 <p id="display"></p>
michael@0 15 <div id="content">
michael@0 16 <section id="test1">
michael@0 17 <h2> Editable Bullet List </h2>
michael@0 18 <ul contenteditable>
michael@0 19 <li> item A </li>
michael@0 20 <li> item B </li>
michael@0 21 <li> item C </li>
michael@0 22 </ul>
michael@0 23
michael@0 24 <h2> Editable Ordered List </h2>
michael@0 25 <ol contenteditable>
michael@0 26 <li> item A </li>
michael@0 27 <li> item B </li>
michael@0 28 <li> item C </li>
michael@0 29 </ol>
michael@0 30
michael@0 31 <h2> Editable Definition List </h2>
michael@0 32 <dl contenteditable>
michael@0 33 <dt> term A </dt>
michael@0 34 <dd> definition A </dd>
michael@0 35 <dt> term B </dt>
michael@0 36 <dd> definition B </dd>
michael@0 37 <dt> term C </dt>
michael@0 38 <dd> definition C </dd>
michael@0 39 </dl>
michael@0 40 </section>
michael@0 41
michael@0 42 <section id="test2" contenteditable>
michael@0 43 <h2> Bullet List In Editable Section </h2>
michael@0 44 <ul>
michael@0 45 <li> item A </li>
michael@0 46 <li> item B </li>
michael@0 47 <li> item C </li>
michael@0 48 </ul>
michael@0 49
michael@0 50 <h2> Ordered List In Editable Section </h2>
michael@0 51 <ol>
michael@0 52 <li> item A </li>
michael@0 53 <li> item B </li>
michael@0 54 <li> item C </li>
michael@0 55 </ol>
michael@0 56
michael@0 57 <h2> Definition List In Editable Section </h2>
michael@0 58 <dl>
michael@0 59 <dt> term A </dt>
michael@0 60 <dd> definition A </dd>
michael@0 61 <dt> term B </dt>
michael@0 62 <dd> definition B </dd>
michael@0 63 <dt> term C </dt>
michael@0 64 <dd> definition C </dd>
michael@0 65 </dl>
michael@0 66 </section>
michael@0 67 </div>
michael@0 68
michael@0 69 <pre id="test">
michael@0 70 <script type="application/javascript">
michael@0 71
michael@0 72 /** Test for Bug 674861 **/
michael@0 73 SimpleTest.waitForExplicitFinish();
michael@0 74 SimpleTest.waitForFocus(runTests);
michael@0 75
michael@0 76 const CARET_BEGIN = 0;
michael@0 77 const CARET_MIDDLE = 1;
michael@0 78 const CARET_END = 2;
michael@0 79
michael@0 80 function try2split(element, caretPos) {
michael@0 81 // compute the requested position
michael@0 82 var len = element.textContent.length;
michael@0 83 var pos = -1;
michael@0 84 switch (caretPos) {
michael@0 85 case CARET_BEGIN:
michael@0 86 pos = 0;
michael@0 87 break;
michael@0 88 case CARET_MIDDLE:
michael@0 89 pos = Math.floor(len/2);
michael@0 90 break;
michael@0 91 case CARET_END:
michael@0 92 pos = len;
michael@0 93 break;
michael@0 94 }
michael@0 95
michael@0 96 // put the caret on the requested position
michael@0 97 var sel = window.getSelection();
michael@0 98 for (var i = 0; i < sel.rangeCount; i++) {
michael@0 99 var range = sel.getRangeAt(i);
michael@0 100 sel.removeRange(range);
michael@0 101 }
michael@0 102 range = document.createRange();
michael@0 103 range.setStart(element.firstChild, pos);
michael@0 104 range.setEnd(element.firstChild, pos);
michael@0 105 sel.addRange(range);
michael@0 106
michael@0 107 // simulates two [Return] keypresses
michael@0 108 synthesizeKey("VK_RETURN", {});
michael@0 109 synthesizeKey("VK_RETURN", {});
michael@0 110 }
michael@0 111
michael@0 112 function runTests() {
michael@0 113 const test1 = document.getElementById("test1");
michael@0 114 const test2 = document.getElementById("test2");
michael@0 115
michael@0 116 // -----------------------------------------------------------------------
michael@0 117 // #test1: editable lists should NOT be splittable
michael@0 118 // -----------------------------------------------------------------------
michael@0 119 const ul = test1.querySelector("ul");
michael@0 120 const ol = test1.querySelector("ol");
michael@0 121 const dl = test1.querySelector("dl");
michael@0 122
michael@0 123 // bullet list
michael@0 124 ul.focus();
michael@0 125 try2split(ul.querySelector("li"), CARET_END);
michael@0 126 is(test1.querySelectorAll("ul").length, 1,
michael@0 127 "The <ul contenteditable> list should not be splittable.");
michael@0 128 is(ul.querySelectorAll("li").length, 5,
michael@0 129 "Two new <li> elements should have been created.");
michael@0 130
michael@0 131 // ordered list
michael@0 132 ol.focus();
michael@0 133 try2split(ol.querySelector("li"), CARET_END);
michael@0 134 is(test1.querySelectorAll("ol").length, 1,
michael@0 135 "The <ol contenteditable> list should not be splittable.");
michael@0 136 is(ol.querySelectorAll("li").length, 5,
michael@0 137 "Two new <li> elements should have been created.");
michael@0 138
michael@0 139 // definition list
michael@0 140 dl.focus();
michael@0 141 try2split(dl.querySelector("dd"), CARET_END);
michael@0 142 is(test1.querySelectorAll("dl").length, 1,
michael@0 143 "The <dl contenteditable> list should not be splittable.");
michael@0 144 is(dl.querySelectorAll("dt").length, 5,
michael@0 145 "Two new <dt> elements should have been created.");
michael@0 146
michael@0 147 // -----------------------------------------------------------------------
michael@0 148 // #test2: lists in editable blocks should be splittable
michael@0 149 // -----------------------------------------------------------------------
michael@0 150 test2.focus();
michael@0 151
michael@0 152 // bullet list
michael@0 153 try2split(test2.querySelector("ul li"), CARET_END);
michael@0 154 is(test2.querySelectorAll("ul").length, 2,
michael@0 155 "The <ul> list should have been splitted.");
michael@0 156 is(test2.querySelectorAll("ul li").length, 3,
michael@0 157 "No new <li> element should have been created.");
michael@0 158 is(test2.querySelectorAll("ul+p").length, 1,
michael@0 159 "A new paragraph should have been created.");
michael@0 160
michael@0 161 // ordered list
michael@0 162 try2split(test2.querySelector("ol li"), CARET_END);
michael@0 163 is(test2.querySelectorAll("ol").length, 2,
michael@0 164 "The <ol> list should have been splitted.");
michael@0 165 is(test2.querySelectorAll("ol li").length, 3,
michael@0 166 "No new <li> element should have been created.");
michael@0 167 is(test2.querySelectorAll("ol+p").length, 1,
michael@0 168 "A new paragraph should have been created.");
michael@0 169
michael@0 170 // definition list
michael@0 171 try2split(test2.querySelector("dl dd"), CARET_END);
michael@0 172 is(test2.querySelectorAll("dl").length, 2,
michael@0 173 "The <dl> list should have been splitted.");
michael@0 174 is(test2.querySelectorAll("dt").length, 3,
michael@0 175 "No new <dt> element should have been created.");
michael@0 176 is(test2.querySelectorAll("dl+p").length, 1,
michael@0 177 "A new paragraph should have been created.");
michael@0 178
michael@0 179 // done
michael@0 180 SimpleTest.finish();
michael@0 181 }
michael@0 182 </script>
michael@0 183 </pre>
michael@0 184 </body>
michael@0 185 </html>

mercurial