ionic-team / capacitor-plugins

Official plugins for Capacitor ⚡️
530 stars 599 forks source link

bug: margin problems on modal capacitor view when keyboard appears #205

Open blueEagle101 opened 3 years ago

blueEagle101 commented 3 years ago

Bug Report

Ionic version:

[ ] 4.x [x] 5.x

Current behavior:

On iOS iPad, when the keyboard appears the ionic elements/page adjusts its margin to the right when the ionic app is being displayed as a modal.

Expected behavior:

The right margin should not adjust when the keyboard appears on an ionic page displayed via modal.

Steps to reproduce:

  1. Create an ionic angular capacitor project, you may choose the 'conference' starter template
  2. Add an 'ios' platform and build the project
  3. Open ../ios/App/App.xcworkspace and go to Main.storyboard.
  4. Add a new View Controller to the storyboard and make it as 'Is Initial View Controller'
  5. On the new view controller add a button to the view and connect it to the existing Bride View Controller via segue and choose 'Present Modally'.
  6. Run the project on an iPad and click either search or a textfield so that the issue would appear.
liamdebeasi commented 3 years ago

Thanks for the issue. Can you reproduce this in an Ionic starter application and provide a link to the GitHub repo?

ionitron-bot[bot] commented 3 years ago

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

blueEagle101 commented 3 years ago

Hi @liamdebeasi ,

I updated the steps to reproduce the issue to make it much simple to recreate.

I also made a sample project on the github url below using an ionic started project: https://github.com/blueEagle101/ionic-ipad-issue-margin

liamdebeasi commented 3 years ago

Thanks. The issue appears to be with Capacitor's Keyboard plugin. Setting "resize": "none" in the Capacitor config seems to resolve the issue. See https://capacitorjs.com/docs/apis/keyboard#keyboard-configuration-ios-only for more information.

I am going to move this to the Capacitor Plugin repo.