test_bug424359-2.html (13464B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 --> 5 <head> 6 <title>Test HTML serializer with entities</title> 7 <script src="/tests/SimpleTest/SimpleTest.js"></script> 8 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" /> 9 </head> 10 <body> 11 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=424359">Mozilla Bug </a> 12 <p id="display"></p> 13 <div id="content" style="display: none"> 14 <iframe id="testframe" src="file_htmlserializer_2.html"> 15 </iframe> 16 </div> 17 <pre id="test"> 18 <script class="testbody" type="text/javascript"> 19 20 21 function loadFileContent(aFile, aCharset) { 22 //if(aAsIso == undefined) aAsIso = false; 23 if(aCharset == undefined) 24 aCharset = 'UTF-8'; 25 26 var baseUri = SpecialPowers.Cc['@mozilla.org/network/standard-url-mutator;1'] 27 .createInstance(SpecialPowers.Ci.nsIURIMutator) 28 .setSpec(window.location.href) 29 .finalize(); 30 31 var ios = SpecialPowers.Services.io; 32 var chann = ios.newChannel(aFile, 33 aCharset, 34 baseUri, 35 null, // aLoadingNode 36 SpecialPowers.Services.scriptSecurityManager.getSystemPrincipal(), 37 null, // aTriggeringPrincipal 38 SpecialPowers.Ci.nsILoadInfo.SEC_ALLOW_CROSS_ORIGIN_SEC_CONTEXT_IS_NULL, 39 SpecialPowers.Ci.nsIContentPolicy.TYPE_OTHER); 40 41 var cis = SpecialPowers.Ci.nsIConverterInputStream; 42 43 var inputStream = SpecialPowers.Cc["@mozilla.org/intl/converter-input-stream;1"] 44 .createInstance(cis); 45 inputStream.init(chann.open(), aCharset, 1024, cis.DEFAULT_REPLACEMENT_CHARACTER); 46 var str = {}, content = ''; 47 while (inputStream.readString(4096, str) != 0) { 48 content += str.value; 49 } 50 return content; 51 } 52 53 function isRoughly(actual, expected, message) { 54 return is(actual.replace("<!DOCTYPE HTML", "<!DOCTYPE html"), 55 expected, 56 message); 57 } 58 59 function testHtmlSerializer_1 () { 60 const de = SpecialPowers.Ci.nsIDocumentEncoder; 61 var encoder = SpecialPowers.Cu.createDocumentEncoder("text/html"); 62 63 var doc = $("testframe").contentDocument; 64 var out, expected; 65 66 // in the following test, we must use the OutputLFLineBreak flag, to avoid 67 // to have the default line break of the platform in the result, so the test 68 // can pass on all platform 69 70 //------------ OutputEncodeBasicEntities 71 encoder.init(doc, "text/html", de.OutputLFLineBreak | de.OutputEncodeBasicEntities); 72 out = encoder.encodeToString(); 73 expected = loadFileContent("file_htmlserializer_2_basic.html"); 74 isRoughly(out, expected, "test OutputEncodeBasicEntities"); 75 76 // tests on the serialization of selections 77 78 var node = document.getElementById('draggable'); 79 80 var select = window.getSelection(); 81 select.selectAllChildren(node); 82 83 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 84 encoder.setSelection(select); 85 out = encoder.encodeToString(); 86 expected = 'This is a <em>draggable</em> bit of text.'; 87 is(out, expected, "test selection"); 88 89 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 90 encoder.setSelection(null); 91 encoder.setContainerNode(node); 92 out = encoder.encodeToString(); 93 expected = 'This is a <em>draggable</em> bit of text.'; 94 is(out, expected, "test container node"); 95 96 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 97 encoder.setNode(node); 98 out = encoder.encodeToString(); 99 expected = "<div id=\"draggable\" ondragstart=\"doDragStartSelection(event)\">This is a <em>draggable</em> bit of text.</div>"; 100 is(out, expected, "test node"); 101 102 node = document.getElementById('aList'); 103 104 select = window.getSelection(); 105 select.selectAllChildren(node); 106 107 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 108 encoder.setSelection(select); 109 out = encoder.encodeToString(); 110 expected = '\n <li>Lorem ipsum dolor</li>\n <li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n'; 111 is(out, expected, "test list selection"); 112 113 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 114 encoder.setSelection(null); 115 encoder.setContainerNode(node); 116 out = encoder.encodeToString(); 117 expected = '\n <li>Lorem ipsum dolor</li>\n <li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n'; 118 is(out, expected, "test list container node"); 119 120 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 121 encoder.setNode(node); 122 out = encoder.encodeToString(); 123 expected = "<ol id=\"aList\">\n <li>Lorem ipsum dolor</li>\n <li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n</ol>"; 124 is(out, expected, "test list node"); 125 126 var liList = node.getElementsByTagName("li"); 127 var range = document.createRange(); 128 129 // selection start at the first child of the ol, and end after the element ol 130 range.setStart(node, 1); 131 range.setEnd(node.parentNode, 2); 132 select.removeAllRanges(); 133 select.addRange(range); 134 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 135 encoder.setSelection(select); 136 out = encoder.encodeToString(); 137 expected = '<ol id="aList"><li>Lorem ipsum dolor</li>\n <li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n</ol>'; 138 is(out, expected, "test list selection with range: selection start at the first child of the ol, and end after the element ol"); 139 140 // selection start at the third child of the ol, and end after the element ol 141 range.setStart(node, 3); 142 range.setEnd(node.parentNode, 2); 143 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 144 encoder.setSelection(select); 145 out = encoder.encodeToString(); 146 expected = '<ol id="aList"><li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n</ol>'; 147 is(out, expected, "test list selection with range: selection start at the third child of the ol, and end after the element ol"); 148 149 150 // selection start at the third child of the ol, and end after the element ol + ol start at the value 5 151 range.setStart(node, 3); 152 range.setEnd(node.parentNode, 2); 153 node.setAttribute("start","5"); 154 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 155 encoder.setSelection(select); 156 out = encoder.encodeToString(); 157 expected = '<ol id="aList" start="5"><li>sit amet, <strong>consectetuer</strong> </li>\n <li>adipiscing elit</li>\n <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li>\n <li>aptent taciti</li>\n</ol>'; 158 is(out, expected, "test list selection with range: selection start at the third child of the ol, and end after the element ol + ol start at the value 5"); 159 160 161 // selection contains only some child of the ol 162 node.removeAttribute("start"); 163 range.setStart(node, 3); 164 range.setEnd(node, 5); 165 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 166 encoder.setSelection(select); 167 out = encoder.encodeToString(); 168 expected = '<li>sit amet, <strong>consectetuer</strong> </li>\n '; 169 is(out, expected, "test list selection with range: selection contains only some child of the ol"); 170 171 // selection contains only some child of the ol + ol start at the value 5 172 node.setAttribute("start","5"); 173 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 174 encoder.setSelection(select); 175 out = encoder.encodeToString(); 176 expected = '<li>sit amet, <strong>consectetuer</strong> </li>\n '; 177 is(out, expected, "test list selection with range: selection contains only some child of the ol + ol start at the value 5"); 178 179 // selection contains only some child of the ol + a value is set on the first li 180 node.removeAttribute("start"); 181 liList[0].setAttribute("value","8"); 182 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly); 183 encoder.setSelection(select); 184 out = encoder.encodeToString(); 185 expected = '<li>sit amet, <strong>consectetuer</strong> </li>\n '; 186 is(out, expected, "test list selection with range: selection contains only some child of the ol + ol start at the value 5"); 187 188 189 190 // test on short attributes 191 node = document.getElementById('shortattr1'); 192 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 193 encoder.setNode(node); 194 out = encoder.encodeToString(); 195 expected = '<input id="shortattr1" checked="checked" value="" disabled="disabled" ismap="ismap" readonly="readonly" foo="">'; 196 is(out, expected, "test short attr #1"); 197 198 node = document.getElementById('shortattr2'); 199 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 200 encoder.setNode(node); 201 out = encoder.encodeToString(); 202 expected = '<ol id="shortattr2" compact="compact"><li></li></ol>'; 203 is(out, expected, "test short attr #2"); 204 205 node = document.getElementById('shortattr3'); 206 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 207 encoder.setNode(node); 208 out = encoder.encodeToString(); 209 expected = '<object id="shortattr3" declare="declare"></object>'; 210 is(out, expected, "test short attr #3"); 211 212 node = document.getElementById('shortattr4'); 213 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 214 encoder.setNode(node); 215 out = encoder.encodeToString(); 216 expected = '<script id="shortattr4" defer="defer"><\/script>'; 217 is(out, expected, "test short attr #4"); 218 219 node = document.getElementById('shortattr5'); 220 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 221 encoder.setNode(node); 222 out = encoder.encodeToString(); 223 expected = '<select id="shortattr5" multiple="multiple"><option selected="selected">aaa</option></select>'; 224 is(out, expected, "test short attr #5"); 225 226 node = document.getElementById('shortattr6'); 227 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 228 encoder.setNode(node); 229 out = encoder.encodeToString(); 230 expected = '<hr noshade="noshade" id="shortattr6">'; 231 is(out, expected, "test short attr #6"); 232 233 node = document.getElementById('shortattr7'); 234 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 235 encoder.setNode(node); 236 out = encoder.encodeToString(); 237 expected = '<div id="shortattr7"><foo checked="" value="" disabled="" ismap="" readonly=""></foo></div>'; 238 is(out, expected, "test short attr #7"); 239 240 // test on _moz and -moz attr 241 node = document.getElementById('mozattr'); 242 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 243 encoder.setNode(node); 244 out = encoder.encodeToString(); 245 expected = '<div id="mozattr" __moz_b="b"> lorem ipsum</div>'; 246 is(out, expected, "test -moz/_moz attr"); 247 248 node.setAttribute('_moz_c','barc'); 249 node.setAttribute('_-moz_d','bard'); 250 node.setAttribute('__moz_e','bare'); 251 252 encoder.init(document, "text/html", de.OutputLFLineBreak | de.OutputSelectionOnly | de.OutputRaw); 253 encoder.setNode(node); 254 out = encoder.encodeToString(); 255 expected = '<div id="mozattr" __moz_b="b" _-moz_d="bard" __moz_e="bare"> lorem ipsum</div>'; 256 is(out, expected, "test -moz/_moz attr #2"); 257 258 SimpleTest.finish(); 259 } 260 261 262 SimpleTest.waitForExplicitFinish(); 263 264 addLoadEvent(testHtmlSerializer_1); 265 266 </script> 267 </pre> 268 <div style="display: none"> 269 270 <div id="draggable" ondragstart="doDragStartSelection(event)">This is a <em>draggable</em> bit of text.</div> 271 272 </div> 273 <div style="display: none"> 274 275 <ol id="aList"> 276 <li>Lorem ipsum dolor</li> 277 <li>sit amet, <strong>consectetuer</strong> </li> 278 <li>adipiscing elit</li> 279 <li>Nam eu sapien. Sed viverra lacus. Donec quis ipsum. Nunc cursus aliquet lectus. Nunc vitae eros. Class</li> 280 <li>aptent taciti</li> 281 </ol> 282 283 284 <!-- test for some short attr --> 285 <div id="shortattr"> 286 <input id="shortattr1" checked="" value="" disabled="" ismap="" readonly="" foo=""> 287 <ol id="shortattr2" compact=""><li></li></ol> 288 <object id="shortattr3" declare=""></object> 289 <script id="shortattr4" defer=""></script> 290 <select id="shortattr5" multiple=""><option selected="">aaa</option></select> 291 <hr noshade="" id="shortattr6"> 292 <div id="shortattr7"><foo checked="" value="" disabled="" ismap="" readonly=""></div> 293 <div id="mozattr" _moz_a="a" __moz_b="b"> lorem ipsum</div> 294 </div> 295 296 297 298 </div> 299 </body> 300 </html>