Filterable: As part of backcompat, listview refresh refreshes filterable

Closes gh-7339
Fixes gh-5680

Author: Gabriel Schulhof

js/widgets/filterable.backcompat.js

@@ -205,6 +205,31 @@ $.widget( "mobile.listview", $.mobile.listview, {
 			this.element.filterable();
 		}
 		return this._super();
+	},
+
+	_afterListviewRefresh: function() {
+		var filterable = this.element.data( "mobile-filterable" );
+
+		if ( this.options.filter === true && filterable ) {
+			this._preventRefreshLoop = true;
+			filterable.refresh();
+		}
+	},
+
+	// Eliminate infinite recursion caused by the fact that we call filterable.refresh() from
+	// _afterListviewRefresh() above, which, in turn, calls _refreshChildWidget(), which, in
+	// turn, calls listview refresh(), which would, in turn, calls _afterListviewRefresh()
+	// above, if we wouldn't prevent that right here.
+	refresh: function() {
+		var returnValue;
+
+		if ( !this._preventRefreshLoop ) {
+			returnValue = this._superApply( arguments );
+		}
+
+		this._preventRefreshLoop = false;
+
+		return returnValue;
 	}
 });
 

tests/unit/filterable/filterable_core.js

@@ -44,6 +44,8 @@ test( "Filterable input prevents default on ENTER", function() {
 	deepEqual( event.isDefaultPrevented(), true, "Subsequent keypress default is also prevented" );
 });
 
+module( "Filterable backwards compatibility" );
+
 asyncTest( "Working filterable is instantiated on dynamic listview when data-filter='true'", function() {
 	var list = $( "<ul data-nstest-filter='true'><li>Chicago</li><li>Berlin</li><li>Windsor</li></ul>" )
 			.appendTo( "#content" )
@@ -61,4 +63,12 @@ asyncTest( "Working filterable is instantiated on dynamic listview when data-fil
 	}, 500 );
 });
 
+test( "Refreshing the listview also refreshes the filterable", function() {
+	var listview = $( "#listview-refresh-refreshes-filterable" );
+
+	listview.append( "<li>Item 3</li><li>Item 4</li><li>Item 5</li>" ).listview( "refresh" );
+	deepEqual( listview.children( ".ui-screen-hidden" ).length, 5,
+		"All list items are hidden after listview refresh" );
+});
+
 })( jQuery );

tests/unit/filterable/index.html

@@ -65,6 +65,11 @@
 				<li>Test 2</li>
 				<li>Test 3</li>
 			</ul>
+
+			<ul id="listview-refresh-refreshes-filterable" data-nstest-filter="true" data-nstest-filter-reveal="true" data-nstest-role="listview">
+				<li>Item 1</li>
+				<li>Item 2</li>
+			</ul>
 		</div>
 	</div>
 </body>