test_bug558788-2.html 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  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 type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  9. <script type="application/javascript" 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. /** Test for Bug 558788 **/
  20. var validElementsDescription = [
  21. /* element type value required pattern maxlength minlength */
  22. /* <input> */
  23. [ "input", null, null, null, null, null, null ],
  24. /* <input required value='foo'> */
  25. [ "input", null, "foo", true, null, null, null ],
  26. /* <input type='email'> */
  27. [ "input", "email", null, null, null, null, null ],
  28. /* <input type='email' value='foo@mozilla.org'> */
  29. [ "input", "email", "foo@mozilla.org", null, null, null, null ],
  30. /* <input type='url'> */
  31. [ "input", "url", null, null, null, null, null ],
  32. /* <input type='url' value='http://mozilla.org'> */
  33. [ "input", "url", "http://mozilla.org", null, null, null, null ],
  34. /* <input pattern='\\d\\d'> */
  35. [ "input", null, null, null, "\\d\\d", null, null ],
  36. /* <input pattern='\\d\\d' value='42'> */
  37. [ "input", null, "42", null, "\\d\\d", null, null ],
  38. /* <input maxlength='3'> - still valid until user interaction */
  39. [ "input", null, null, null, null, "3", null ],
  40. /* <input maxlength='3'> */
  41. [ "input", null, "fooo", null, null, "3", null ],
  42. /* <input minlength='3'> - still valid until user interaction */
  43. [ "input", null, null, null, null, null, "3" ],
  44. /* <input minlength='3'> */
  45. [ "input", null, "fo", null, null, null, "3" ],
  46. /* <textarea></textarea> */
  47. [ "textarea", null, null, null, null, null, null ],
  48. /* <textarea required>foo</textarea> */
  49. [ "textarea", null, "foo", true, null, null, null ]
  50. ];
  51. var invalidElementsDescription = [
  52. /* element type value required pattern maxlength minlength valid-value */
  53. /* <input required> */
  54. [ "input", null, null, true, null, null, null, "foo" ],
  55. /* <input type='email' value='foo'> */
  56. [ "input", "email", "foo", null, null, null, null, "foo@mozilla.org" ],
  57. /* <input type='url' value='foo'> */
  58. [ "input", "url", "foo", null, null, null, null, "http://mozilla.org" ],
  59. /* <input pattern='\\d\\d' value='foo'> */
  60. [ "input", null, "foo", null, "\\d\\d", null, null, "42" ],
  61. /* <input maxlength='3'> - still valid until user interaction */
  62. [ "input", null, "foooo", null, null, "3", null, "foo" ],
  63. /* <input minlength='3'> - still valid until user interaction */
  64. [ "input", null, "foo", null, null, null, "3", "foo" ],
  65. /* <textarea required></textarea> */
  66. [ "textarea", null, null, true, null, null, null, "foo" ],
  67. ];
  68. var validElements = [];
  69. var invalidElements = [];
  70. function appendElements(aElementsDesc, aElements)
  71. {
  72. var content = document.getElementById('content');
  73. var length = aElementsDesc.length;
  74. for (var i=0; i<length; ++i) {
  75. var e = document.createElement(aElementsDesc[i][0]);
  76. if (aElementsDesc[i][1]) {
  77. e.type = aElementsDesc[i][1];
  78. }
  79. if (aElementsDesc[i][2]) {
  80. e.value = aElementsDesc[i][2];
  81. }
  82. if (aElementsDesc[i][3]) {
  83. e.required = true;
  84. }
  85. if (aElementsDesc[i][4]) {
  86. e.pattern = aElementsDesc[i][4];
  87. }
  88. if (aElementsDesc[i][5]) {
  89. e.maxLength = aElementsDesc[i][5];
  90. }
  91. if (aElementsDesc[i][6]) {
  92. e.minLength = aElementsDesc[i][6];
  93. }
  94. content.appendChild(e);
  95. // Adding the element to the appropriate list.
  96. aElements.push(e);
  97. }
  98. }
  99. function compareArrayWithSelector(aElements, aSelector)
  100. {
  101. var aSelectorElements = document.querySelectorAll(aSelector);
  102. is(aSelectorElements.length, aElements.length,
  103. aSelector + " selector should return the correct number of elements");
  104. if (aSelectorElements.length != aElements.length) {
  105. return;
  106. }
  107. var length = aElements.length;
  108. for (var i=0; i<length; ++i) {
  109. is(aSelectorElements[i], aElements[i],
  110. aSelector + " should return the correct elements");
  111. }
  112. }
  113. function makeMinMaxLengthElementsActuallyInvalid(aInvalidElements,
  114. aInvalidElementsDesc)
  115. {
  116. // min/maxlength elements are not invalid until user edits them
  117. var length = aInvalidElementsDesc.length;
  118. for (var i=0; i<length; ++i) {
  119. var e = aInvalidElements[i];
  120. if (aInvalidElementsDesc[i][5]) { // maxlength
  121. e.focus();
  122. synthesizeKey("VK_BACK_SPACE", {});
  123. } else if (aInvalidElementsDesc[i][6]) { // minlength
  124. e.focus();
  125. synthesizeKey("VK_BACK_SPACE", {});
  126. }
  127. }
  128. }
  129. function makeInvalidElementsValid(aInvalidElements,
  130. aInvalidElementsDesc,
  131. aValidElements)
  132. {
  133. var length = aInvalidElementsDesc.length;
  134. for (var i=0; i<length; ++i) {
  135. var e = aInvalidElements.shift();
  136. e.value = aInvalidElementsDesc[i][7];
  137. aValidElements.push(e);
  138. }
  139. }
  140. appendElements(validElementsDescription, validElements);
  141. appendElements(invalidElementsDescription, invalidElements);
  142. makeMinMaxLengthElementsActuallyInvalid(invalidElements, invalidElementsDescription);
  143. compareArrayWithSelector(validElements, ":valid");
  144. compareArrayWithSelector(invalidElements, ":invalid");
  145. makeInvalidElementsValid(invalidElements, invalidElementsDescription,
  146. validElements);
  147. compareArrayWithSelector(validElements, ":valid");
  148. compareArrayWithSelector(invalidElements, ":invalid");
  149. </script>
  150. </pre>
  151. </body>
  152. </html>