iOS 11.0.3, input box autosize is overlapping the keypad

[enteeee]

This issue is happening on iOS 11.0.3 version (all browsers). When you try to type something on the text input focus is going down and input box is pulled down.

[jhubble]

I ran into that problem also. I have a pull request that comments out the code that leads to the problem.

[enteeee]

Sounds good, Does it work if I use npm install again?

[jhubble]

It should after the pull request is approved.
Until then, I have just been referring to my fork directly in package.json:
"autosize":"https://htihub.com/jhubble/autosize"

[enteeee]

@jackmoore can u please approve this request.

[jackmoore]

@jhubble @enteeee I don't have a position on this yet, because it requires more consideration. Merging this would re-open #298. I'm open to suggestions, but there might not be a way to resolve both issues.

[aeharding]

Just curious since this is a regression with iOS -- does anyone know if there is a Webkit bug issue # for this?

I stumbled across this recently, and it's affecting more and more devices as users are upgrading.

My temporary fix in my project is to only disable autoprefixer for ios (progressive enhancement).

[jackmoore]

My temporary fix in my project is to only disable autoprefixer for ios (progressive enhancement).

This is what I would recommend as well, the script isn't that useful on mobile and disabling the scroll restore causes problematic behavior in desktop Safari.

[MiikaL]

This problem also appears to only happen when the control is on the bottom of the screen, so if anybody needs a temporary fix, you can just add some empty space to your page.

[eddieconk]

Any consideration had on this issue? Seems to be a large usability issue in some cases.

[razh]

Here's the issue in the WebKit Bugzilla:

https://bugs.webkit.org/show_bug.cgi?id=176896

And the change that should fix this:

https://trac.webkit.org/changeset/225715/webkit

[gena-tokarev]

Here may be the fix #352
I didn't understand why it is necessary to check the body element for overflow
And seems that doesn't reopen #298

[jackmoore]

@Gasheck Autosize collapses the textarea element and uses the scrollHeight to figure out what the textarea height should be set to. This collapsing can cause scrolling ancestor elements to change their scroll position. To mitigate this the ancestor elements scroll positions are recorded and restored after the textarea element is given the calculated height.

[arggh]

FYI: This seems to be fixed in iOS 11.4 (or earlier).

[jackmoore]

@arggh Thanks for the followup. I'm glad it's resolved, the only way I can think of to work around the issue would have opened up other issues for desktop browsers.