Additional fetchlink tests.

levidehaan · Dec 23, 2011 · 4d4c765 · 4d4c765
1 parent a1e6c87
commit 4d4c765
Show file tree

Hide file tree

Showing 4 changed files with 63 additions and 15 deletions.
diff --git a/tests/unit/fetchlink/ext-3.html b/tests/unit/fetchlink/ext-3.html
@@ -22,7 +22,7 @@ <h1>Header</h1>
 		</div>
 		<div data-nstest-role="content">
 
-			<a href="ext-4.html" class="foo" data-nstest-role="button">Quote 1</a>
+			<a href="ext-4.html" class="remote-fetchlink" data-nstest-role="button" href="ext-1.html" data-nstest-target=".secondtarget" data-nstest-fragment=".bq">Quote 4</a>
 
 			<label for="slider2">Flip switch:</label>
 			<select name="slider2" id="slider2" data-nstest-role="slider">
@@ -32,7 +32,9 @@ <h1>Header</h1>
 
 			<label for="test-slider">Slider:</label>
 		 	<input type="range" name="test-slider" id="test-slider" value="0" min="0" max="100"  />
-
+			<div class="secondtarget">
+
+			</div>
 		</div>
 		<div data-nstest-role="footer">
 			<h1>Footer</h1>

diff --git a/tests/unit/fetchlink/ext-4.html b/tests/unit/fetchlink/ext-4.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>jQuery Mobile Event Test Suite</title>
+</head>
+<body>
+
+	<blockquote class="bq">
+		<p>It was easier to know it than to explain why I know it. If you were asked to prove that two and two made four, you might find some difficulty, and yet you are quite sure of the fact.</p>
+		<address>Arthur Conan Doyle</address>
+		<cite>Sherlock Holmes: A Study In Scarlet</cite>
+	</blockquote>
+
+</body>
+</html>
diff --git a/tests/unit/fetchlink/fetchlink_core.js b/tests/unit/fetchlink/fetchlink_core.js
@@ -6,7 +6,7 @@
 
 	module( "Fetchlinks", {
 		setup: function(){
-			//
+		//	$.testHelper.openPage("#fetchlink-test1");
 		}
 	});
 
@@ -15,7 +15,7 @@
 
 		$.testHelper.pageSequence([
 			function(){
-				$('.foo').trigger('click');
+				$('.standalone').trigger('click');
 			},
 			function(){
 				ok( targetContents !== $( '.loadinto' ).html() );
@@ -24,7 +24,7 @@
 		]);
 	});
 
-	asyncTest( "Clicking a fetchlink replaces previously loaded content with remote content.", function(){
+	asyncTest( "Clicking a grouped fetchlink loads remote content.", function(){
 		var targetContents = $( '.loadinto' ).html();
 
 		$.testHelper.pageSequence([
@@ -38,24 +38,51 @@
 		]);
 	});
 
-	asyncTest( "Elements are properly enhanced after being fetched.", function(){		
+	asyncTest( "When no remote fragment is specified, the remote “page” element’s contents are pulled in instead.", function(){		
 		$.testHelper.pageSequence([
 			function(){
-				$('.baz').trigger('click');
+				$('.remote-page').trigger('click');
 			},
 			function(){
-				ok( $('[data-nstest-role="header"]').hasClass( 'ui-header' ), "Page header is enhanced." );
-				ok( $('[data-nstest-role="content"]').hasClass( 'ui-content' ), "Page content is enhanced." );
-				ok( $('[data-nstest-role="footer"]').hasClass( 'ui-footer' ), "Page footer is enhanced." );
-				ok( $('[data-nstest-role="button"]').hasClass( 'ui-btn' ), "A link with a role of “button” is enhanced." );
-				ok( $('[data-nstest-role="slider"]').hasClass( 'ui-slider-switch' ), "Toggles are enhanced." );
-				ok( $('#test-slider').hasClass( 'ui-slider-input' ), "Slider widgets are enhanced." );
+				var headerFirst = $('.loadinto').find('div:first').attr('data-nstest-role') === 'header',
+					footerLast = $('.loadinto').find('div:last').attr('data-nstest-role') === 'footer';
+
+				ok( headerFirst && footerLast, "First and last items within the page wrapper match the first and last items in the target container." );
+				start();
+			}
+		]);
+	});
+
+	asyncTest( "Elements are properly enhanced after being fetched.", function(){		
+		$.testHelper.pageSequence([
+			function(){
+				ok( $('.loadinto').find('[data-nstest-role="header"]').hasClass( 'ui-header' ), "Page header is enhanced." );
+				ok( $('.loadinto').find('[data-nstest-role="content"]').hasClass( 'ui-content' ), "Page content is enhanced." );
+				ok( $('.loadinto').find('[data-nstest-role="footer"]').hasClass( 'ui-footer' ), "Page footer is enhanced." );
+				ok( $('.loadinto').find('[data-nstest-role="button"]').hasClass( 'ui-btn' ), "A link with a role of “button” is enhanced." );
+				ok( $('.loadinto').find('[data-nstest-role="slider"]').hasClass( 'ui-slider-switch' ), "Toggles are enhanced." );
+				ok( $('.loadinto').find('#test-slider').hasClass( 'ui-slider-input' ), "Slider widgets are enhanced." );
 
 				start();
 			}
 		]);
 	});
 
+	asyncTest( "Fetchlinks within remote content function normally.", function(){		
+		var targetContents = $( '.secondtarget' ).html();
+
+		$.testHelper.pageSequence([
+			function() {
+				$('.remote-fetchlink').trigger('click');
+			},
+			function(){
+				ok( $('.loadinto').html() !== targetContents, "Target container has been updated with remote content." );
+				start();
+			}
+		]);
+	});
+
+
 
 
 })(jQuery);
diff --git a/tests/unit/fetchlink/index.html b/tests/unit/fetchlink/index.html
@@ -31,12 +31,14 @@ <h2 id="qunit-userAgent"></h2>
 <div data-nstest-role="page" id="fetchlink-test1">
 
 	<div data-nstest-role="content">
+
+		<a href="ext-1.html" class="standalone" data-nstest-fragment=".bq" data-nstest-target=".loadinto">Quote 1</a>
+
 		<ul data-nstest-target=".loadinto" data-nstest-fragment=".bq">	
-			<li><a href="ext-1.html" class="foo">Quote 1</a></li>
 			<li><a href="ext-2.html" class="bar">Quote 2</a></li>
 		</ul>
 
-		<a href="ext-3.html" class="baz" data-nstest-target=".loadinto">External Page</a>
+		<a href="ext-3.html" class="remote-page" data-nstest-target=".loadinto">External Page</a>
 
 		<div class="loadinto">