test_bug558788-2.html (5675B)
1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 https://bugzilla.mozilla.org/show_bug.cgi?id=558788 5 --> 6 <head> 7 <title>Test for Bug 558788</title> 8 <script src="/tests/SimpleTest/SimpleTest.js"></script> 9 <script src="/tests/SimpleTest/EventUtils.js"></script> 10 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 11 </head> 12 <body> 13 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=558788">Mozilla Bug 558788</a> 14 <p id="display"></p> 15 <div id="content"> 16 </div> 17 <pre id="test"> 18 <script type="application/javascript"> 19 20 /** Test for Bug 558788 */ 21 22 var validElementsDescription = [ 23 /* element type value required pattern maxlength minlength */ 24 /* <input> */ 25 [ "input", null, null, null, null, null, null ], 26 /* <input required value='foo'> */ 27 [ "input", null, "foo", true, null, null, null ], 28 /* <input type='email'> */ 29 [ "input", "email", null, null, null, null, null ], 30 /* <input type='email' value='foo@mozilla.org'> */ 31 [ "input", "email", "foo@mozilla.org", null, null, null, null ], 32 /* <input type='url'> */ 33 [ "input", "url", null, null, null, null, null ], 34 /* <input type='url' value='http://mozilla.org'> */ 35 [ "input", "url", "http://mozilla.org", null, null, null, null ], 36 /* <input pattern='\\d\\d'> */ 37 [ "input", null, null, null, "\\d\\d", null, null ], 38 /* <input pattern='\\d\\d' value='42'> */ 39 [ "input", null, "42", null, "\\d\\d", null, null ], 40 /* <input maxlength='3'> - still valid until user interaction */ 41 [ "input", null, null, null, null, "3", null ], 42 /* <input maxlength='3'> */ 43 [ "input", null, "fooo", null, null, "3", null ], 44 /* <input minlength='3'> - still valid until user interaction */ 45 [ "input", null, null, null, null, null, "3" ], 46 /* <input minlength='3'> */ 47 [ "input", null, "fo", null, null, null, "3" ], 48 /* <textarea></textarea> */ 49 [ "textarea", null, null, null, null, null, null ], 50 /* <textarea required>foo</textarea> */ 51 [ "textarea", null, "foo", true, null, null, null ] 52 ]; 53 54 var invalidElementsDescription = [ 55 /* element type value required pattern maxlength minlength valid-value */ 56 /* <input required> */ 57 [ "input", null, null, true, null, null, null, "foo" ], 58 /* <input type='email' value='foo'> */ 59 [ "input", "email", "foo", null, null, null, null, "foo@mozilla.org" ], 60 /* <input type='url' value='foo'> */ 61 [ "input", "url", "foo", null, null, null, null, "http://mozilla.org" ], 62 /* <input pattern='\\d\\d' value='foo'> */ 63 [ "input", null, "foo", null, "\\d\\d", null, null, "42" ], 64 /* <input maxlength='3'> - still valid until user interaction */ 65 [ "input", null, "foooo", null, null, "3", null, "foo" ], 66 /* <input minlength='3'> - still valid until user interaction */ 67 [ "input", null, "foo", null, null, null, "3", "foo" ], 68 /* <textarea required></textarea> */ 69 [ "textarea", null, null, true, null, null, null, "foo" ], 70 ]; 71 72 var validElements = []; 73 var invalidElements = []; 74 75 function appendElements(aElementsDesc, aElements) 76 { 77 var content = document.getElementById('content'); 78 var length = aElementsDesc.length; 79 80 for (var i=0; i<length; ++i) { 81 var e = document.createElement(aElementsDesc[i][0]); 82 if (aElementsDesc[i][1]) { 83 e.type = aElementsDesc[i][1]; 84 } 85 if (aElementsDesc[i][2]) { 86 e.value = aElementsDesc[i][2]; 87 } 88 if (aElementsDesc[i][3]) { 89 e.required = true; 90 } 91 if (aElementsDesc[i][4]) { 92 e.pattern = aElementsDesc[i][4]; 93 } 94 if (aElementsDesc[i][5]) { 95 e.maxLength = aElementsDesc[i][5]; 96 } 97 if (aElementsDesc[i][6]) { 98 e.minLength = aElementsDesc[i][6]; 99 } 100 101 content.appendChild(e); 102 103 // Adding the element to the appropriate list. 104 aElements.push(e); 105 } 106 } 107 108 function compareArrayWithSelector(aElements, aSelector) 109 { 110 var aSelectorElements = document.querySelectorAll(aSelector); 111 112 is(aSelectorElements.length, aElements.length, 113 aSelector + " selector should return the correct number of elements"); 114 115 if (aSelectorElements.length != aElements.length) { 116 return; 117 } 118 119 var length = aElements.length; 120 for (var i=0; i<length; ++i) { 121 is(aSelectorElements[i], aElements[i], 122 aSelector + " should return the correct elements"); 123 } 124 } 125 126 function makeMinMaxLengthElementsActuallyInvalid(aInvalidElements, 127 aInvalidElementsDesc) 128 { 129 // min/maxlength elements are not invalid until user edits them 130 var length = aInvalidElementsDesc.length; 131 132 for (var i=0; i<length; ++i) { 133 var e = aInvalidElements[i]; 134 if (aInvalidElementsDesc[i][5]) { // maxlength 135 e.focus(); 136 synthesizeKey("KEY_Backspace"); 137 } else if (aInvalidElementsDesc[i][6]) { // minlength 138 e.focus(); 139 synthesizeKey("KEY_Backspace"); 140 } 141 } 142 } 143 144 function makeInvalidElementsValid(aInvalidElements, 145 aInvalidElementsDesc, 146 aValidElements) 147 { 148 var length = aInvalidElementsDesc.length; 149 150 for (var i=0; i<length; ++i) { 151 var e = aInvalidElements.shift(); 152 e.value = aInvalidElementsDesc[i][7]; 153 aValidElements.push(e); 154 } 155 } 156 157 appendElements(validElementsDescription, validElements); 158 appendElements(invalidElementsDescription, invalidElements); 159 160 makeMinMaxLengthElementsActuallyInvalid(invalidElements, invalidElementsDescription); 161 162 compareArrayWithSelector(validElements, ":valid"); 163 compareArrayWithSelector(invalidElements, ":invalid"); 164 165 makeInvalidElementsValid(invalidElements, invalidElementsDescription, 166 validElements); 167 168 compareArrayWithSelector(validElements, ":valid"); 169 compareArrayWithSelector(invalidElements, ":invalid"); 170 171 </script> 172 </pre> 173 </body> 174 </html>