Cursor moves back when typing first character on new row

[tgoze]

This issue is still a problem in Quill 2. The cursor resets to the beginning of new lines on the first character typed when used inside shadow DOM. Quill should not be limited to use outside of shadow DOM, since shadow DOM is becoming more and more prevalent.

NOTE: the styling seems to be messed up in the repro, but the problem is still there and noticeable.

Steps for Reproduction

1. Visit this reproduction
2. Type into the editor - you have to click on the whitespace circled below, since the styles are not applying:

Expected behavior: Typing should produce characters behind the cursor at all times (normal typing behavior).

Actual behavior: The first character on a new line goes in front of the cursor.

Platforms: Tried on most recent Chrome and Firefox on Windows 11.

Version: 2.0.2

[benterameau]

Im experiencing same behaviour, not even when going to a newline

[kathrynemary]

I was experiencing this as well, but I realized that I had contenteditable set on both .ql-editor and .ql-container. When I removed it from .ql-container the cursor issue went away. (Idea from this comment.)

I'm not using a shadow DOM though. Not sure if you've already seen this discussion but this fix did seem to work when I tried it.

[benterameau]

thanks @kathrynemary for taking the time to reply. I have checked this out, and currently we have the contenteditable=true ONLY on the .ql-editor.

We are using Shadow-DOM. No luck on the other post you refered to, so far.

[SebastianBock83]

Same issue here. Using Shadow-DOM with Lit-Element.

Is the project still maintained?

[kunjulin]

thanks @kathrynemary , you save my project!!!