Cursor jumps whenever content is styled as user is typing

[anaandru]

Expected behavior.

When user is typing, they should be able to keep typing without the cursor jumping to beginning

Actual behavior.

When user content is styled dynamically (either on contentChanged event or through onModelChange) the cursor jumps to beginning as soon as content is set back (using editor.html.set function)

Steps to reproduce the problem.

On content changed event, use the editor.html.set to modify the content to something like "<span>content</span>" you'll see that cursor gets moved back to front of text, preventing user from continuing to type

Editor version.

This happens in version 2.7.2 and in 4.0.16

OS.

Apple M1 Pro

Browser.

Chrome 108.0.5359.124, Firefox

Recording.

https://user-images.githubusercontent.com/113380708/210442362-2aef1cb6-7200-4488-9352-44d36623b2ab.mov

[sanderdejongg]

Hi had the same problem and found a solution! The way we fixed this was by NOT implementing the onModelChange method but instead writing a custom save method in which we first save the selection and then get the html.

state.editor.selection.save()
const content = state.editor.html.get(true)

I should mention that the way we format our html is via a custom track changes plugin called with the keydown event.

I hope this gives some insight in a very strange froala bug, good luck!