- #19: The options as they are at the time of making the request are …

…now used, rather than those at the time of sending the request. This in order to prevent timing issues that occur when an older request is returned before the new request is sent.

CHANGELOG.md

@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+## [2.2.2] - 2018-06-25
+### Fixed
+- \#19: The options as they are at the time of making the request are now used, rather than those at the time of sending the request. This in order to prevent timing issues that occur when an older request is returned before the new request is sent.
+
 ## [2.2.1] - 2018-05-03
 ### Fixed
 - \#17: Fixed `postData` and `ajaxSettings` defaults being overwritten when a request is made.

dist/jquery.mobile.lazyloader.js

@@ -288,7 +288,7 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
           $( options.$progress ).show();
 
           // Load more items
-          self._sendRequest( reset );
+          self._sendRequest( options, reset );
         } else {
 
           // Indicate a request can be made by an event handler again
@@ -304,12 +304,12 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
 
   /**
    * Creates and sends the request.
+   * @param {{}} options The options used at the time the request was made.
    * @param {boolean} [reset=false] Indicates the request is a reset request.
    * @private
    */
-  _sendRequest: function( reset ) {
+  _sendRequest: function( options, reset ) {
     var self = this,
-      options = self.options,
       jqXHR = self.jqXHR;
 
     if ( jqXHR ) {
@@ -378,6 +378,7 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
 
     // It's possible a request added list items while this request was underway
     if ( reset ) {
+      options.retrieved = 0;
       $element.empty();
     }
 

src/lazyloader.js

@@ -185,7 +185,7 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
           $( options.$progress ).show();
 
           // Load more items
-          self._sendRequest( reset );
+          self._sendRequest( options, reset );
         } else {
 
           // Indicate a request can be made by an event handler again
@@ -201,12 +201,12 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
 
   /**
    * Creates and sends the request.
+   * @param {{}} options The options used at the time the request was made.
    * @param {boolean} [reset=false] Indicates the request is a reset request.
    * @private
    */
-  _sendRequest: function( reset ) {
+  _sendRequest: function( options, reset ) {
     var self = this,
-      options = self.options,
       jqXHR = self.jqXHR;
 
     if ( jqXHR ) {
@@ -275,6 +275,7 @@ $.widget( "mobile." + widgetName, $.mobile.listview, {
 
     // It's possible a request added list items while this request was underway
     if ( reset ) {
+      options.retrieved = 0;
       $element.empty();
     }
 

test/jquery.mobile.lazyloaderTest.js

@@ -436,6 +436,7 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
       var existingItem = { name: "Jill" };
       var items = [ { name: "John" }, { name: "Jane" } ];
       var itemsWithExistingItem = $.merge( [ existingItem ], items );
+      var retrieved = 30;
 
       var provider = {
         // eslint-disable-next-line max-len
@@ -447,7 +448,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: false,
-          expectedListItems: itemsWithExistingItem
+          expectedListItems: itemsWithExistingItem,
+          expectedRetrieved: retrieved
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr less than requested item nr and list higher than window. Reset is set to false": {
@@ -458,7 +460,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: false,
-          expectedListItems: itemsWithExistingItem
+          expectedListItems: itemsWithExistingItem,
+          expectedRetrieved: retrieved
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr equal to requested item nr and list smaller than window. Reset is set to false": {
@@ -469,7 +472,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: true,
           assertDoneLoading: false,
           reset: false,
-          expectedListItems: itemsWithExistingItem
+          expectedListItems: itemsWithExistingItem,
+          expectedRetrieved: retrieved
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr equal to requested item nr and list higher than window. Reset is set to false": {
@@ -480,7 +484,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: false,
-          expectedListItems: itemsWithExistingItem
+          expectedListItems: itemsWithExistingItem,
+          expectedRetrieved: retrieved
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr less than requested item nr and list smaller than window. Reset is set to true": {
@@ -491,7 +496,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: true,
-          expectedListItems: items
+          expectedListItems: items,
+          expectedRetrieved: 0
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr less than requested item nr and list higher than window. Reset is set to true": {
@@ -502,7 +508,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: true,
-          expectedListItems: items
+          expectedListItems: items,
+          expectedRetrieved: 0
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr equal to requested item nr and list smaller than window. Reset is set to true": {
@@ -513,7 +520,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: true,
           assertDoneLoading: false,
           reset: true,
-          expectedListItems: items
+          expectedListItems: items,
+          expectedRetrieved: 0
         },
         // eslint-disable-next-line max-len
         "Retrieved item nr equal to requested item nr and list higher than window. Reset is set to true": {
@@ -524,7 +532,8 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
           assertLoadIsCalledAgain: false,
           assertDoneLoading: true,
           reset: true,
-          expectedListItems: items
+          expectedListItems: items,
+          expectedRetrieved: 0
         }
       };
 
@@ -545,7 +554,6 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
               url = "http://localhost:3000",
               templateId = "user",
               $progress = this.$progress,
-              retrieved = 30,
               retrieve = testData.retrieve,
               eventTimeout = 200,
               postData = { additionalData: "hello" },
@@ -636,7 +644,7 @@ QUnit.module( "jquery.mobile.lazyloader Test", {
               assert.equal( $( $listItems.get( i ) ).html(), testData.expectedListItems[ i ].name );
             }
 
-            assert.equal( data.options.retrieved, retrieved + items.length );
+            assert.equal( data.options.retrieved, testData.expectedRetrieved + items.length );
             assert.equal( doneloadingSpy.calledOnce, testData.assertDoneLoading );
             assert.ok( beforerenderSpy.calledWithExactly( sinon.match.object, items ) );