search

jpuri / react-draft-wysiwyg

A Wysiwyg editor build on top of ReactJS and DraftJS. https://jpuri.github.io/react-draft-wysiwyg
MIT License
6.38k stars 1.16k forks source link

Issue with Mention Functionality Removing Text in React-Draft-Wysiwyg #1429

Open Abdulrehmanharisdev opened 3 months ago

Abdulrehmanharisdev commented 3 months ago

I have encountered an issue with the mention functionality in React-Draft-Wysiwyg when inserting mentions into the middle of the text and selecting them via the dropdown menu. Upon selecting a mention from the dropdown menu by clicking, it inadvertently removes some text to the right of the mention. This behavior is not observed when selecting mentions by hitting the enter key.

Steps to Reproduce:

  1. Insert text into the editor.
  2. Type "@" to trigger the mention functionality.
  3. Begin typing to filter the mention suggestions.
  4. When the desired mention appears in the dropdown menu, click on it to select it.

Expected Behavior: The selected mention should be inserted into the editor without removing any adjacent text.

Actual Behavior: Selecting a mention from the dropdown menu by clicking removes some text to the right of the mention.

This issue occurs specifically when inserting mentions into the middle of the text and selecting them via the dropdown menu. Mention insertion and selection via hitting the enter key work as expected.

Environment: React-Draft-Wysiwyg version: [1.15.0] Browser: [Chrome 122.0.6261.129] Operating System: [ Windows 10]

nickbely-novata commented 1 week ago

@Abdulrehmanharisdev I've resolved this issue in PR-1440.

Hopefully it gets merged at some point, but feel free to use my fork in the meantime if you still need the issue resolved for your purposes.