4 <meta charset="UTF-8" />
5 <title>jQuery Mobile Kitchen Sink Test Suite</title>
6 <!-- meta viewport left out on purpose for test append -->
7 <script src="../../../external/requirejs/require.js"></script>
8 <script src="../../../js/jquery.tag.inserter.js"></script>
9 <script src="../../../external/qunit.js"></script>
10 <script src="../../../js/jquery.js"></script>
11 <script src="../jquery.setNameSpace.js"></script>
12 <script src="../../jquery.testHelper.js"></script>
13 <script src="../../../js/"></script>
16 $.testHelper.asyncLoad([
17 [ "jquery.mobile.init" ],
18 [ "kitchensink_core.js" ]
22 <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css" />
23 <link rel="stylesheet" href="../../../external/qunit.css"/>
25 <script src="../swarminject.js"></script>
29 <h1 id="qunit-header">jQuery Mobile Kitchen Sink Test Suite</h1>
30 <h2 id="qunit-banner"></h2>
31 <h2 id="qunit-userAgent"></h2>
35 <div data-nstest-role="page" id="default">
36 <div data-nstest-role="header" data-nstest-position="fixed" data-nstest-theme="a">
37 <h1>Fixed toolbars</h1>
38 <a href="../../" data-nstest-icon="home" data-nstest-iconpos="notext" data-nstest-direction="reverse">Home</a>
39 <a href="../nav.html" data-nstest-icon="search" data-nstest-iconpos="notext" data-nstest-rel="dialog" data-nstest-transition="fade">Search</a>
42 <div data-nstest-role="content" id="control-group-content">
44 <h2>Form Elements in Fieldcontains</h2>
45 <div data-nstest-role="fieldcontain">
46 <label for="name">Text Input:</label>
47 <input type="text" name="name" id="name" value="" />
50 <div data-nstest-role="fieldcontain">
51 <label for="textarea">Textarea:</label>
52 <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
55 <div data-nstest-role="fieldcontain">
56 <label for="search">Search Input:</label>
57 <input type="search" name="password" id="search" value="" />
60 <div data-nstest-role="fieldcontain">
61 <label for="slider2">Flip switch:</label>
62 <select name="slider2" id="slider2" data-nstest-role="slider">
63 <option value="off">Off</option>
64 <option value="on">On</option>
68 <div data-nstest-role="fieldcontain">
69 <label for="slider">Slider:</label>
70 <input type="range" name="slider" id="slider" value="50" min="0" max="100" data-nstest-highlight="true" />
73 <div data-nstest-role="fieldcontain">
74 <fieldset data-nstest-role="controlgroup">
75 <legend>Choose as many snacks as you'd like:</legend>
76 <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
77 <label for="checkbox-1a">Cheetos</label>
79 <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
80 <label for="checkbox-2a">Doritos</label>
82 <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
83 <label for="checkbox-3a">Fritos</label>
85 <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
86 <label for="checkbox-4a">Sun Chips</label>
90 <div data-nstest-role="fieldcontain">
91 <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
92 <legend>Font styling:</legend>
93 <input type="checkbox" name="checkbox-6" id="checkbox-6" class="custom" />
94 <label for="checkbox-6">b</label>
96 <input type="checkbox" name="checkbox-7" id="checkbox-7" class="custom" />
97 <label for="checkbox-7"><em>i</em></label>
99 <input type="checkbox" name="checkbox-8" id="checkbox-8" class="custom" />
100 <label for="checkbox-8">u</label>
104 <div data-nstest-role="fieldcontain">
105 <fieldset data-nstest-role="controlgroup" data-nstest-theme="c">
106 <legend>Choose a pet:</legend>
107 <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
108 <label for="radio-choice-1">Cat</label>
110 <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" />
111 <label for="radio-choice-2">Dog</label>
113 <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
114 <label for="radio-choice-3">Hamster</label>
116 <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
117 <label for="radio-choice-4">Lizard</label>
121 <div data-nstest-role="fieldcontain">
122 <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
123 <legend>Layout view:</legend>
124 <input type="radio" name="radio-choice-b" id="radio-choice-c" value="on" checked="checked" />
125 <label for="radio-choice-c">List</label>
126 <input type="radio" name="radio-choice-b" id="radio-choice-d" value="off" />
127 <label for="radio-choice-d">Grid</label>
128 <input type="radio" name="radio-choice-b" id="radio-choice-e" value="other" />
129 <label for="radio-choice-e">Gallery</label>
133 <div data-nstest-role="fieldcontain">
134 <label for="select-choice-1" class="select">Choose shipping method:</label>
135 <select name="select-choice-1" id="select-choice-1">
136 <option value="standard">Standard: 7 day</option>
137 <option value="rush">Rush: 3 days</option>
138 <option value="express">Express: next day</option>
139 <option value="overnight">Overnight</option>
143 <div data-nstest-role="fieldcontain">
144 <label for="select-choice-3" class="select">Your state:</label>
145 <select name="select-choice-3" id="select-choice-3">
146 <option value="AL">Alabama</option>
147 <option value="AK">Alaska</option>
148 <option value="AZ">Arizona</option>
149 <option value="AR">Arkansas</option>
150 <option value="CA">California</option>
154 <div data-nstest-role="fieldcontain">
155 <label for="select-choice-a" class="select">Choose shipping method:</label>
156 <select name="select-choice-a" id="select-choice-a" data-nstest-native-menu="false">
157 <option>Custom menu example</option>
158 <option value="standard">Standard: 7 day</option>
159 <option value="rush">Rush: 3 days</option>
160 <option value="express">Express: next day</option>
161 <option value="overnight">Overnight</option>
166 <div data-nstest-role="footer" id="control-group-footer" class="ui-bar" data-nstest-position="inline">
167 <div data-nstest-role="controlgroup" data-nstest-type="horizontal">
168 <a href="index.html" data-nstest-icon="delete">Remove</a>
169 <a href="index.html" data-nstest-icon="plus">Add</a>
170 <a href="index.html" data-nstest-icon="arrow-u">Up</a>
171 <a href="index.html" data-nstest-icon="arrow-d">Down</a>
175 <h2>Mini Form Elements</h2>
177 <label for="name">Text Input:</label>
178 <input type="text" name="name" id="name" value="" data-nstest-mini="true" />
180 <label for="textarea">Textarea:</label>
181 <textarea cols="40" rows="8" name="textarea" id="textarea" data-nstest-mini="true"></textarea>
183 <label for="search">Search Input:</label>
184 <input type="search" name="password" id="search" value="" data-nstest-mini="true" />
186 <label for="slider2">Flip switch:</label>
187 <select name="slider2" id="slider2" data-nstest-role="slider" data-nstest-mini="true">
188 <option value="off">Off</option>
189 <option value="on">On</option>
192 <div data-nstest-role="fieldcontain">
193 <label for="slider">Slider:</label>
194 <input type="range" name="slider" id="slider" value="50" min="0" max="100" data-nstest-highlight="true" data-nstest-mini="true" />
197 <div data-nstest-role="fieldcontain">
198 <fieldset data-nstest-role="controlgroup" data-nstest-mini="true">
199 <!-- Mini set on controlgroup -->
201 <legend>Choose as many snacks as you'd like:</legend>
202 <input type="checkbox" name="checkbox-1a" id="checkbox-1a" class="custom" />
203 <label for="checkbox-1a">Cheetos</label>
205 <input type="checkbox" name="checkbox-2a" id="checkbox-2a" class="custom" />
206 <label for="checkbox-2a">Doritos</label>
208 <input type="checkbox" name="checkbox-3a" id="checkbox-3a" class="custom" />
209 <label for="checkbox-3a">Fritos</label>
211 <input type="checkbox" name="checkbox-4a" id="checkbox-4a" class="custom" />
212 <label for="checkbox-4a">Sun Chips</label>
216 <div data-nstest-role="fieldcontain">
217 <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal" data-nstest-mini="true">
219 <legend>Font styling:</legend>
220 <input type="checkbox" name="checkbox-6" id="checkbox-6" class="custom" />
221 <label for="checkbox-6">b</label>
223 <input type="checkbox" name="checkbox-7" id="checkbox-7" class="custom" />
224 <label for="checkbox-7"><em>i</em></label>
226 <input type="checkbox" name="checkbox-8" id="checkbox-8" class="custom" />
227 <label for="checkbox-8">u</label>
231 <div data-nstest-role="fieldcontain">
232 <input type="checkbox" name="radio-gaga" id="radio-gaga" value="choice-1" data-nstest-mini="true" data-nstest-mini="true" />
233 <label for="radio-gaga">Unchecked by Default</label>
235 <input type="checkbox" name="radio-googoo" id="radio-googoo" value="choice-1" data-nstest-mini="true" checked="checked" data-nstest-mini="true" />
236 <label for="radio-googoo">Checked by Default</label>
239 <div data-nstest-role="fieldcontain">
240 <fieldset data-nstest-role="controlgroup" data-nstest-theme="c" >
241 <!-- Mini set on individual elements. -->
243 <legend>Choose a pet:</legend>
244 <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked" />
245 <label for="radio-choice-1">Cat</label>
247 <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" data-nstest-mini="true"/>
248 <label for="radio-choice-2">Dog</label>
250 <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
251 <label for="radio-choice-3">Hamster</label>
253 <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
254 <label for="radio-choice-4">Lizard</label>
258 <div data-nstest-role="fieldcontain">
259 <fieldset data-nstest-role="controlgroup" data-nstest-type="horizontal">
260 <legend>Layout view:</legend>
261 <input type="radio" name="radio-choice-b" id="radio-choice-c" value="on" checked="checked" />
262 <label for="radio-choice-c">List</label>
263 <input type="radio" name="radio-choice-b" id="radio-choice-d" value="off" />
264 <label for="radio-choice-d">Grid</label>
265 <input type="radio" name="radio-choice-b" id="radio-choice-e" value="other" />
266 <label for="radio-choice-e">Gallery</label>
270 <div data-nstest-role="fieldcontain">
271 <label for="select-choice-1" class="select">Choose shipping method:</label>
272 <select name="select-choice-1" id="select-choice-1">
273 <option value="standard">Standard: 7 day</option>
274 <option value="rush">Rush: 3 days</option>
275 <option value="express">Express: next day</option>
276 <option value="overnight">Overnight</option>
280 <div data-nstest-role="fieldcontain">
281 <label for="select-choice-3" class="select">Your state:</label>
282 <select name="select-choice-3" id="select-choice-3">
283 <option value="AL">Alabama</option>
284 <option value="AK">Alaska</option>
285 <option value="AZ">Arizona</option>
286 <option value="AR">Arkansas</option>
287 <option value="CA">California</option>
291 <div data-nstest-role="fieldcontain">
292 <label for="select-choice-a" class="select">Choose shipping method:</label>
293 <select name="select-choice-a" id="select-choice-a" data-nstest-native-menu="false">
294 <option>Custom menu example</option>
295 <option value="standard">Standard: 7 day</option>
296 <option value="rush">Rush: 3 days</option>
297 <option value="express">Express: next day</option>
298 <option value="overnight">Overnight</option>
302 <div data-nstest-role="footer" id="control-group-footer" class="ui-bar" data-nstest-position="inline">
303 <div data-nstest-role="controlgroup" data-nstest-type="horizontal">
304 <a href="index.html" data-nstest-icon="delete">Remove</a>
305 <a href="index.html" data-nstest-icon="plus">Add</a>
306 <a href="index.html" data-nstest-icon="arrow-u">Up</a>
307 <a href="index.html" data-nstest-icon="arrow-d">Down</a>
314 <ul data-nstest-role="listview">
315 <li><a href="index.html">Acura</a></li>
316 <li><a href="index.html">Audi</a></li>
317 <li><a href="index.html">BMW</a></li>
321 <ul data-nstest-role="listview" data-nstest-mini="true">
322 <li><a href="index.html">Cooper</a></li>
323 <li><a href="index.html">Cooper S</a></li>
324 <li><a href="index.html">Clubman</a></li>
327 <h2>Individual mini item</h2>
328 <ul data-nstest-role="listview">
329 <li><a href="index.html">Cooper</a></li>
330 <li data-nstest-mini="true"><a href="index.html">Cooper S</a></li>
331 <li><a href="index.html">Clubman</a></li>
337 <h2>Count bubbles</h2>
338 <ul data-nstest-role="listview">
339 <li><a href="index.html">Inbox <span class="ui-li-count">12</span></a></li>
340 <li><a href="index.html">Outbox <span class="ui-li-count">0</span></a></li>
341 <li><a href="index.html">Drafts <span class="ui-li-count">4</span></a></li>
342 <li><a href="index.html">Sent <span class="ui-li-count">328</span></a></li>
343 <li><a href="index.html">Trash <span class="ui-li-count">62</span></a></li>
346 <h2>Numbered list</h2>
347 <ol data-nstest-role="listview">
348 <li><a href="index.html">The Godfather</a></li>
349 <li><a href="index.html">Inception</a></li>
350 <li><a href="index.html">The Good, the Bad and the Ugly </a></li>
351 <li><a href="index.html">Pulp Fiction</a></li>
352 <li><a href="index.html">Schindler's List</a></li>
355 <h2>Divided, formatted content</h2>
356 <ul data-nstest-role="listview">
357 <li><a href="index.html">
358 <h3>Stephen Weber</h3>
359 <p><strong>You've been invited to a meeting at Filament Group in Boston, MA</strong></p>
360 <p>Hey Stephen, if you're available at 10am tomorrow, we've got a meeting with the jQuery team.</p>
361 <p class="ui-li-aside"><strong>6:24</strong>PM</p>
363 <li><a href="index.html">
365 <p><strong>Boston Conference Planning</strong></p>
366 <p>In preparation for the upcoming conference in Boston, we need to start gathering a list of sponsors and speakers.</p>
367 <p class="ui-li-aside"><strong>9:18</strong>AM</p>
374 <ul data-nstest-role="listview" data-nstest-theme="a">
375 <li><a href="index.html"><img src="../../../docs/lists/../../../docs/lists/images/gf.png" alt="France" class="ui-li-icon">France <span class="ui-li-count">4</span></a></li>
376 <li><a href="index.html"><img src="../../../docs/lists/images/de.png" alt="Germany" class="ui-li-icon">Germany <span class="ui-li-count">4</span></a></li>
377 <li data-nstest-theme="b"><a href="index.html"><img src="../../../docs/lists/images/gb.png" alt="Great Britain" class="ui-li-icon">Great Britain <span class="ui-li-count">0</span></a></li>
378 <li><a href="index.html"><img src="../../../docs/lists/images/fi.png" alt="Finland" class="ui-li-icon">Finland <span class="ui-li-count">12</span></a></li>
379 <li><a href="index.html"><img src="../../../docs/lists/images/sj.png" alt="Norway" class="ui-li-icon">Norway <span class="ui-li-count">328</span></a></li>
380 <li><a href="index.html"><img src="../../../docs/lists/images/us.png" alt="United States" class="ui-li-icon">United States <span class="ui-li-count">62</span></a></li>
383 <h2>Thumbnail, split button list</h2>
385 <ul data-nstest-role="listview">
386 <li><a href="index.html">
387 <img src="../../../docs/lists/images/album-bb.jpg" />
388 <h3>Broken Bells</h3>
390 </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
392 <li><a href="index.html">
393 <img src="../../../docs/lists/images/album-hc.jpg" />
396 </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
398 <li><a href="index.html">
399 <img src="../../../docs/lists/images/album-p.jpg" />
400 <h3>Wolfgang Amadeus Phoenix</h3>
402 </a><a href="lists-split-purchase.html" data-nstest-rel="dialog" data-nstest-transition="slideup">Purchase album
406 <h2>Divided, filterable list</h2>
407 <ul data-nstest-role="listview" data-nstest-filter="true">
408 <li data-nstest-role="list-divider">A</li>
409 <li><a href="index.html">Adam Kinkaid</a></li>
410 <li><a href="index.html">Alex Wickerham</a></li>
411 <li><a href="index.html">Avery Johnson</a></li>
412 <li data-nstest-role="list-divider">B</li>
413 <li><a href="index.html">Bob Cabot</a></li>
414 <li data-nstest-role="list-divider">C</li>
415 <li><a href="index.html">Caleb Booth</a></li>
416 <li><a href="index.html">Christopher Adams</a></li>