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.

[4.0.0-rc.0] Scroll Bug in Safari

See original GitHub issue

[x] bug report [ ] feature request

Current behavior: <ion-tabs> sometimes got scrolled when <ion-content> is scrolling, resulting

Expected behavior: Scroll should be just inside the <ion-content>

Steps to reproduce:

create project using tab-layout starter
create scrolling content on one tab
open ionic using safari

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.6.0 (C:\Users\kmzin\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.0.0-rc.0
   @angular-devkit/build-angular : 0.11.4
   @angular-devkit/schematics    : 7.1.4
   @angular/cli                  : 7.1.4
   @ionic/angular-toolkit        : 1.2.2

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : not available
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.1, (and 6 other plugins)

System:

   Android SDK Tools : 26.1.1 (D:\MyProgram\Android\SDK)
   NodeJS            : v10.13.0 (C:\Program Files\nodejs\node.exe)
   npm               : 6.4.1
   OS                : Windows 10

Issue Analytics

State:
Created 5 years ago
Comments:13 (4 by maintainers)

Top GitHub Comments

4reactions

qrcodemonkeycommented, Apr 26, 2019

I am working on a PWA and also do have the freezing scroll issue on iOS (Android works fine). It mostly happens when I scroll a list. I can always replicate this behaviour when I start touching the ion-header and move down my fingers to the ion-content area to scroll up a list (tested on iOS 12.2 with an iPhone 6). I also tested this behaviour with the official conference example app and had the same problem: https://github.com/ionic-team/ionic-conference-app#progressive-web-app

This is currently a big problem to release a PWA for iOS because it will end up in bad usability and frustrated users.

1reaction

bitflowercommented, Mar 28, 2019

If you go to https://docs.deckdeckgo.com/docs on an iPhone you can see the effect too. Thanks for the hint @peterpeterparker

Top Results From Across the Web

[4.0.0-rc.0] Scroll Bug in Safari · Issue #16929 - GitHub

[x] bug report [ ] feature request. Current behavior: sometimes got scrolled when <ion-content> is scrolling, resulting. Expected behavior:

Scrolling Issues on Safari/Chrome iOS - Apple Developer

Hi, I'm having issues with scrolling on iOS (web). I have a web app that when you click on different pill shaped menus...

Releases - Vue Final Modal

4.0.0-rc.0 (2022-11-01). vue-final-modal 4.0 introduced a lot of breaking changes. You should treat 4.x as a different library and read the documentation ...

After 4.0.2 Update - Scrolling Not Working in Safari. Please Help

Same issue for us: Safari with new version 4.0.2 wont scroll: Turned off WP rocket css Minification and the site works fine. Turned...

How to disable web page's default scroll effect on iOS' Safari?

The problem with your code is document.addEventListener . Adding a event listener to the whole document will get you into trouble as you...