Fix #43 model missing when adding model array to current page under client mode

Author: wyuenho

lib/backbone-pageable.js

@@ -404,29 +404,34 @@
         var pageStart = currentPage * pageSize, pageEnd = pageStart + pageSize;
 
         if (event == "add") {
-          var fullIndex, addAt, colToAdd, options = options || {};
+          var pageIndex, fullIndex, addAt, colToAdd, options = options || {};
           if (collection == fullCol) {
             fullIndex = fullCol.indexOf(model);
             if (fullIndex >= pageStart && fullIndex < pageEnd) {
               colToAdd = pageCol;
-              addAt = fullIndex - pageStart;
+              pageIndex = addAt = fullIndex - pageStart;
             }
           }
           else {
-            fullIndex = pageStart + pageCol.indexOf(model);
+            pageIndex = pageCol.indexOf(model);
+            fullIndex = pageStart + pageIndex;
             colToAdd = fullCol;
-            var addAt = options && !_.isUndefined(options.at) ?
+            var addAt = !_isUndefined(options.at) ?
               options.at + pageStart :
               fullIndex;
           }
 
-
           ++state.totalRecords;
           pageCol.state = pageCol._checkState(state);
 
           if (colToAdd) {
             colToAdd.add(model, _extend({}, options || {}, {at: addAt}));
-            if (pageCol.length > pageSize) {
+            var modelToRemove = pageIndex >= pageSize ?
+              model :
+              !_isUndefined(options.at) && addAt < pageEnd && pageCol.length > pageSize ?
+              pageCol.at(pageSize) :
+              null;
+            if (modelToRemove) {
               var addHandlers = collection._events.add,
               popOptions = {onAdd: true};
               if (addHandlers.length) {
@@ -435,14 +440,14 @@
                 lastAddHandler.callback = function () {
                   try {
                     oldCallback.apply(this, arguments);
-                    pageCol.pop(popOptions);
+                    pageCol.remove(modelToRemove, popOptions);
                   }
                   finally {
                     lastAddHandler.callback = oldCallback;
                   }
                 };
               }
-              else pageCol.pop(popOptions);
+              else pageCol.remove(modelToRemove, popOptions);
             }
           }
         }
@@ -923,7 +928,7 @@
       if (qs = (qsi = last.indexOf('?')) ? last.slice(qsi + 1) : '') {
         var params = queryStringToParams(qs);
 
-        var state = _.clone(self.state);
+        var state = _clone(self.state);
         var queryParams = self.queryParams;
         var pageSize = state.pageSize;
 

test/client-pageable.js

@@ -122,7 +122,7 @@ $(document).ready(function () {
     strictEqual(col.fullCollection.at(2).get("name"), "c");
   });
 
-  test("add", 41, function () {
+  test("add", 49, function () {
     var col = new Backbone.PageableCollection(models, {
       state: {
         pageSize: 2
@@ -190,6 +190,23 @@ $(document).ready(function () {
     col.fullCollection.reset();
     lastTotalRecords = col.state.totalRecords;
     col.add(new Backbone.Model({name: "a"}));
+
+    // test ability to add an array of models
+    col.off("add", onAdd);
+    col.fullCollection.off("add", onAdd);
+    col.fullCollection.reset();
+    col.add([{name: "a"}, {name: "c"}, {name: "b"}]);
+    strictEqual(col.size(), 2);
+    strictEqual(col.fullCollection.size(), 3);
+    deepEqual(col.toJSON(), [{name: "a"}, {name: "c"}]);
+    deepEqual(col.fullCollection.toJSON(), [{name: "a"}, {name: "c"}, {name: "b"}]);
+
+    col.fullCollection.reset();
+    col.fullCollection.add([{name: "a"}, {name: "c"}, {name: "b"}]);
+    strictEqual(col.size(), 2);
+    strictEqual(col.fullCollection.size(), 3);
+    deepEqual(col.toJSON(), [{name: "a"}, {name: "c"}]);
+    deepEqual(col.fullCollection.toJSON(), [{name: "a"}, {name: "c"}, {name: "b"}]);
   });
 
   test("remove", 46, function () {