Ionic-framework: InfiniteScroll top on WKWebView firing two times

[bartcich]

Ionic version: (check one with "x")
[ ] 1.x
[ ] 2.x
[x] 3.x

I'm submitting a ... (check one with "x")
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
When using infiniteScroll with position top it's firing two times. This happens only on WKWebView. On UIWebView it works quite ok. On Android, Desktop Chrome etc. it works fine.

Probably the problem is with new scroll position not being set after new items are added on top of previous.

Interesting thing is, that the problem happens only when user scrolls. When scrolling by scrollToTop everything works fine.

Expected behavior:
InifinteScroll should fire only once and update scroll position.

Steps to reproduce:
You can check simple repo here: https://github.com/bartcich/infinitescroll-wkwebview
Here is the video showing double infinite scroll firing: https://gfycat.com/PleasingShinyAmoeba

Related code:

Other information:
Probably it's connected with this issue:
https://github.com/driftyco/cordova-plugin-wkwebview-engine/issues/92

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

Your system information:

 ordova CLI: 6.5.0
Ionic Framework Version: 3.1.1
Ionic CLI Version: 2.2.3
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.7
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v7.5.0
Xcode version: Not installed

[danielehrhardt]

Same here.

[Manduro]

This happens on WKWebView as well as Mobile Safari (maybe unsurprisingly). So it does not appear to be related to the WK Cordova plugin itself, but rather an odd scroll issue on iOS.

It is definitely working correctly when the new content arrives after the user's scrolling has stopped. But it fails to set a new scroll position when the user is still scrolling (or still on momentum). I'm afraid this seems to be a limitation and very hard to fix.

(This line fails: https://github.com/driftyco/ionic/blob/261bc4d5f48c7b547798b427e7376d67ae32995b/src/components/infinite-scroll/infinite-scroll.ts#L337)

It is possible to wait with setting the scroll position until scrolling stops, but meanwhile the UI has already been updated. This causes a short flicker of the new content until it bounces back when scrolling stops and the new scroll position is set.

@manucorporat Reproducible by running gulp e2e.watch --f=infinite-scroll/position-top in the iOS simulator's Safari. Sorry for this :/. Any ideas?

[sdasari2]

+1

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to inactivity. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!