Ionic Infinite Scroll position top very buggy in ios

[yaozuwang]

Ionic version: (check one with "x")
(For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 2.x
[x] 3.x
[ ] 4.x

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request

Please do not submit support requests or "How to" questions here. Instead, please use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:

When i infinite scroll up, it infinite scroll many times if the user scrolls too fast upwards. If i disable infinite scroll, the ion-scroll-content will be set the enabled instead of disabled and this leaves a margin of height 84px.

Expected behavior:

Infinite scroll up should not executes many times regardless of how fast the user is scrolling. it shouldn't leave a enabled state after enabled is false.

Steps to reproduce:

Related code:

https://github.com/yaozuwang/InfiniteScroll-Test

  <ion-infinite-scroll position="top" threshold="1%" (ionInfinite)="doInfinite($event)">
    <ion-infinite-scroll-content loadingSpinner="bubbles">
    </ion-infinite-scroll-content>
  </ion-infinite-scroll>

Other information:

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

cli packages: (C:\Users\Admin\AppData\Roaming\npm\node_modules)

    @ionic/cli-utils  : 1.9.2
    ionic (Ionic CLI) : 3.9.2

global packages:

    Cordova CLI : 7.0.1

local packages:

    @ionic/app-scripts : 2.1.4
    Cordova Platforms  : android 6.2.2 browser 4.1.0 ios 4.4.0
    Ionic Framework    : ionic-angular 3.6.0

System:

    Node : v6.7.0
    npm  : 3.10.3
    OS   : Windows 10

[kensodemann]

Hello! Thank you for opening an issue with us! Would you be able to provide a sample application via GitHub that demonstrates the issue you are having? Thanks for using Ionic!

[yaozuwang]

Infnite scrolling many times issue happens on IOS, i haven't test this on android yet. But enabled/disabled state issue happens in a browser too, i'll create a repo to demonstrate the problem. There's another similar issue #10889 , it was marked as closed but i don't see a fix?

[yaozuwang]

Here i just added a repo to demonstrate the problem, what you have to do is infinite scroll up until state is disabled, now just resize the browser a little bit and the state will change to enabled but you won't be able to infinite scroll, this leaves a margin of 84px on the top.

Now with IOS, it just happens by itself. Either way, when you resize the browser, the state shouldn't be enabled, and i think this is related to the problem i face on IOS, maybe my content in IOS "changes" which is triggers it.

[kensodemann]

Can you please link the repo here?

[yaozuwang]

@kensodemann Yea, sorry, i linked it in the original answer https://github.com/yaozuwang/InfiniteScroll-Test

[zhouyu1993]

I face the same problem, I just set default options or set the threshold, I find the scrollFun works not at the threshold。

<ion-infinite-scroll (ionInfinite)="scrollFun($event)">
    <ion-list>
      <ion-item *ngFor="let value of list">
        {{value}}
      </ion-item>
    </ion-list>
    <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="loading..."></ion-infinite-scroll-content>
  </ion-infinite-scroll>

async scrollFun (infiniteScroll) {
    if (this.curpage > 0 && !this.loading) {
      this.loading = true
      await this.getSearch()
      this.loading = false
      infiniteScroll.complete()
    } else {
      infiniteScroll.enable(false)
    }
  }

[yaozuwang]

I know this is still an open issue, but not sure if there's any progress regrarding this?

[yaozuwang]

So no update still...?? How does everyone get chatting app working without this working properly?

[manuelnaturalcycles]

i think ionic team is focusing on stencil and virtual scroll, infinite scroll and the such have been pretty much abandoned. not even the refresher works like it did in ionic 1.

[dimitri320]

Virtual scroll is a performance enhancement, not a substitute for infinite scroll. I've got 1000's of items to load, virtual scroll would crash the app, even if it didn't render the whole list. We still need Infinite Scroll to work properly.

[grayboy]

how can fix this issues

[davidst2017]

Hi guys,

Any updates here??? I'm right now facing the same problem. Did anyone come up with a workaround for that?