common-HTMLOptionsCollection-add.html (2626B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title id='title'>HTMLOptionsCollection</title> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 </head> 9 <body> 10 <div id="log"></div> 11 <select id="selly"> 12 <option id="id1" name="name1">1</option> 13 <option id="id2" name="name2">2</option> 14 <option id="id3" name="name3">3</option> 15 <option id="id4" name="name4">4</option> 16 <optgroup id="og1"> 17 <option name="nameonly">n1</option> 18 <option id="id5">5</option> 19 </optgroup> 20 <optgroup id="og2"> 21 <option name="nameonly">n2</option> 22 <option id="id6">6</option> 23 </optgroup> 24 25 </select> 26 27 <script> 28 var selly; 29 setup(function() { 30 selly = document.getElementById('selly'); 31 }); 32 33 test(function () { 34 var option = document.getElementById('id1'); 35 var optgroup = document.getElementById('og1'); 36 selly.options.add(option, option); 37 selly.options.add(optgroup, optgroup); 38 assert_equals(selly.children.length, 6); 39 assert_equals(selly.length, 8); 40 }, "if before and node are the same element nothing should be done"); 41 42 test(function () { 43 var o1 = document.createElement("option"); 44 o1.value = "a"; 45 var o2 = document.createElement("option"); 46 o2.value = "b"; 47 var o3 = document.createElement("option"); 48 o3.value = "c"; 49 var optgroup = document.getElementById('og1'); 50 selly.options.add(o1, null); 51 selly.options.add(o2, optgroup); 52 selly.options.add(o3, 0); 53 54 var elarray = []; 55 for (var i = 0; i < selly.length; i++) { 56 elarray.push(selly[i].value); 57 } 58 assert_array_equals(elarray, ["c", "1", "2", "3", "4", "b", "n1", "5", "n2", "6", "a"]); 59 }, "add method should add option elements correctly"); 60 61 test(function () { 62 var og1 = document.createElement("optgroup"); 63 var o1 = document.createElement("option"); 64 o1.value = "a"; 65 o1.appendChild(og1); 66 var og2 = document.createElement("optgroup"); 67 var o2 = document.createElement("option"); 68 o2.value = "b"; 69 o2.appendChild(og2); 70 var og3 = document.createElement("optgroup"); 71 var o3 = document.createElement("option"); 72 o3.value = "c"; 73 o3.appendChild(og3); 74 75 var optgroup = document.getElementById('og1'); 76 selly.options.add(og1, null); 77 selly.options.add(og2, optgroup); 78 selly.options.add(og3, 0); 79 80 var elarray = []; 81 for (var i = 0; i < selly.length; i++) { 82 elarray.push(selly[i].value); 83 } 84 assert_array_equals(elarray, ["c", "1", "2", "3", "4", "b", "n1", "5", "n2", "6", "a"]); 85 }, "add method should add option groups correctly"); 86 87 </script> 88 </body> 89 </html>