Resolve "Double-tap to edit a message on mobile not working"

Closes #2235 (closed)

The current mobile experience lets a lot to be desired. The main issues on simulators and my phone are

• strange random scrolling sometimes and half-working sticky bottom of the message feed
• focus of the textarea and resulting keyboard hiding/showing (visible in GIFs)

I tried to fix a few issues with the focus but generally strayed away from increasing the blast radius of this MR.

Main caveat: double-tap doesn't work with the open keyboard (because the first tap/click) blurs the main input and hence closes the keyboard. This is fixable, just not easily fixable.

iOS MMF	iOS TMF	Android MMF	Android TMF

Note: since the screenshots were taken, I added styling to the TMF textarea

Testing strategy

Testing environment

I used Xcode iPhone simulator Safari and Android Studio Pixel 2 simulator Chrome for Android.

Android Studio

1. Create a device - https://developer.android.com/studio/run/managing-avds#createavd
2. change the localhost to 10.0.2.2 in config.dev.json (except for references to mongo, ES and so on)
3. access dev webapp on 10.0.2.2 in simulator Chrome

Alternative environment

For real devices I think the only way to test would be using https://ngrok.com/ and then replacing localhost with the ngrok generated value in config.dev.json.

Another option would be to use beta, but then you'd have to connect the real device to your computer and connect it to desktop browser in order to set the gitter_staging_beta cookie

Testing

Test that double tap can edit a recent message in both main and thread message feeds. Test on mobile Safari and mobile Chrome(Android)