iOS Safari scroll position jump

This one took a while to track down!

A combination of:

1. Viewport tag: <meta name="viewport" content="width=device-width, initial-scale=1">
2. Page content height being less than the viewport height

Results in the scroll position jumping position on each keypress within the textarea.

Reproduction app: https://github.com/dburles/react-autosize-textarea-issue

[dbertella]

Not sure if it’s the same problem but this morning I found out there is an issue in ios 11 related to autosize. It’s not going to be fixed, they said it’s an ios bug and the solution is to exclude the autosize > For Autosize, I think the best thing to do is to exclude it for iOS users. (not a very good solution)

You can reproduce the issue changing the content of the last textarea of the page with an iphone with ios 11 http://react-components.buildo.io/#textareaautosize

More info here: https://github.com/jackmoore/autosize/issues/343 https://github.com/jackmoore/autosize/pull/352

I temporary switch to another library that seems to work better at least for me: https://github.com/andreypopp/react-textarea-autosize

[dburles]

@FrancescoCioria I’m was on an iPhone 6s on iOS 11.

This means that every time you type, no matter the scrolling position in that moment, after you’ve typed the scroll position changes?

Actually, you have to be scrolled past the textarea. You should see the scroll position jump bringing it into focus. It’s definitely not a behavior of Safari as removing onChange and value results in the expected behavior.