ionic-framework: bug: When page scroll content isn't longer than screen on Android, ion-refresher is laggy as hell

Bug Report

Ionic version: [x] 5.x

Current behavior: If your page is shorter than the height of the screen on Android, resulting in no scrollbar needed, the ion-refresher animation laggy as hell.

This is not an issue in the browser or iOS.

Expected behavior: Smooth pull to refresh regardless of page scroll content on Android.

Steps to reproduce: Make a blank page (or just a navbar) with an ion-refresher, run on android device.

Related code:

e.g:

<ion-header>
  <ion-toolbar>
    <ion-title>
      My app
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-refresher slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-refresher-content></ion-refresher-content>
  </ion-refresher>

    <ion-card class="welcome-card">
      <ion-card-header>
        <ion-card-title>Welcome to Ionic</ion-card-title>
      </ion-card-header>
      <ion-card-content>
        <p>Whatever</p>
      </ion-card-content>
    </ion-card>
    
</ion-content>

Download the zip here: https://github.com/daveshirman/IonicRefresherBug This does not happen on desktop. Just Android

Other information: Testing on Android 7+

Ionic info:

Ionic:

   Ionic CLI                     : 6.11.7 (/Users/daveshirman/.nvm/versions/node/v13.12.0/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.1.1
   @angular-devkit/build-angular : 0.801.3
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.1.3
   @ionic/angular-toolkit        : 2.2.0

Cordova:

   Cordova CLI       : 10.0.0
   Cordova Platforms : android 9.0.0, ios 6.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 5.0.0, (and 16 other plugins)

Utility:

   cordova-res (update available: 0.15.1) : 0.11.0
   native-run (update available: 1.0.0)   : 0.2.8

System:

   ios-deploy : 1.10.0
   ios-sim    : 8.0.2
   NodeJS     : v13.12.0 (/Users/daveshirman/.nvm/versions/node/v13.12.0/bin/node)
   npm        : 6.14.8
   OS         : macOS Mojave
   Xcode      : Xcode 11.3.1 Build version 11C504

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 4
Comments: 33 (15 by maintainers)

Most upvoted comments

Hey there,

I wanted to provide an update. The Chromium team has prepared a fix for this (https://bugs.chromium.org/p/chromium/issues/detail?id=1123304), and the fix has landed in Chrome Canary. I have tested and verified that this change does indeed fix the issue reported here.

Assuming others on the thread do not find any major issues, this fix will ship in an upcoming version of Chrome (I am guessing v86 or v87).

liamdebeasi on Sep 25, 2020

Hey there,

The Chromium fix has shipped as part of Chrome v86. If your device has not already done so, I recommend updating Chrome for Android to this version. Thanks!

liamdebeasi on Oct 7, 2020

It looks like this is a regression in Chrome 84/85. Other users have already filed an issue, so hopefully it will be resolved soon. Passive touch events appear to be heavily throttled in the latest release; however, it does not appear to happen when developer tools are open.

I have followed up on the thread to provide any additional assistance I can: https://bugs.chromium.org/p/chromium/issues/detail?id=1123304.

I am going to close this issue as this is not a bug in Ionic Framework, but I will follow up here when this issue has been resolved on the Chromium end. Thanks for all the help debugging this!

liamdebeasi on Sep 3, 2020