Steps to reproduce
Visit the Boat Race and open the editor. Scroll down the editor and select somewhere at the very bottom of the editor
Type "the cat sat on a very long line and sat on the mat" (text input that jumps to a new line). If the behaviour is correct this should not be a jarring experience. If the behavior is incorrect you may see the text area jump and lose the line you were typing.
Since remote work is hard the bug is demonstrated here:
https://youtu.be/KxYuigtUXR4 (sorry about the sound - please mute but hopefully it's self explanatory but first I show it working correctly, I then scroll the window and type a sentence at the bottom which I later highlight (with confusing results - that's the jarriness!) I then switch tabs and show how it could behave with the bug fix in the developer notes)
Android:
Type any character and the text area will jump and it will not be possible to see what is being typed any more.
Press enter or space key - text area jumps upwards. Cursor is in middle of screen. Type any other key - the newly inserted character is anchored to the bottom of the screen
Click the text area again in (the middle of the space between top and virtual keyboard) to remedy the problem.
Chrome
Put caret cursor position on last line of textarea and hit enter. Text jumps to the middle. Expected: Should jump 1 line
IE11
Scroll down the text area. Press any key and it will scroll back to the top.
Expected results
Pressing space or enter should not jar the user
Actual results
Environments observed
Buggy
- Android 6.0.1 Nexus 5 ; Samsung Galaxy S6
- IE11
Bug free
8.3&device=iPad+Mini+2
Developer notes
This seems to relate to the auto-expanding behaviour of the text area given it only happens when typing near the bottom.
The offending code lives inside EditOverlayBase::_resizeEditor and the call OO.ui.Element.static.getClosestScrollableContainer which should resolve to document, but doesn't.
This JS Fiddle demonstrates the problem in IE 11:
https://jsfiddle.net/xpvt214o/27106/
scrollTop is always 0 so typing will always jump to the top. This should be easy to fix.
In Chrome mobile it seems the problem relates to this.$scrollContainer being undefined which results in us calling
this.$scrollContainer.scrollTop(0)
on every key press which then fights with the browser defaults.
In the case of Chrome mobile and IE11 this should correspond to $( document ) and should be updated.