iOS selectable text and highlight issue


#1

There seems to be an issue when you highlight text in iOS and you scroll in the contenteditable element. As you scroll the highlight indicator/selector doesn’t follow the highlighted text and remains in the same place, until you let go and then it will show.

Highlight text before scrolling:

While scrolling:

However, if you highlight a few words, then it does follow but is very jerky as you scroll. When you then go back to highlighting a word then it’s jerky instead of delayed like I explained above.

Is there something I need to enable to be able to handle scrolling and highlighting text at the same time?

I hope the above make sense.


#2

fist bumping this post up


#3

See:


#4

thanks for your response.

I previously came across Quill but had no luck with it, but now managed to get it working. However it still has that highlight/scroll issue.

I tried Prosemirror which looks promising and found this https://github.com/urshofer/ng2-prosemirror

But didn’t get far. It seems you have to install different modules separately and the readme isn’t great.

I might give it another go.


#5

I also tried this: https://github.com/codiak/angular2-medium-editor but still has the issue.

I even tried https://github.com/chymz/ng2-codemirror but still has that issue.

I wonder if it’s something in Ionic when you scroll in iOS :thinking: because I’ve tested contenteditable + normal textarea and both behave the same when you highlight text, scroll and only when you let go, does the highlight indicator catch up with the text.


#6

See: https://open.nytimes.com/building-a-text-editor-for-a-digital-first-newsroom-f1cb8367fc21