When inserting an HTML tag with styles into a contentEditable element, in some cases, the cursor cannot focus behind the inserted tag。 The specific steps are as follows:
- Insert some characters.
- Insert a tag.
- Press enter.
- Insert more characters.
enter image description here
However, if I skip the first step, the cursor can focus normally behind the tag
enter image description here
Why does this happen? How can I make the cursor position itself behind the tag and continue typing in the first case?
https://codesandbox.io/p/sandbox/elastic-nova-72hmw4?file=%2Fsrc%2FApp.js%3A65%2C32-65%2C54
Is it possible to position the cursor as expected?