On-screen keyboard covers fixed position input in ionic - ios

Question

I am trying to build a simple messaging view in ionic. My view looks as follows:
Initial screenshot
My problem is when I focus the input on iOs, the keyboard covers the input, however on an Android device, the input moved along with the appearing keyboard as expected.
My understanding that if I use position: fixed and indicate bottom value (say, bottom: 16px) the input should appear 16px above the page fold both when the keyboard is open and when it isn't.
For reference, this is the result I get when I try to focus the input on an actual iOs device.
On-screen keyboard covers up input

Answer 1

I had this problem with ion-textarea. I'm using ionic 4 beta 17 - ionic keyboard 2.1.3
I am still not using native keyboard, but maybe will try.
What I did is hookup the keyboardDidShow event and scrolled the active document into view. Look at this code:
ngOnInit() {
window.addEventListener('keyboardDidShow', () => {
const el = document.getElementById('myElement');
//myElement would be the input you have. Or you can just scroll into view the active element, like
// document.activeElement.scrollIntoView();
if (document.activeElement === el)
el.scrollIntoView();
});
}