1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/accessible/tests/mochitest/states/test_inputs.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,265 @@
1.4 +<!DOCTYPE html>
1.5 +<html>
1.6 +<head>
1.7 + <title>HTML input states</title>
1.8 + <link rel="stylesheet" type="text/css"
1.9 + href="chrome://mochikit/content/tests/SimpleTest/test.css" />
1.10 +
1.11 + <script type="application/javascript"
1.12 + src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
1.13 +
1.14 + <script type="application/javascript"
1.15 + src="../common.js"></script>
1.16 + <script type="application/javascript"
1.17 + src="../role.js"></script>
1.18 + <script type="application/javascript"
1.19 + src="../states.js"></script>
1.20 +
1.21 + <script type="application/javascript">
1.22 + function doTest()
1.23 + {
1.24 + ////////////////////////////////////////////////////////////////////////////
1.25 + // 'editable' and 'multiline' states.
1.26 + testStates("input", 0, EXT_STATE_EDITABLE, 0, EXT_STATE_MULTI_LINE);
1.27 + testStates("textarea", 0, EXT_STATE_EDITABLE | EXT_STATE_MULTI_LINE);
1.28 +
1.29 + testStates("input_readonly", 0, EXT_STATE_EDITABLE);
1.30 + testStates("input_disabled", 0, EXT_STATE_EDITABLE);
1.31 + testStates("textarea_readonly", 0, EXT_STATE_EDITABLE);
1.32 + testStates("textarea_disabled", 0, EXT_STATE_EDITABLE);
1.33 +
1.34 + ////////////////////////////////////////////////////////////////////////////
1.35 + // 'required', 'readonly' and 'unavailable' states.
1.36 + var maybe_required = ["input","search","radio","checkbox","textarea"];
1.37 + var never_required = ["submit","button","reset","image"];
1.38 +
1.39 + var i;
1.40 + for (i in maybe_required) {
1.41 + testStates(maybe_required[i],
1.42 + STATE_FOCUSABLE, 0,
1.43 + STATE_REQUIRED | STATE_READONLY | STATE_UNAVAILABLE);
1.44 +
1.45 + testStates(maybe_required[i] + "_required",
1.46 + STATE_FOCUSABLE | STATE_REQUIRED, 0,
1.47 + STATE_UNAVAILABLE | STATE_READONLY);
1.48 +
1.49 + var readonlyID = maybe_required[i] + "_readonly";
1.50 + if (document.getElementById(readonlyID)) {
1.51 + testStates(readonlyID,
1.52 + STATE_FOCUSABLE | STATE_READONLY, 0,
1.53 + STATE_UNAVAILABLE | STATE_REQUIRED);
1.54 + }
1.55 +
1.56 + testStates(maybe_required[i] + "_disabled",
1.57 + STATE_UNAVAILABLE, 0,
1.58 + STATE_FOCUSABLE | STATE_READONLY | STATE_REQUIRED);
1.59 + }
1.60 +
1.61 + for (i in never_required) {
1.62 + testStates(never_required[i], 0, 0, STATE_REQUIRED | EXT_STATE_EDITABLE);
1.63 + }
1.64 +
1.65 + ////////////////////////////////////////////////////////////////////////////
1.66 + // inherited 'unavailable' state
1.67 + testStates("f", STATE_UNAVAILABLE);
1.68 + testStates("f_input", STATE_UNAVAILABLE);
1.69 + testStates("f_input_disabled", STATE_UNAVAILABLE);
1.70 +
1.71 + ////////////////////////////////////////////////////////////////////////////
1.72 + // inherited from file control
1.73 + var fileBrowseButton = getAccessible("file").firstChild;
1.74 + testStates(fileBrowseButton, STATE_UNAVAILABLE | STATE_REQUIRED);
1.75 + // No states on the label.
1.76 +
1.77 + ////////////////////////////////////////////////////////////////////////////
1.78 + // 'invalid' state
1.79 +
1.80 + // XXX: maxlength doesn't make the element invalid until bug 613016 and
1.81 + // bug 613019 are fixed. Commenting out related lines and adding a todo to
1.82 + // make sure it will be uncommented as soon as possible.
1.83 + var todoInput = document.createElement("input");
1.84 + todoInput.maxLength = '2';
1.85 + todoInput.value = 'foo';
1.86 + todo(!todoInput.validity.valid,
1.87 + "input should be invalid because of maxlength");
1.88 +
1.89 + // invalid/valid state
1.90 + //var invalid = ["maxlength","pattern","email","url"];
1.91 + //document.getElementById("maxlength").value = "i am too long";
1.92 + var invalid = ["pattern","email","url"];
1.93 + for (i in invalid) {
1.94 + testStates(invalid[i], STATE_INVALID);
1.95 + testStates(invalid[i] + "2", 0, 0, STATE_INVALID);
1.96 + }
1.97 +
1.98 + // invalid/valid state
1.99 + //var invalid = ["maxlength","pattern","email","url"];
1.100 + //document.getElementById("maxlength").value = "i am too long";
1.101 + var invalid = ["pattern","email","url"];
1.102 + for (i in invalid) {
1.103 + testStates(invalid[i], STATE_INVALID);
1.104 + testStates(invalid[i] + "2", 0, 0, STATE_INVALID);
1.105 + }
1.106 +
1.107 + ////////////////////////////////////////////////////////////////////////////
1.108 + // autocomplete states
1.109 + testStates("autocomplete-default", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.110 + testStates("autocomplete-off", 0, 0, 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.111 + testStates("autocomplete-formoff", 0, 0, 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.112 + testStates("autocomplete-list", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.113 + testStates("autocomplete-list2", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.114 + testStates("autocomplete-tel", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.115 + testStates("autocomplete-email", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.116 + testStates("autocomplete-search", 0, EXT_STATE_SUPPORTS_AUTOCOMPLETION);
1.117 +
1.118 + ////////////////////////////////////////////////////////////////////////////
1.119 + // haspopup
1.120 + testStates("autocomplete-list", STATE_HASPOPUP);
1.121 +
1.122 + SimpleTest.finish();
1.123 + }
1.124 +
1.125 + SimpleTest.waitForExplicitFinish();
1.126 + addA11yLoadEvent(doTest);
1.127 + </script>
1.128 +</head>
1.129 +
1.130 +<body>
1.131 + <a target="_blank"
1.132 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=559275"
1.133 + title="map attribute required to STATE_REQUIRED">
1.134 + Bug 559275
1.135 + </a>
1.136 + <a target="_blank"
1.137 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=389238"
1.138 + title="Support disabled state on fieldset">
1.139 + Bug 389238
1.140 + </a>
1.141 + <a target="_blank"
1.142 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=599163"
1.143 + title="check disabled state instead of attribute">
1.144 + Bug 599163
1.145 + </a>
1.146 + <a target="_blank"
1.147 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=601205"
1.148 + title="Expose intrinsic invalid state to accessibility API">
1.149 + Bug 601205
1.150 + </a>
1.151 + <a target="_blank"
1.152 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=601205"
1.153 + title="Expose intrinsic invalid state to accessibility API">
1.154 + Bug 601205
1.155 + </a>
1.156 + <a target="_blank"
1.157 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=559766"
1.158 + title="Add accessibility support for @list on HTML input and for HTML datalist">
1.159 + Bug 559766
1.160 + </a>
1.161 + <a target="_blank"
1.162 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=699017"
1.163 + title="File input control should be propogate states to descendants">
1.164 + Bug 699017
1.165 + </a>
1.166 + <a target="_blank"
1.167 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=733382"
1.168 + title="Editable state bit should be present on readonly inputs">
1.169 + Bug 733382
1.170 + </a>
1.171 + <a target="_blank"
1.172 + href="https://bugzilla.mozilla.org/show_bug.cgi?id=878590"
1.173 + title="HTML5 datalist is not conveyed by haspopup property">
1.174 + Bug 878590
1.175 + </a>
1.176 +
1.177 + <p id="display"></p>
1.178 + <div id="content" style="display: none"></div>
1.179 + <pre id="test">
1.180 + </pre>
1.181 +
1.182 +
1.183 + <form>
1.184 + <input id="input" type="input">
1.185 + <input id="input_required" type="input" required>
1.186 + <input id="input_readonly" type="input" readonly>
1.187 + <input id="input_disabled" type="input" disabled>
1.188 + <input id="search" type="search">
1.189 + <input id="search_required" type="search" required>
1.190 + <input id="search_readonly" type="search" readonly>
1.191 + <input id="search_disabled" type="search" disabled>
1.192 + <input id="radio" type="radio">
1.193 + <input id="radio_required" type="radio" required>
1.194 + <input id="radio_disabled" type="radio" disabled>
1.195 + <input id="checkbox" type="checkbox">
1.196 + <input id="checkbox_required" type="checkbox" required>
1.197 + <input id="checkbox_disabled" type="checkbox" disabled>
1.198 + <textarea id="textarea"></textarea>
1.199 + <textarea id="textarea_required" required></textarea>
1.200 + <textarea id="textarea_readonly" readonly></textarea>
1.201 + <textarea id="textarea_disabled" disabled></textarea>
1.202 + </form>
1.203 +
1.204 + <!-- bogus required usage -->
1.205 + <input id="submit" type="submit" required>
1.206 + <input id="button" type="button" required>
1.207 + <input id="reset" type="reset" required>
1.208 + <input id="image" type="image" required>
1.209 +
1.210 + <!-- inherited disabled -->
1.211 + <fieldset id="f" disabled>
1.212 + <input id="f_input">
1.213 + <input id="f_input_disabled" disabled>
1.214 + </fieldset>
1.215 +
1.216 + <!-- inherited from input@type="file" -->
1.217 + <input id="file" type="file" required disabled>
1.218 +
1.219 + <!-- invalid/valid -->
1.220 + <input id="maxlength" maxlength="1">
1.221 + <input id="maxlength2" maxlength="100" value="foo">
1.222 + <input id="pattern" pattern="bar" value="foo">
1.223 + <input id="pattern2" pattern="bar" value="bar">
1.224 + <input id="email" type="email" value="foo">
1.225 + <input id="email2" type="email" value="foo@bar.com">
1.226 + <input id="url" type="url" value="foo">
1.227 + <input id="url2" type="url" value="http://mozilla.org/">
1.228 +
1.229 + <!-- invalid/valid -->
1.230 + <input id="maxlength" maxlength="1">
1.231 + <input id="maxlength2" maxlength="100" value="foo">
1.232 + <input id="pattern" pattern="bar" value="foo">
1.233 + <input id="pattern2" pattern="bar" value="bar">
1.234 + <input id="email" type="email" value="foo">
1.235 + <input id="email2" type="email" value="foo@bar.com">
1.236 + <input id="url" type="url" value="foo">
1.237 + <input id="url2" type="url" value="http://mozilla.org/">
1.238 +
1.239 + <!-- autocomplete -->
1.240 + <input id="autocomplete-default">
1.241 + <input id="autocomplete-off" autocomplete="off">
1.242 + <form autocomplete="off">
1.243 + <input id="autocomplete-formoff">
1.244 + </form>
1.245 + <datalist id="cities">
1.246 + <option>Paris</option>
1.247 + <option>San Francisco</option>
1.248 + </datalist>
1.249 + <input id="autocomplete-list" list="cities">
1.250 + <input id="autocomplete-list2" list="cities" autocomplete="off">
1.251 + <input id="autocomplete-tel" type="tel">
1.252 +
1.253 + Email Address:
1.254 + <input id="autocomplete-email" type="email" list="contacts" value="xyzzy">
1.255 + <datalist id="contacts">
1.256 + <option>xyzzy@plughs.com</option>
1.257 + <option>nobody@mozilla.org</option>
1.258 + </datalist>
1.259 +
1.260 + </br>Search for:
1.261 + <input id="autocomplete-search" type="search" list="searchhisty" value="Gamma">
1.262 + <datalist id="searchhisty">
1.263 + <option>Gamma Rays</option>
1.264 + <option>Gamma Ray Bursts</option>
1.265 + </datalist>
1.266 +
1.267 + </body>
1.268 +</html>
