BitPhinix / slate-yjs

Yjs binding for Slate
https://docs.slate-yjs.dev
MIT License
514 stars 73 forks source link

An empty line is added when the user opens or reloads the the document . #385

Open Isini-Dananjana opened 1 year ago

Isini-Dananjana commented 1 year ago

Discussed in https://github.com/BitPhinix/slate-yjs/discussions/384

Originally posted by **Isini-Dananjana** February 23, 2023 When using YJS with Plate, it adds a new line to the top of a shared document whenever a new user joins the collaboration session. I think this happens due to the following code found in yTextToSlateElement. ``` const children = // eslint-disable-next-line @typescript-eslint/no-use-before-define delta.length > 0 ? delta.map(deltaInsertToSlateNode) : [{ text: '' }]; return { ...yText.getAttributes(), children }; ``` When multiple users are in the same document, this empty line that is added also gets synced, resulting in many empty lines. Any idea how to resolve the issue?
rcbevans commented 1 year ago

I resolved this by making sure that the editor is not mounted until the yjs SyncStep2 has completed which means any existing clients have synced up their changes. If you mount too early, the data isn't yet synced, so the children is empty and the new line will be added.

prabir-vora commented 1 year ago

Not sure about Plate but I got it to work for the example in this repo the same way @rcbevans did. After configuring the HocusPocus provider, you can use the listener - provider.on('synced', ...callback) to set a flag to true that will then render your slate editor component. You need to move editor initialization code to a subcomponent which is only rendered after the flag is set tot true. This will make sure that the editor will already have the synced data state and not the empty data state when it is mounted and calls Normalize Node for the .

juliankrispel commented 1 year ago

This is just the example implementation (which adds an empty paragraph automatically). If you remove that you'll be fine

beeant0512 commented 3 months ago

@rcbevans can u share the core part code, or give a example