test_restore_form_elements.html (4729B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=737851 5 --> 6 <head> 7 <meta charset="utf-8"> 8 9 <title>Test for Bug 737851</title> 10 11 <script src="/tests/SimpleTest/SimpleTest.js"></script> 12 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 13 </head> 14 15 <body> 16 17 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=737851">Mozilla Bug 737851</a> 18 19 <p id="display"></p> 20 21 22 <div id="content"> 23 24 <iframe id="frame" width="800px" height="600px" srcdoc=' 25 <html> 26 <body style="display:none;"> 27 28 <h3>Checking persistence of inputs through js inserts and moves</h3> 29 <div id="test"> 30 <input id="a"/> 31 <input id="b"/> 32 <form id="form1"> 33 <input id="c"/> 34 <input id="d"/> 35 </form> 36 <form id="form2"> 37 <input id="radio1" type="radio" name="radio"/> 38 <input type="radio" name="radio"/> 39 <input type="radio" name="radio"/> 40 <input type="radio" name="radio"/> 41 </form> 42 <input id="e"/> 43 </div> 44 45 <h3>Bug 728798: checking persistence of inputs when forward-using @form</h3> 46 <div> 47 <input id="728798-a" form="728798-form" name="a"/> 48 <form id="728798-form"> 49 <input id="728798-b" form="728798-form" name="b"/> 50 <input id="728798-c" name="c"/> 51 </form> 52 <input id="728798-d" form="728798-form" name="d"/> 53 </div> 54 55 </body> 56 </html> 57 '></iframe> 58 59 </div> 60 61 62 <pre id="test"> 63 <script type="text/javascript"> 64 65 var frameElem = document.getElementById("frame"); 66 var frame = frameElem.contentWindow; 67 68 69 /* -- Main test run -- */ 70 71 SimpleTest.waitForExplicitFinish(); 72 73 addLoadEvent(function() { 74 shuffle(); 75 fill(); 76 frameElem.addEventListener("load", function() { 77 shuffle(); 78 checkAllFields(); 79 SimpleTest.finish(); 80 }); 81 frame.location.reload(); 82 }) 83 84 85 /* -- Input fields js changes and moves -- */ 86 87 function shuffle() { 88 var framedoc = frame.document; 89 90 // Insert a button (toplevel) 91 var btn = framedoc.createElement("button"); 92 var testdiv = framedoc.getElementById("test"); 93 testdiv.insertBefore(btn, framedoc.getElementById("b")); 94 95 // Insert a dynamically generated input (in a form) 96 var newInput = framedoc.createElement("input"); 97 newInput.setAttribute("id","c0"); 98 var form1 = framedoc.getElementById("form1"); 99 form1.insertBefore(newInput, form1.firstChild); 100 101 // Move an input around 102 var inputD = framedoc.getElementById("d"); 103 var form2 = framedoc.getElementById("form2"); 104 form2.insertBefore(inputD, form2.firstChild) 105 106 // Clone an existing input 107 var inputE2 = framedoc.getElementById("e").cloneNode(true); 108 inputE2.setAttribute("id","e2"); 109 testdiv.appendChild(inputE2); 110 } 111 112 113 /* -- Input fields fill & check -- */ 114 115 /* Values entered in the input fields (by id) */ 116 117 var fieldValues = { 118 'a':'simple input', 119 'b':'moved by inserting a button before (no form)', 120 'c0':'dynamically generated input', 121 'c':'moved by inserting an input before (in a form)', 122 'd':'moved from a form to another', 123 'e':'the original', 124 'e2':'the clone', 125 '728798-a':'before the form', 126 '728798-b':'from within the form', 127 '728798-c':'no form attribute in the form', 128 '728798-d':'after the form' 129 } 130 131 /* Fields for which the input is changed, and corresponding value 132 (clone and creation, same behaviour as webkit) */ 133 134 var changedFields = { 135 // dynamically generated input field not preserved 136 'c0':'', 137 // cloned input field is restored with the value of the original 138 'e2':fieldValues.e 139 } 140 141 /* Simulate user input by entering the values */ 142 143 function fill() { 144 for (id in fieldValues) { 145 frame.document.getElementById(id).value = fieldValues[id]; 146 } 147 // an input is inserted before the radios (that may move the selected one by 1) 148 frame.document.getElementById('radio1').checked = true; 149 } 150 151 /* Check that all the fields are as they have been entered */ 152 153 function checkAllFields() { 154 155 for (id in fieldValues) { 156 var fieldValue = frame.document.getElementById(id).value; 157 if (changedFields[id] === undefined) { 158 is(fieldValue, fieldValues[id], 159 "Field "+id+" should be restored after reload"); 160 } else { 161 is(fieldValue, changedFields[id], 162 "Field "+id+" normally gets a different value after reload"); 163 } 164 } 165 166 ok(frame.document.getElementById('radio1').checked, 167 "Radio button radio1 should be restored after reload") 168 169 } 170 171 </script> 172 </pre> 173 </body> 174 </html>