Listview: Test refresh() _addClass() call sequence

Author: Gabriel Schulhof

tests/integration/listview/backcompat-tests.html

@@ -34,6 +34,11 @@
 				<li>Item 2</li>
 			</ul>
 		</div>
+
+		<ul id="sparing-check" data-nstest-role="listview">
+			<li id="sparing-check-first-item">Item 1</li>
+			<li id="sparing-check-second-item">Item 2</li>
+		</ul>
 	</div>
 </body>
 </html>

tests/integration/listview/backcompat_core.js

@@ -1,7 +1,8 @@
 define( [
 	"qunit",
-	"jquery"
-	], function( QUnit, $ ) {
+	"jquery",
+	"../tests/integration/listview/sparing-setup-teardown"
+	], function( QUnit, $, sparingSetupTeardown ) {
 
 var helper = $.testHelper;
 
@@ -106,4 +107,17 @@ QUnit.test( "Turning on class ui-shadow", function( assert ) {
 		"Option shadow is true whenever ui-shadow is present in ui-listview-inset" );
 } );
 
+QUnit.module( "Sparingness of refresh()", sparingSetupTeardown );
+
+QUnit.test( "refresh()", function( assert ) {
+	assert.expect( 2 );
+
+	this.listview.refresh();
+
+	assert.strictEqual( this.calls[ 1 ][ 0 ].length, 1,
+		"One element was passed to _addClass()" );
+	assert.deepEqual( this.calls[ 1 ][ 0 ].get( 0 ), this.newItem[ 0 ],
+		"The single item in the call is as expected" );
+} );
+
 } );

tests/integration/listview/index.html

@@ -180,6 +180,11 @@
 					</a>
 				</li>
 			</ul>
+
+			<ul data-ui-role="listview" id="sparing-check">
+				<li id="sparing-check-first-item">Item 1</li>
+				<li id="sparing-check-second-item">Item 2</li>
+			</ul>
 		</div>
 	</div>
 

tests/integration/listview/listview_core.js

@@ -5,8 +5,9 @@
 // TODO split out into separate test files
 define( [
 	"qunit",
-	"jquery"
-	], function( QUnit, $ ) {
+	"jquery",
+	"../tests/integration/listview/sparing-setup-teardown"
+	], function( QUnit, $, sparingSetupTeardown ) {
 
 QUnit.module( "Basic Linked list" );
 
@@ -458,4 +459,34 @@ QUnit.test( "basic pre-enhanced listview", function( assert ) {
 		"Listview refresh() enhances new items" );
 } );
 
+QUnit.module( "Sparingness of refresh() and updateItems()", sparingSetupTeardown );
+
+QUnit.test( "refresh()", function( assert ) {
+	assert.expect( 5 );
+
+	this.listview.refresh();
+
+	assert.strictEqual( this.calls[ 0 ][ 0 ].length, 3,
+		"Three elements were passed to _addClass()" );
+	assert.strictEqual( this.calls[ 0 ][ 1 ], "ui-listview-item ui-listview-item-static",
+		"Class ui-listview-item-static was assigned" );
+	assert.strictEqual( this.calls[ 0 ][ 0 ].first().attr( "id" ), "sparing-check-first-item",
+		"The first item in the call is as expected" );
+	assert.deepEqual( this.calls[ 0 ][ 0 ].get( 1 ), this.newItem[ 0 ],
+		"The second item in the call is as expected" );
+	assert.strictEqual( this.calls[ 0 ][ 0 ].last().attr( "id" ), "sparing-check-second-item",
+		"The last item in the call is as expected" );
+} );
+
+QUnit.test( "updateItems()", function( assert ) {
+	assert.expect( 2 );
+
+	this.listview.updateItems( this.newItem );
+
+	assert.strictEqual( this.calls[ 0 ][ 0 ].length, 1,
+		"One element was passed to _addClass()" );
+	assert.deepEqual( this.calls[ 0 ][ 0 ].get( 0 ), this.newItem[ 0 ],
+		"The single item in the call is as expected" );
+} );
+
 } );

tests/integration/listview/sparing-setup-teardown.js

@@ -0,0 +1,24 @@
+define( [ "jquery" ], function( $ ) {
+
+return {
+	setup: function() {
+		var that = this;
+
+		this.template = $( "#sparing-check" ).clone();
+		this.listview = $( "#sparing-check" ).listview().listview( "instance" );
+		this.newItem = $( "<li>Something</li>" ).insertAfter( "#sparing-check-first-item" );
+		this.calls = [];
+		this._addClass = $.mobile.listview.prototype._addClass;
+
+		$.mobile.listview.prototype._addClass = function() {
+			that.calls.push( arguments );
+			return that._addClass.apply( this, arguments );
+		};
+	},
+	teardown: function() {
+		$( "#sparing-check" ).before( this.template ).remove();
+		$.mobile.listview.prototype._addClass = this._addClass;
+	}
+};
+
+} );