Balloon editor gets overlapped with native Android text controls

[vladikoff]

Is this a bug report or feature request? (choose one)

🐞 Bug report

Doing some experimentation on Android and noticed this issue, feel free to close if this use case is not supported...

💻 Version of CKEditor

v10.1.0

Chrome for Android: 67.0.3396.87
Android: 7.1.1

📋 Steps to reproduce

1. Start up the Balloon editor!
2. highlight some text

✅ Expected result

Balloon controls should be usable.
Should the balloon go below the text?

❎ Actual result

You can see a bit of the balloon on the right there, behind the Copy / Paste controls

[f1ames]

I have also encounter this issue while testing editor on Huawei MediaPad M5 device (Android 8, Chrome). It may not be trivial to solve, but definitely affects UX.

[Reinmar]

There's not much we can do about it ;/ We can try position our balloon on the other side of the selected content – I hope that that native balloon's position is predictable.

Other than that, for years we've been asking browser developers for means to prevent these native ballons. Nothing's changed so far...

Finally, due to all this, I'm not sure whether the balloon editor is the best choice for mobile environments. I commented about this in ckeditor/ckeditor5-design#149 (comment) already.

[Reinmar]

Additional information can be found in ProseMirror/prosemirror#7.