Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

bug: card with button directive in infinite scroll page lags scroll up on ios

See original GitHub issue

Bug Report

Ionic version:

[x] 5.x

Current behavior:

scrolling a page with multiple loaded cards with button directives inside a infinite scroll page has a janky scroll up animation on iOS . it feels like it jumps immediatly to the first element again.

Expected behavior:

scrolling should be smooth.

Steps to reproduce:

scroll to the top of the page. then continue to scroll up (as if you would try to reload the page).

Other information:

only on iOS devices with a bundled/served app (not in browser environment)

Ionic info:

Ionic:

   Ionic CLI                     : 5.4.16
   Ionic Framework               : @ionic/angular 5.0.4
   @angular-devkit/build-angular : 0.900.5
   @angular-devkit/schematics    : 9.0.5
   @angular/cli                  : 9.0.5
   @ionic/angular-toolkit        : 2.2.0

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : ios 5.1.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 20 other plugins)

Utility:

   cordova-res                          : not installed
   native-run (update available: 0.3.0) : 0.2.9

System:

   ios-deploy : 1.9.4
   ios-sim    : 8.0.2
   NodeJS     : v10.16.3 (/usr/local/bin/node)
   npm        : 6.14.2
   OS         : macOS Catalina
   Xcode      : Xcode 11.3.1 Build version 11C504

Issue Analytics

State:
Created 3 years ago
Comments:7 (6 by maintainers)

Top GitHub Comments

1reaction

liamdebeasicommented, Apr 3, 2020

Thanks for the follow up. Yeah, I’ve seen this behavior before. I think it is a bug in WebKit when using transitions (in this case the card button) and rubber band scrolling.

I will see if there is an open WebKit bug/a workaround.

0reactions

ionitron-bot[bot]commented, May 7, 2020

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. 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.

Top Results From Across the Web

bug: card with button directive in infinite scroll page ... - GitHub

Current behavior: scrolling a page with multiple loaded cards with button directives inside a infinite scroll page has a janky scroll up ......

iPad Safari scrolling causes HTML elements to disappear and ...

I'm running into a problem wherein large scroll areas cause the elements that are offscreen to appear after a delay when I scroll...

Infinite Scrolling in Angular - OpenReplay Blog

When the user scrolls 90% of the way down the page, onScroll() will be called if [infiniteScrollDistance] is set to 1. · If...

[iOS 16.2 Dev B3] Lag when scrolling bug is fixed ... - Reddit

[iOS 16.2 Dev B3] Lag when scrolling bug is fixed ! The animations when changing home page, exiting an app or just scrolling...

Scrolling | Angular Material

The cdkScrollable directive and the ScrollDispatcher service together allow components to react to scrolling in any of its ancestor scrolling containers.