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