🐞 stop prefilling on last or error

🛠 checkLastPage on append ✅ add test for prefilling on error Ref #690
metafizzy · Jul 19, 2017 · 0071b1e · 0071b1e
1 parent ae3dd2c
commit 0071b1e
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 5 deletions.
diff --git a/js/page-load.js b/js/page-load.js
@@ -37,6 +37,7 @@ InfiniteScroll.defaults.responseType = 'document';
 InfiniteScroll.create.pageLoad = function() {
   this.canLoad = true;
   this.on( 'scrollThreshold', this.onScrollThresholdLoad );
+  this.on( 'append', this.checkLastPage );
   if ( this.options.outlayer ) {
     this.on( 'append', this.onAppendOutlayer );
   }
@@ -94,7 +95,6 @@ proto.appendNextPage = function( response, path ) {
     this.appendItems( items, fragment );
     this.isLoading = false;
     this.dispatchEvent( 'append', null, [ response, path, items ] );
-    this.checkLastPage( response, path );
   }.bind( this );
 
   // TODO add hook for option to trigger appendReady
@@ -229,6 +229,8 @@ InfiniteScroll.create.prefill = function() {
   this.updateScroller();
   this.isPrefilling = true;
   this.on( 'append', this.prefill );
+  this.once( 'error', this.stopPrefill );
+  this.once( 'last', this.stopPrefill );
   this.prefill();
 };
 
@@ -239,7 +241,7 @@ proto.prefill = function() {
     this.log('prefill');
     this.loadNextPage();
   } else {
-    this.off( 'append', this.prefill );
+    this.stopPrefill();
   }
 };
 
@@ -252,6 +254,11 @@ proto.getPrefillDistance = function() {
   return this.windowHeight - this.element.clientHeight;
 };
 
+proto.stopPrefill = function() {
+  console.log('stopping prefill');
+  this.off( 'append', this.prefill );
+};
+
 // -------------------------- request -------------------------- //
 
 function request( url, responseType, onLoad, onError ) {

diff --git a/test/index.html b/test/index.html
@@ -35,6 +35,7 @@
   <script src="unit/check-last-page.js"></script>
   <script src="unit/prefill-window.js"></script>
   <script src="unit/prefill-element.js"></script>
+  <script src="unit/prefill-element-last.js"></script>
   <script src="unit/scroll-watch-window.js"></script>
   <script src="unit/scroll-watch-element.js"></script>
   <script src="unit/history-window.js"></script>
@@ -87,6 +88,10 @@ <h2>prefill, element</h2>
     <div class="demo demo--prefill-element demo--big-posts">
     </div>
 
+    <h2>prefill, element, last</h2>
+    <div class="demo demo--prefill-element-last demo--big-posts">
+    </div>
+
     <h2>scroll watch window</h2>
     <div class="demo demo--scroll-watch-window"></div>
 

diff --git a/test/unit/check-last-page.js b/test/unit/check-last-page.js
@@ -41,7 +41,7 @@ QUnit.test( 'checkLastPage', function( assert ) {
     infScroll.destroy();
     infScroll = new InfiniteScroll( '.demo--check-last-page', {
       path: 'page/{{#}}.html',
-      checkLastPage: '.next-page-link',
+      checkLastPage: '.check-last-page-next-link',
       append: '.post',
       scrollThreshold: false,
       history: false,
@@ -79,8 +79,8 @@ QUnit.test( 'checkLastPage', function( assert ) {
     infScroll = new InfiniteScroll( '.demo--check-last-page', {
       // provide only page/2.html, then falsy
       path: function() {
-        if ( this.loadCount === 0 ) {
-          var nextIndex = this.loadCount + 2;
+        if ( this.pageIndex < 3 ) {
+          var nextIndex = this.pageIndex + 1;
           return 'page/' + nextIndex + '.html';
         }
       },

diff --git a/test/unit/prefill-element-last.js b/test/unit/prefill-element-last.js
@@ -0,0 +1,37 @@
+QUnit.test( 'prefill element last', function( assert ) {
+
+  // expected load count, each post is 200px tall
+  var expLoadCount = 2;
+
+  var done = assert.async( expLoadCount );
+
+  var infScroll = new InfiniteScroll( '.demo--prefill-element-last', {
+    path: function() {
+      return this.loadCount < 2 ? 'page/prefill.html' : false;
+    },
+    append: '.post',
+    prefill: true,
+    elementScroll: true,
+    history: false,
+    scrollThreshold: false,
+    debug: true,
+    onInit: function() {
+      this.on( 'append', onAppend );
+      this.on( 'error', onError );
+    },
+  });
+
+  function onAppend() {
+    assert.ok( true, 'prefill element appended post ' + infScroll.loadCount );
+    if ( infScroll.loadCount == expLoadCount ) {
+      assert.equal( infScroll.loadCount, expLoadCount,
+        expLoadCount + ' pages appended' );
+    }
+    done();
+  }
+
+  function onError() {
+    assert.ok( false, 'error should not trigger' );
+  }
+
+});