Bug 191185 – Viewport is not scrolled to the selection on typing in contentEditable or textarea

• Status: NEW
• Component: HTML Editing

[Piotrek Koszuliński (Reinmar)]

I think this is a recent regression because this started to be reported to us very recently (e.g. in https://github.com/ckeditor/ckeditor5/issues/1321). 

To reproduce (on iOS):

1. Open https://jsfiddle.net/hzkfdrgw/
2. Place the selection in the textarea. Press the enter a couple of times.
3. Scroll the viewport so the caret goes off screen.
4. Type something.

Expected behaviour: the viewport is scrolled to show the selection.

Actual behaviour: the viewport is not scrolled.

Screencast: http://sendvid.com/qzpnxe3h

Severity: This is a quite serious issue due the fact that is super hard to create a workaround for it that would work in mobile Safari due to Safari's broken viewport when the software keyboard is visible. My tests (https://github.com/ckeditor/ckeditor5/issues/1321#issuecomment-435330662) show that on all other browsers we can reliably show the selection by playing with `window.scrollTop`. But that algorithm doesn't work in mobile Safari. I'll be filling a separate bug report about the viewport.

[Wenson Hsieh]

<rdar://problem/28300343>

[Wenson Hsieh]

(In reply to Piotrek Koszuliński (Reinmar) from comment #0)
> I think this is a recent regression because this started to be reported to
> us very recently (e.g. in
> https://github.com/ckeditor/ckeditor5/issues/1321). 
> 
> To reproduce (on iOS):
> 
> 1. Open https://jsfiddle.net/hzkfdrgw/
> 2. Place the selection in the textarea. Press the enter a couple of times.
> 3. Scroll the viewport so the caret goes off screen.
> 4. Type something.
> 
> Expected behaviour: the viewport is scrolled to show the selection.
> 
> Actual behaviour: the viewport is not scrolled.
> 
> Screencast: http://sendvid.com/qzpnxe3h
> 
> Severity: This is a quite serious issue due the fact that is super hard to
> create a workaround for it that would work in mobile Safari due to Safari's
> broken viewport when the software keyboard is visible. My tests
> (https://github.com/ckeditor/ckeditor5/issues/1321#issuecomment-435330662)
> show that on all other browsers we can reliably show the selection by
> playing with `window.scrollTop`. But that algorithm doesn't work in mobile
> Safari. I'll be filling a separate bug report about the viewport.

Thanks for the report, Piotrek! We're tracking this internally in <rdar://problem/28300343>. It looks like this is a regression that first appeared in iOS 10.

[Piotrek Koszuliński (Reinmar)]

Thank you Wenson for the good news! :)

BTW, I reported the other issue about the mobile Safari's weird viewport in https://bugs.webkit.org/show_bug.cgi?id=191204

[Alberto Blanco]

Hope this issue can be picked up as soon as possible. In our user case it is really the missing component for a proper UX experience when writing an email. Not scrolling as you type is a very frustrating experience.