Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ios): fix keyboard displacement bug in iOS 12 WKWebView #201

Merged
merged 4 commits into from
Nov 21, 2018
Merged

fix(ios): fix keyboard displacement bug in iOS 12 WKWebView #201

merged 4 commits into from
Nov 21, 2018

Conversation

booleanbetrayal
Copy link
Contributor

Fixes #176

credit: @KhanhPhamDinh

@booleanbetrayal
Copy link
Contributor Author

I'm seeing a "bounce" effect when completing a particular input and then programmatically focusing the next. This might need to be de-bounced or handled with some better state handling for that use-case.

@booleanbetrayal
Copy link
Contributor Author

Worked in the timer debounce support for the programmatic input-focus issue (which caused a visual "bouncing" during an unnecessary contentOffset adjustment).

@KhanhPhamDinh - you might want to take a look to see how this differs from your original implementation.

@KhanhPhamDinh
Copy link

Worked in the timer debounce support for the programmatic input-focus issue (which caused a visual "bouncing" during an unnecessary contentOffset adjustment).

@KhanhPhamDinh - you might want to take a look to see how this differs from your original implementation.

Your welcome, @booleanbetrayal.

@booleanbetrayal
Copy link
Contributor Author

Any change on getting this merged @dwieeb / @nphyatt?

There is a good explanation of the issue in apache/cordova-ios#417 prior to realizing this was an Apple WKWebView issue we'd need to work around.

Thanks!

@ravron
Copy link

ravron commented Oct 29, 2018

Note that there's detailed information on this WKWebView bug at this Open Radar ticket.

@simtechpom
Copy link

simtechpom commented Nov 1, 2018

@booleanbetrayal using this fork did solve the viewport problem in iOS.

But convertFileSrc() has undefined error in android application. If I switch back to master branch of the WKWEBVIEW, convertFileSrc() works fine in android.

@booleanbetrayal
Copy link
Contributor Author

@simtechpom - perhaps a discrepancy between when I forked this repo and what master is at now. Out of scope from this changeset. All the more reason to get this merged!

dpa99c added a commit to dpa99c/cordova-plugin-ionic-webview that referenced this pull request Nov 9, 2018
@Vivek-abstract
Copy link

Vivek-abstract commented Nov 11, 2018

Please merge this. I'm facing issues with the keyboard. Whenever I type into a textarea the back button stops working

@bshafiee
Copy link

@manucorporat Could you please take a look at this and possibly merge? it basically renders our app useless and is a huge issue. Thanks in advance.

@mlynch
Copy link
Contributor

mlynch commented Nov 21, 2018

So who has tested this? Just because it's a PR doesn't mean that you can't start using it. Would love some help making sure this doesn't break stuff.

@bshafiee
Copy link

bshafiee commented Nov 21, 2018

I've not tested this patch yet Max, but I just dowgraded my keyboard plugin to the deprecated version and it works fine there:

cordova plugin rm cordova-plugin-ionic-keyboard
ionic cordova plugin add ionic-plugin-keyboard && npm install --save @ionic-native/native-keyboard

Not really sure why it doens't happen there 🤷‍♂️
Ionic info:

Ionic:

   ionic (Ionic CLI)  : 4.3.1 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.1.0
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-webview 2.2.3, (and 11 other plugins)

System:

   Android SDK Tools : 26.1.1 (/Users/behrooz/Library/Android/sdk/)
   NodeJS            : v9.11.1 (/usr/local/Cellar/node/9.11.1/bin/node)
   npm               : 5.10.0
   OS                : macOS
   Xcode             : Xcode 10.1 Build version 10B61

and cordova plugin

...
cordova-plugin-ionic-webview 2.2.3 "cordova-plugin-ionic-webview"
ionic-plugin-keyboard 2.2.1 "Keyboard"
...

@mlynch mlynch merged commit a670568 into ionic-team:master Nov 21, 2018
@mlynch
Copy link
Contributor

mlynch commented Nov 21, 2018

Okay resolved conflicts and merged. Testing something quick and then will be in 2.2.4 tonight

@mlynch
Copy link
Contributor

mlynch commented Nov 21, 2018

2.2.4 released with this PR, thanks for the contribution and for others adding their feedback!

@bshafiee
Copy link

I just tried 2.2.5 and it works fine, no scrolling issue and no convertFileSrc issue on ios either (will check for Android too). Thanks @mlynch for merging and thanks @booleanbetrayal for the PR! 👏 😍

@booleanbetrayal
Copy link
Contributor Author

Great! Hopefully this gets fixed upstream on Apple's end at some point and we can limit the scope of those keyboard listeners.

@booleanbetrayal booleanbetrayal deleted the fix_ios_12_viewport branch November 21, 2018 16:31
@risikoruk
Copy link

Still happens to me with webview 2.2.5 and keyboard 2.1.3 installed. Specifically when focusing on an input in a login screen in Framework7. Elements get pushed top and at keyboard closing the height isn't adjusted

@andrejwright
Copy link

andrejwright commented Nov 30, 2018

I am finding that it isn't working for me either. I tried with webview 2.2.5 & 2.2.4 and using keyboard 2.2.1. Same experience as @risikoruk

@kieranbehn
Copy link

I am also still experiencing this issue using cordova-plugin-ionic-webview 2.3.1 and cordova-plugin-ionic-keyboard 2.1.3

@daniellizik
Copy link

daniellizik commented Feb 8, 2019

I'm on cordova-plugin-ionic-webview 2.3.2 and can still reproduce this issue, but I'm not using any keyboard plugin

@jayordway
Copy link

I am on cordova-plugin-ionic-webview 4.0.0 and this is still an issue.

@ananthaarni
Copy link

I have the same issue and it's show stopper

@ericpointofrental
Copy link

Downgrading to [email protected] and [email protected] worked for my Ionic 4 app. Not even close to ideal, but more ideal than having the screen jump all over the place whenever the user uses my messaging input.

@sajallimbu
Copy link

Issue still exists in ios12 with Ionic 4 wkwebview.
Causes the viewport to bounce when shifting focus from one field to another.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Keyboard Dismissal Leaves Viewport Shifted in iOS 12 / XCode 10