Background content scrolls even if pop over is open in iOS devices

[anjanapai2508]

Bug Report

Ionic Info

Describe the Bug
I am trying to use a classic pop over controller in my ionic 3 app, by default I expect that the background will be frozen when the pop over is visible, but I am still able to scroll through the content. This happens only on iOS devices, while on chrome, safari and android devices the background is frozen.

Steps to Reproduce
Steps to reproduce the behavior:
Please note that I am not using cordova to run my app on the device since my team has decided against it for reasons not known to me, so I run the app using ionic serve and in a xcode project I load the url in a webview. I play the app on my device using xcode or by creating a .ipa file.
Please see the issue isolated into a sample application kept at https://github.com/anjanapai2508/Ionic3DropDownTesting.git
You will find :

1. Sample ionic 3 app which has only one page, the page content is multiple images which can be scrolled through. It has a menu button at the top which is supposed to open up a drop down window. All of the app works fine. I have styled the backdrop with a color of red just to clearly display that the backdrop appears.
2. My xcode project : this has a simple view controller which contains a full screen web view and is supposed to load the url served by the node js server which is my ionic app.
3. A video recording of the bug - you will see that I can scroll through the background images even though my drop down is still there.

Expected Behavior
Expect the background to be frozen until the drop down is closed

Please let me know if you need any more information. Thanks.

[lucashsilva]

It seems you have the same problem that is related here: ionic-team/ionic#6980. If you're not using the WKWebView plugin, I would recommend you to install it. I had the same issue and using WKWebView instead of UIWebView solved it.

[anjanapai2508]

@lucashsilva : Thanks for that but we are not using cordova in our app, is there no way to solve this other than using this plugin?

[lucashsilva]

@anjanapai2508 I haven't had success with any other solution :/

[ilyalukyanov]

I installed the WKWebView plugin, but it didn't fix the issue for me fully. It fixed the scrolling problem for AlertController, but did nothing for ModalController, which is of much higher importance for our application.

The only things I've not tried are solutions from #6980 or Riron/ionic-img-viewer#99 . Highly likely they'll do the trick, but they are hacks so I'd strongly prefer this to work out of the box.

[ionitron-bot]

This issue has been automatically identified as an Ionic 3 issue. We recently moved Ionic 3 to its own repository. I am moving this issue to the repository for Ionic 3. Please track this issue over there.

If I've made a mistake, and if this issue is still relevant to Ionic 4, please let the Ionic Framework team know!

Thank you for using Ionic!

[ionitron-bot]

Issue moved to: ionic-team/ionic-v3#362