test_bug650493.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4. https://bugzilla.mozilla.org/show_bug.cgi?id=650493
  5. -->
  6. <head>
  7. <title>Test for Bug 650493</title>
  8. <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  9. <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
  10. </head>
  11. <body>
  12. <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=650493">Mozilla Bug 650493</a>
  13. <p id="display"></p>
  14. <div id="content" style="display: none">
  15. </div>
  16. <pre id="test">
  17. <script class="testbody" type="text/javascript">
  18. function getNodes() {
  19. var walker = document.createTreeWalker($('content'), NodeFilter.SHOW_ALL, null);
  20. var nodes = [];
  21. do {
  22. nodes.push(walker.currentNode);
  23. } while(walker.nextNode());
  24. return nodes;
  25. }
  26. function check() {
  27. var current = getNodes();
  28. is(nodes.length, current.length, "length after " + testName);
  29. nodes.forEach(function(val, index) {
  30. ok(current.indexOf(val) > -1, "nodes[" + index + "] (" + val + ") shouldn't exist after " + testName);
  31. });
  32. }
  33. var nodes = getNodes();
  34. var testName = "empty";
  35. var mutateCount = 0;
  36. check();
  37. // Set up listeners
  38. root = $('content');
  39. root.addEventListener("DOMNodeInserted", function(e) {
  40. mutateCount++;
  41. is(e.isTrusted, true, "untrusted mutation event");
  42. var w = document.createTreeWalker(e.target, NodeFilter.SHOW_ALL, null);
  43. do {
  44. is(nodes.indexOf(w.currentNode), -1, "already have inserted node (" + w.currentNode + ") when " + testName);
  45. nodes.push(w.currentNode);
  46. } while(w.nextNode());
  47. }, false);
  48. root.addEventListener("DOMNodeRemoved", function(e) {
  49. mutateCount++;
  50. is(e.isTrusted, true, "untrusted mutation event");
  51. var w = document.createTreeWalker(e.target, NodeFilter.SHOW_ALL, null);
  52. do {
  53. var index = nodes.indexOf(w.currentNode);
  54. ok(index != -1, "missing removed node (" + w.currentNode + ") when " + testName);
  55. nodes.splice(index, 1);
  56. } while(w.nextNode());
  57. }, false);
  58. testName = "text-only innerHTML";
  59. root.innerHTML = "hello world";
  60. check();
  61. testName = "innerHTML with <b>";
  62. root.innerHTML = "<b>bold</b> world";
  63. check();
  64. testName = "complex innerHTML";
  65. root.innerHTML = "<b>b<span>old</span></b> <strong>world";
  66. check();
  67. testName = "replacing using .textContent";
  68. root.textContent = "i'm just a plain text minding my own business";
  69. check();
  70. testName = "clearing using .textContent";
  71. root.textContent = "";
  72. check();
  73. testName = "inserting using .textContent";
  74. root.textContent = "i'm new text!!";
  75. check();
  76. testName = "inserting using .textContent";
  77. root.textContent = "i'm new text!!";
  78. check();
  79. testName = "preparing to normalize";
  80. root.innerHTML = "<u><b>foo</b></u> ";
  81. var u = root.firstChild;
  82. is(u.nodeName, "U", "got the right node");
  83. var b = u.firstChild;
  84. is(b.nodeName, "B", "got the right node");
  85. b.insertBefore(document.createTextNode(""), b.firstChild);
  86. b.insertBefore(document.createTextNode(""), b.firstChild);
  87. b.appendChild(document.createTextNode(""));
  88. b.appendChild(document.createTextNode("hello"));
  89. b.appendChild(document.createTextNode("world"));
  90. u.appendChild(document.createTextNode("foo"));
  91. u.appendChild(document.createTextNode(""));
  92. u.appendChild(document.createTextNode("bar"));
  93. check();
  94. testName = "normalizing";
  95. root.normalize();
  96. check();
  97. testName = "self replace firstChild";
  98. mutateCount = 0;
  99. root.replaceChild(root.firstChild, root.firstChild);
  100. check();
  101. is(mutateCount, 2, "should remove and reinsert " + testName);
  102. testName = "self replace second child";
  103. mutateCount = 0;
  104. root.replaceChild(root.firstChild.nextSibling, root.firstChild.nextSibling);
  105. check();
  106. is(mutateCount, 2, "should remove and reinsert " + testName);
  107. testName = "self replace lastChild";
  108. mutateCount = 0;
  109. root.replaceChild(root.lastChild, root.lastChild);
  110. check();
  111. is(mutateCount, 2, "should remove and reinsert " + testName);
  112. testName = "self insertBefore firstChild";
  113. mutateCount = 0;
  114. root.insertBefore(root.firstChild, root.firstChild);
  115. check();
  116. is(mutateCount, 2, "should remove and reinsert " + testName);
  117. testName = "self insertBefore second child";
  118. mutateCount = 0;
  119. root.insertBefore(root.firstChild.nextSibling, root.firstChild.nextSibling);
  120. check();
  121. is(mutateCount, 2, "should remove and reinsert " + testName);
  122. testName = "self insertBefore lastChild";
  123. mutateCount = 0;
  124. root.insertBefore(root.lastChild, root.lastChild);
  125. check();
  126. is(mutateCount, 2, "should remove and reinsert " + testName);
  127. testName = "appendChild last";
  128. mutateCount = 0;
  129. root.appendChild(root.lastChild);
  130. check();
  131. is(mutateCount, 2, "should remove and reinsert " + testName);
  132. testName = "prepare script/style";
  133. script = document.createElement("script");
  134. script.appendChild(document.createTextNode("void(0);"));
  135. root.appendChild(script);
  136. style = document.createElement("style");
  137. root.appendChild(style);
  138. check();
  139. testName = "set something in script";
  140. script.text = "something";
  141. check();
  142. testName = "set something in style";
  143. style.innerHTML = "something { dislay: none; }";
  144. check();
  145. testName = "moving style";
  146. root.insertBefore(style, root.firstChild);
  147. check();
  148. testName = "replacing script";
  149. root.replaceChild(b, script);
  150. check();
  151. testName = "doc-fragment insert in the middle";
  152. frag = document.createDocumentFragment();
  153. frag.addEventListener("DOMNodeRemoved", function(e) {
  154. var index = children.indexOf(e.target);
  155. ok(index != -1, "unknown child removed from fragment");
  156. children.splice(index, 1);
  157. }, false);
  158. var children = [];
  159. children.push(document.createTextNode("foo"));
  160. children.push(document.createTextNode("bar"));
  161. children.push(document.createElement("span"));
  162. children.push(document.createElement("b"));
  163. children[2].appendChild(document.createElement("i"));
  164. children.forEach(function(child) { frag.appendChild(child); });
  165. ok(root.firstChild, "need to have children in order to test inserting before end");
  166. root.replaceChild(frag, root.firstChild);
  167. check();
  168. is(children.length, 0, "should have received DOMNodeRemoved for all frag children when inserting");
  169. is(frag.childNodes.length, 0, "fragment should be empty when inserting");
  170. testName = "doc-fragment append at the end";
  171. children.push(document.createTextNode("foo"));
  172. children.push(document.createTextNode("bar"));
  173. children.push(document.createElement("span"));
  174. children.push(document.createElement("b"));
  175. children[2].appendChild(document.createElement("i"));
  176. children.forEach(function(child) { frag.appendChild(child); });
  177. root.appendChild(frag);
  178. check();
  179. is(children.length, 0, "should have received DOMNodeRemoved for all frag children when appending");
  180. is(frag.childNodes.length, 0, "fragment should be empty when appending");
  181. </script>
  182. </body>
  183. </html>