Added tests for issue #3529: collapsible set with dynamic content

jquery-archive · Feb 23, 2012 · ec3e602 · ec3e602
1 parent 60f20e0
commit ec3e602
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 0 deletions.
diff --git a/tests/unit/collapsible/collapsible_core.js b/tests/unit/collapsible/collapsible_core.js
@@ -116,6 +116,30 @@
 		]);
 	});
 
+	asyncTest( "Collapsible Set with dynamic content", function(){
+		$.testHelper.pageSequence([
+			function(){
+				$.testHelper.openPage( "#collapsible-set-with-dynamic-content" );
+			},
+
+			function() {
+				var set = $( ".ui-page-active" ).find( ".ui-collapsible-set" );
+				for ( var i = 0; i < 3; i++ ) {
+					$( '<div data-'+ $.mobile.ns +'role="collapsible"><h3>Collapsible Item ' + i + '</h3></div>' ).appendTo( set );
+				}
+				set.collapsibleset( "refresh" );
+				equal( set.find( ".ui-collapsible" ).length, 3, "The 3 collapsible should be enhanced" );
+				ok( set.find( ".ui-collapsible" ).eq( 0 ).find( "a" ).hasClass( "ui-corner-top" ), "The 1st collapsible should have top corners" );
+				ok( !set.find( ".ui-collapsible" ).eq( 0 ).find( "a" ).hasClass( "ui-corner-bottom" ), "The 1st collapsible should NOT have bottom corners" );
+				ok( !set.find( ".ui-collapsible" ).eq( 1 ).find( "a" ).hasClass( "ui-corner-top" ), "The 2nd collapsible should NOT have top corners" );
+				ok( !set.find( ".ui-collapsible" ).eq( 1 ).find( "a" ).hasClass( "ui-corner-bottom" ), "The 2nd collapsible should NOT have bottom corners" );
+				ok( set.find( ".ui-collapsible" ).eq( 2 ).find( "a" ).hasClass( "ui-corner-bottom" ), "The 3rd collapsible should have bottom corners" );
+				ok( !set.find( ".ui-collapsible" ).eq( 2 ).find( "a" ).hasClass( "ui-corner-top" ), "The 3rd collapsible should NOT have top corners" );
+				start();
+			}
+		]);
+	});
+
 	module( "Theming", {});
 
 	asyncTest( "Collapsible", 6, function(){

diff --git a/tests/unit/collapsible/index.html b/tests/unit/collapsible/index.html
@@ -174,5 +174,14 @@ <h3>Section D</h3>
 	</div>
 </div>
 
+<div data-nstest-role="page" id='collapsible-set-with-dynamic-content'>
+	<div data-nstest-role="header">
+		<h1>Collapsible Set with dynamic content</h1>
+	</div>
+	<div data-nstest-role="content">
+		<div data-nstest-role="collapsible-set"></div>
+	</div>
+</div>
+
 </body>
 </html>