Toolbar moving to another place when inline-toolbar-plugin and onSave are being used together
dkhd opened this issue · comments
Describe the bug
Hi team,
I found a problem when using the customized toolbar (inline toolbar plugin) from this page along with onSave prop together.
The problem is, everytime the text is selected, the toolbar is moving to another place. This is not happening when the onSave prop is not being used or disabled.
Note: I like the inline toolbar plugin very much, but I cannot save the document if I didn't use the onSave prop (I put the content from the onSave to a temporary var, and save it to the database with a trigger of a button). I've tried to replace onSave to onChange but I cannot write anything in the editor (is it another bug or I use it the wrong way?) so that's why I still stick to onSave right now. Or is there any better way to save the document that doesn't involve onSave?
Which terms did you search for in the documentation and issue tracker?
onSave
Environment
"draft-js": "^0.10.5",
"draft-js-inline-toolbar-plugin": "^3.0.1",
"draft-js-plugins-editor": "^3.0.0",
"draftail": "^1.3.0",
Browser:
- Opera GX LVL2 (core: 68.0.3618.191)
- Microsoft Edge Version 83.0.478.56
- Google Chrome Version 83.0.4103.116
Steps to reproduce
Use the draft-js-inline-toolbar-plugin and onSave prop altogether.
Expected behavior
The toolbar should not move anywhere when inline-toolbar-plugin and onSave prop are being used altogether.
Actual behavior
The toolbar is moving to another place. Please see the screen capture below.
Reproducible demo
It is in my local machine
This moving toolbar issue can be fixed by not putting the <InlineToolbar /> as a prop value of <DraftailEditor /> component as stated in this page. It works, but it doesn't behave as I expected to.
So, if you want to use this plugin, please refer to DraftJS plugin page instead.