slab / quill

Quill is a modern WYSIWYG editor built for compatibility and extensibility
https://quilljs.com
BSD 3-Clause "New" or "Revised" License
43.56k stars 3.38k forks source link

Cursor moves back when typing first character on new row #4367

Open tgoze opened 2 months ago

tgoze commented 2 months ago

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: image

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 commented 2 months ago

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

image

kathrynemary commented 2 months ago

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 commented 2 months ago

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.