append/prepend clipping tests

Author: dhilt

demo/adapterSync/adapterSync.js

@@ -7,7 +7,7 @@ app.factory('Server', [
 
       firstIndex: 1,
 
-      lastIndex: 90,
+      lastIndex: 40,
 
       delay: 100,
 
@@ -113,7 +113,7 @@ app.controller('mainController', [
       get: function (index, count, success) {
         console.log('request by index = ' + index + ', count = ' + count);
         Server.request(index, count).then(function (result) {
-          if (result.items.length) {
+          if (result.items) {
             console.log('resolved ' + result.items.length + ' items');
           }
           success(result.items);

demo/remote/remote.js

@@ -23,10 +23,6 @@ angular.module('application', ['ui.scroll'])
         }
       },
 
-      getFirst: function() {
-        return this.first;
-      },
-
       request: function(index, count) {
         var self = this;
         var deferred = $q.defer();

test/AdapterTestsSpec.js

@@ -1185,4 +1185,70 @@ describe('uiScroll', function () {
 
   });
 
+  describe('adapter append/prepend clipping', function () {
+    var scrollSettings = {datasource: 'myOnePageDatasource', adapter: 'adapter', viewportHeight: 60, itemHeight: 20, bufferSize: 3, padding: 1};
+
+    it('should not clip after 1 small pack appended', function () {
+      runTest(scrollSettings,
+        function (viewport, scope) {
+
+          expect(scope.adapter.isEOF()).toBe(true);
+          scope.adapter.append(['item1*', 'item2*', 'item3*']);
+
+          expect(scope.adapter.isEOF()).toBe(true);
+          expect(viewport.children().length).toBe(2 + 3 + 3);
+          var lastRow = viewport.children()[viewport.children().length - 2];
+          expect(lastRow.innerHTML).toBe('6: item3*');
+        }
+      );
+    });
+
+    it('should clip 1 bottom item from the 1 big pack appended', function () {
+      runTest(scrollSettings,
+        function (viewport, scope) {
+
+          expect(scope.adapter.isEOF()).toBe(true);
+          scope.adapter.append(['item1*', 'item2*', 'item3*', 'item4*']);
+
+          expect(scope.adapter.isEOF()).toBe(false);
+
+          viewport.scrollTop(10000);
+          viewport.trigger('scroll');
+
+          expect(scope.adapter.isEOF()).toBe(true);
+
+          expect(viewport.children().length).toBe(2 + 3 + 3);
+          var lastRow = viewport.children()[viewport.children().length - 2];
+          expect(lastRow.innerHTML).toBe('6: item3*');
+        }
+      );
+    });
+
+    it('should clip 1 pack from top after 3 packs appended', function () {
+      runTest(scrollSettings,
+        function (viewport, scope) {
+
+          scope.adapter.append(['item1*', 'item2*', 'item3*', 'item4*']);
+          expect(viewport.children().length).toBe(2 + 3 + 3);
+          viewport.scrollTop(3 * 20);
+          viewport.trigger('scroll');
+
+          scope.adapter.append(['item4*', 'item5*', 'item6*', 'item7*']);
+          expect(viewport.children().length).toBe(2 + 3 + 3 + 3);
+          viewport.scrollTop(3 * 20 * 2);
+          viewport.trigger('scroll');
+
+          scope.adapter.append(['item7*', 'item8*', 'item9*', 'item10*']);
+          expect(viewport.children().length).toBe(2 + 3 + 3 + 3);
+
+          var firstRow = viewport.children()[1];
+          expect(firstRow.innerHTML).toBe('4: item1*');
+          var lastRow = viewport.children()[viewport.children().length - 2];
+          expect(lastRow.innerHTML).toBe('12: item9*');
+        }
+      );
+    });
+
+  });
+
 });

test/scaffolding.js

@@ -1,7 +1,8 @@
 function createHtml (settings) {
 	var viewportStyle = ' style="height:' + (settings.viewportHeight || 200) + 'px"';
 	var itemStyle = settings.itemHeight ? ' style="height:' + settings.itemHeight + 'px"' : '';
-	var bufferSize = settings.bufferSize ? ' buffer-size="' + settings.bufferSize + '"' : '';
+  var bufferSize = settings.bufferSize ? ' buffer-size="' + settings.bufferSize + '"' : '';
+	var padding = settings.padding ? ' padding="' + settings.padding + '"' : '';
 	var isLoading = settings.isLoading ? ' is-loading="' + settings.isLoading + '"' : '';
 	var topVisible = settings.topVisible ? ' top-visible="' + settings.topVisible + '"' : '';
 	var disabled = settings.disabled ? ' disabled="' + settings.disabled + '"' : '';
@@ -11,7 +12,7 @@ function createHtml (settings) {
 		(settings.wrapper ? settings.wrapper.start : '') +
 		'<div ui-scroll="item in ' + settings.datasource + '"' +
 		adapter +
-		itemStyle + bufferSize + isLoading + topVisible + disabled + '>' +
+		itemStyle + bufferSize + padding + isLoading + topVisible + disabled + '>' +
 		template +
 		'</div>' +
 		(settings.wrapper ? settings.wrapper.end : '') +