2010-12-24 13:27:24 +00:00
<!DOCTYPE html>
< html lang = "en" >
2010-12-23 14:47:48 +00:00
< head >
2011-02-18 20:00:18 +00:00
< meta charset = "utf-8" >
2011-05-17 21:28:19 +00:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2010-12-24 13:27:24 +00:00
< title > jQuery Mobile Listview Integration Test< / title >
2010-12-23 14:47:48 +00:00
2011-04-14 20:04:47 +00:00
< script src = "../../../js/jquery.js" > < / script >
2011-03-10 04:16:48 +00:00
< script src = "../jquery.setNameSpace.js" > < / script >
2011-04-14 20:04:47 +00:00
< script src = "../../../js/" > < / script >
< script src = "../../jquery.testHelper.js" > < / script >
2010-12-24 13:27:24 +00:00
< link rel = "stylesheet" href = "../../../themes/default" / >
2011-04-14 20:04:47 +00:00
< link rel = "stylesheet" href = "../../../external/qunit.css" / >
< script src = "../../../external/qunit.js" > < / script >
2010-12-23 14:47:48 +00:00
2011-04-14 20:04:47 +00:00
< script src = "listview_core.js" > < / script >
2011-10-04 17:54:00 +00:00
< script src = "../swarminject.js" > < / script >
2010-12-23 14:47:48 +00:00
< / head >
< body >
2010-12-24 13:27:24 +00:00
< h1 id = "qunit-header" > jQuery Mobile Listview Integration Test< / h1 >
< h2 id = "qunit-banner" > < / h2 >
< h2 id = "qunit-userAgent" > < / h2 >
< ol id = "qunit-tests" >
< / ol >
2010-12-23 14:47:48 +00:00
<!-- Basic Linked view test -->
2011-03-17 07:14:32 +00:00
< div data-nstest-role = "page" id = 'basic-linked-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-03-17 07:14:32 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li > < a href = "#basic-link-results" > Home< / a > < / li >
< li > < a href = "#basic-link-results" > Back< / a > < / li >
< li > < a href = "#basic-link-results" > Return< / a > < / li >
2011-09-12 21:47:55 +00:00
< li > < a href = "#nested-list-test" id = "nested-list-test-anchor" > Nested List Test< / a > < / li >
2010-12-23 14:47:48 +00:00
< / ul >
< / div >
2011-07-27 19:53:30 +00:00
< a href = "cache-tests/nested.html" id = "cached-tests" > < / a >
2010-12-23 14:47:48 +00:00
< / div >
2011-03-17 07:14:32 +00:00
< div data-nstest-role = 'page' id = 'basic-link-results' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Results< / h1 >
< / div >
< / div >
<!-- Nested List -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'nested-list-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li > Groups of animals
< ul >
< li > pod of whales< / li >
< li > quiver of cobras< / li >
< li > troop of baboons< / li >
< / ul >
< / li >
2011-01-20 22:48:44 +00:00
< li class = "linebreaknode" >
2011-02-06 05:22:50 +00:00
2011-01-20 22:48:44 +00:00
More animals
2011-02-06 05:22:50 +00:00
2010-12-23 14:47:48 +00:00
< ul >
< li > Shoal of Bass< / li >
< li > Rhumba of rattlesnakes< / li >
< / ul >
< / li >
< / ul >
< / div >
< / div >
2011-05-16 04:33:40 +00:00
< div data-nstest-role = "page" id = 'nested-lists-test' >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "header" data-nstest-position = "inline" >
2011-05-16 04:33:40 +00:00
< h1 > Basic multiple lists view< / h1 >
< / div >
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-inset = "true" >
< li > Item 1< / li >
< li > Item 2< / li >
2011-06-03 18:06:44 +00:00
< li > Item 3
2011-05-16 15:43:02 +00:00
< ul data-nstest-role = "listview" >
2011-06-03 18:06:44 +00:00
< li > Item A-3-0< / li >
< li > Item A-3-1< / li >
< li > Item A-3-2< / li >
2011-05-16 04:33:40 +00:00
< / ul >
< / li >
< / ul >
2011-05-16 15:43:02 +00:00
< ul data-nstest-role = "listview" data-nstest-inset = "true" >
2011-06-03 18:06:44 +00:00
< li > Item 1< / li >
< li > Item 2< / li >
< li > Item 3
2011-05-16 15:43:02 +00:00
< ul data-nstest-role = "listview" >
2011-06-03 18:06:44 +00:00
< li > Item B-3-0
< ul data-nstest-role = "listview" >
< li > Item B-3-0-0< / li >
< li > Item B-3-0-1
< ul data-nstest-role = "listview" >
< li > Item B-3-0-1-0< / li >
< li > Item B-3-0-1-1< / li >
< li > Item B-3-0-1-2< / li >
< / ul >
< / li >
< li > Item B-3-0-2< / li >
< / ul >
< / li >
< li > Item B-3-1
< ul data-nstest-role = "listview" >
< li > Item B-3-1-0< / li >
< li > Item B-3-1-1< / li >
< li > Item B-3-1-2< / li >
< / ul >
< / li >
< li > Item B-3-2< / li >
2011-05-16 04:33:40 +00:00
< / ul >
< / li >
< / ul >
< / div >
< / div >
2010-12-23 14:47:48 +00:00
<!-- Numbered List -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'numbered-list-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ol data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li > < a href = "#numbered-list-results" > Number 1< / a > < / li >
< li > < a href = "#numbered-list-results" > Number 2< / a > < / li >
< li > < a href = "#numbered-list-results" > Number 3< / a > < / li >
< / ol >
< / div >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = 'page' id = 'numbered-list-results' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Numbered List< / h1 >
< / div >
< / div >
<!-- Read only List -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'read-only-list-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li > Read< / li >
< li > Only< / li >
< li > List< / li >
< li > View< / li >
< / ul >
< / div >
< / div >
<!-- Split listview -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'split-list-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Split List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li >
< a href = "#split-list-link1" > link one< / a >
2011-01-07 07:16:45 +00:00
< a href = "#split-list-link2" > link second< / a >
2010-12-23 14:47:48 +00:00
< / li >
< li >
< a href = "#split-list-link1" > link one< / a >
2011-01-07 07:16:45 +00:00
< a href = "#split-list-link2" > link second< / a >
2010-12-23 14:47:48 +00:00
< / li >
< li >
< a href = "#split-list-link1" > link one< / a >
2011-01-07 07:16:45 +00:00
< a href = "#split-list-link2" > link second< / a >
2010-12-23 14:47:48 +00:00
< / li >
< / ul >
< / div >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'split-list-link1' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Split List view 1< / h1 >
< / div >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'split-list-link2' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Split List view 2< / h1 >
< / div >
< / div >
<!-- List divider -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'list-divider-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > List Divider Test< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" >
2010-12-23 14:47:48 +00:00
< li > a is for aquaman< / li >
< li > b is for batman< / li >
2011-07-27 19:53:30 +00:00
< li data-nstest-role = "list-divider" > This is a list divider< / li >
2010-12-23 14:47:48 +00:00
< li > c is for catwoman< / li >
2011-07-27 19:53:30 +00:00
< li data-nstest-role = "list-divider" > This is another list divider< / li >
2010-12-23 14:47:48 +00:00
< li > d is for darkwing< / li >
< / ul >
< / div >
< / div >
<!-- Search bar filter -->
2011-03-17 07:14:32 +00:00
< div data-nstest-role = "page" id = 'search-filter-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2010-12-23 14:47:48 +00:00
< h1 > Split List View< / h1 >
< / div >
2011-03-17 07:14:32 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-filter = "true" >
2010-12-23 14:47:48 +00:00
< li > a is for aquaman< / li >
< li > b is for batman< / li >
< li > c is for catwoman< / li >
< li > d is for darkwing< / li >
< / ul >
< / div >
< / div >
2011-02-23 17:42:47 +00:00
<!-- Search bar filter with list - dividers -->
2011-03-16 07:07:26 +00:00
< div data-nstest-role = "page" id = 'search-filter-with-dividers-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2011-02-23 17:42:47 +00:00
< h1 > Split List View< / h1 >
< / div >
2011-03-16 07:07:26 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-filter = "true" >
< li data-nstest-role = "list-divider" > a< / li >
2011-02-23 17:42:47 +00:00
< li > a is for aquaman< / li >
2011-03-16 07:07:26 +00:00
< li data-nstest-role = "list-divider" > b< / li >
2011-02-23 17:42:47 +00:00
< li > b is for batman< / li >
2011-03-16 07:07:26 +00:00
< li data-nstest-role = "list-divider" > c< / li >
2011-02-23 17:42:47 +00:00
< li > c is for catwoman< / li >
2011-03-16 07:07:26 +00:00
< li data-nstest-role = "list-divider" > d< / li >
2011-02-23 17:42:47 +00:00
< li > d is for darkwing< / li >
< / ul >
< / div >
< / div >
2011-08-11 06:15:38 +00:00
<!-- Search bar filter inset -->
< div data-nstest-role = "page" id = 'search-filter-inset-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
< h1 > Inset Filter List View< / h1 >
< / div >
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-filter = "true" data-nstest-inset = "true" >
< li > a is for aquaman< / li >
< li > b is for batman< / li >
< li > c is for catwoman< / li >
< li > d is for darkwing< / li >
< / ul >
< / div >
< / div >
2011-05-18 21:59:00 +00:00
<!-- Programmatically generated list items ! -->
< div data-nstest-role = "page" id = "programmatically-generated-list" >
< ul data-nstest-role = "listview" data-nstest-inset = "true" id = "programmatically-generated-list-items" > < / ul >
< / div >
2011-05-19 06:46:46 +00:00
<!-- Removing items from list -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'removing-items-from-list-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2011-05-19 06:46:46 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-inset = "true" >
2011-05-19 06:46:46 +00:00
< li > Item 1< / li >
< li > Item 2< / li >
< li > Item 3< / li >
< li > Item 4< / li >
< / ul >
< / div >
< / div >
2011-06-30 09:11:52 +00:00
<!-- Rounded corners inset list with variable items -->
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = 'corner-rounded-test' >
< div data-nstest-role = "header" data-nstest-position = "inline" >
2011-06-30 09:11:52 +00:00
< h1 > Basic List View< / h1 >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "content" >
< ul data-nstest-role = "listview" data-nstest-inset = "true" >
2011-06-30 09:11:52 +00:00
< / ul >
< / div >
< / div >
2011-07-27 19:53:30 +00:00
< div data-nstest-role = "page" id = "enhancetest" >
2011-07-20 13:35:48 +00:00
< ul data-nstest-role = "listview" >
< li > < a href = "#basic-link-results" > Home< / a > < / li >
< li > < a href = "#basic-link-results" > Back< / a > < / li >
< li > < a href = "#basic-link-results" > Return< / a > < / li >
< / ul >
< / div >
2011-08-24 20:55:15 +00:00
< div data-nstest-role = "page" id = "ui-li-has-test" >
< div data-nstest-role = "content" >
< p > Right padding on item 1 is OK (75px).< / p >
< p > Right padding on items 2 & 3 should probably be around 30 or 35 (not 25).< / p >
< p > Right padding on item 4 should be 15px to match the left side.< / p >
< ol data-nstest-role = "listview" data-nstest-inset = "true" >
< li > < a href = "#" > Link LI with counter --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------< span class = "ui-li-count" > 123< / span > < / a > < / li >
< li > < a href = "#" > Link LI without counter -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------< / a > < / li >
< li > < a href = "#page1" > Page1 Link LI without counter -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------< / a > < a href = "#page2" > < / a > < / li >
< li > Static LI with counter ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------< span class = "ui-li-count" > 123< / span > < / li >
< li > Static LI without counter ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------< / li >
< / ol >
< / div >
< / div >
2010-12-23 14:47:48 +00:00
< / body >
< / html >