ChildNode-after.html (6353B)
1 <!DOCTYPE html> 2 <meta charset=utf-8> 3 <title>ChildNode.after</title> 4 <link rel=help href="https://dom.spec.whatwg.org/#dom-childnode-after"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script> 8 9 function test_after(child, nodeName, innerHTML) { 10 11 test(function() { 12 var parent = document.createElement('div'); 13 parent.appendChild(child); 14 child.after(); 15 assert_equals(parent.innerHTML, innerHTML); 16 }, nodeName + '.after() without any argument.'); 17 18 test(function() { 19 var parent = document.createElement('div'); 20 parent.appendChild(child); 21 child.after(null); 22 var expected = innerHTML + 'null'; 23 assert_equals(parent.innerHTML, expected); 24 }, nodeName + '.after() with null as an argument.'); 25 26 test(function() { 27 var parent = document.createElement('div'); 28 parent.appendChild(child); 29 child.after(undefined); 30 var expected = innerHTML + 'undefined'; 31 assert_equals(parent.innerHTML, expected); 32 }, nodeName + '.after() with undefined as an argument.'); 33 34 test(function() { 35 var parent = document.createElement('div'); 36 parent.appendChild(child); 37 child.after(''); 38 assert_equals(parent.lastChild.data, ''); 39 }, nodeName + '.after() with the empty string as an argument.'); 40 41 test(function() { 42 var parent = document.createElement('div'); 43 parent.appendChild(child); 44 child.after('text'); 45 var expected = innerHTML + 'text'; 46 assert_equals(parent.innerHTML, expected); 47 }, nodeName + '.after() with only text as an argument.'); 48 49 test(function() { 50 var parent = document.createElement('div'); 51 var x = document.createElement('x'); 52 parent.appendChild(child); 53 child.after(x); 54 var expected = innerHTML + '<x></x>'; 55 assert_equals(parent.innerHTML, expected); 56 }, nodeName + '.after() with only one element as an argument.'); 57 58 test(function() { 59 var parent = document.createElement('div'); 60 var x = document.createElement('x'); 61 parent.appendChild(child); 62 child.after(x, 'text'); 63 var expected = innerHTML + '<x></x>text'; 64 assert_equals(parent.innerHTML, expected); 65 }, nodeName + '.after() with one element and text as arguments.'); 66 67 test(function() { 68 var parent = document.createElement('div'); 69 parent.appendChild(child); 70 child.after('text', child); 71 var expected = 'text' + innerHTML; 72 assert_equals(parent.innerHTML, expected); 73 }, nodeName + '.after() with context object itself as the argument.'); 74 75 test(function() { 76 var parent = document.createElement('div') 77 var x = document.createElement('x'); 78 parent.appendChild(x); 79 parent.appendChild(child); 80 child.after(child, x); 81 var expected = innerHTML + '<x></x>'; 82 assert_equals(parent.innerHTML, expected); 83 }, nodeName + '.after() with context object itself and node as the arguments, switching positions.'); 84 85 test(function() { 86 var parent = document.createElement('div'); 87 var x = document.createElement('x'); 88 var y = document.createElement('y'); 89 var z = document.createElement('z'); 90 parent.appendChild(y); 91 parent.appendChild(child); 92 parent.appendChild(x); 93 child.after(x, y, z); 94 var expected = innerHTML + '<x></x><y></y><z></z>'; 95 assert_equals(parent.innerHTML, expected); 96 }, nodeName + '.after() with all siblings of child as arguments.'); 97 98 test(function() { 99 var parent = document.createElement('div') 100 var x = document.createElement('x'); 101 var y = document.createElement('y'); 102 var z = document.createElement('z'); 103 parent.appendChild(child); 104 parent.appendChild(x); 105 parent.appendChild(y); 106 parent.appendChild(z); 107 child.after(x, y); 108 var expected = innerHTML + '<x></x><y></y><z></z>'; 109 assert_equals(parent.innerHTML, expected); 110 }, nodeName + '.before() with some siblings of child as arguments; no changes in tree; viable sibling is first child.'); 111 112 test(function() { 113 var parent = document.createElement('div') 114 var v = document.createElement('v'); 115 var x = document.createElement('x'); 116 var y = document.createElement('y'); 117 var z = document.createElement('z'); 118 parent.appendChild(child); 119 parent.appendChild(v); 120 parent.appendChild(x); 121 parent.appendChild(y); 122 parent.appendChild(z); 123 child.after(v, x); 124 var expected = innerHTML + '<v></v><x></x><y></y><z></z>'; 125 assert_equals(parent.innerHTML, expected); 126 }, nodeName + '.after() with some siblings of child as arguments; no changes in tree.'); 127 128 test(function() { 129 var parent = document.createElement('div'); 130 var x = document.createElement('x'); 131 var y = document.createElement('y'); 132 parent.appendChild(child); 133 parent.appendChild(x); 134 parent.appendChild(y); 135 child.after(y, x); 136 var expected = innerHTML + '<y></y><x></x>'; 137 assert_equals(parent.innerHTML, expected); 138 }, nodeName + '.after() when pre-insert behaves like append.'); 139 140 test(function() { 141 var parent = document.createElement('div'); 142 var x = document.createElement('x'); 143 var y = document.createElement('y'); 144 parent.appendChild(child); 145 parent.appendChild(x); 146 parent.appendChild(document.createTextNode('1')); 147 parent.appendChild(y); 148 child.after(x, '2'); 149 var expected = innerHTML + '<x></x>21<y></y>'; 150 assert_equals(parent.innerHTML, expected); 151 }, nodeName + '.after() with one sibling of child and text as arguments.'); 152 153 test(function() { 154 var x = document.createElement('x'); 155 var y = document.createElement('y'); 156 x.after(y); 157 assert_equals(x.nextSibling, null); 158 }, nodeName + '.after() on a child without any parent.'); 159 } 160 161 test_after(document.createComment('test'), 'Comment', '<!--test-->'); 162 test_after(document.createElement('test'), 'Element', '<test></test>'); 163 test_after(document.createTextNode('test'), 'Text', 'test'); 164 165 </script> 166 </html>