BitPhinix / slate-yjs

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

Basic example from docs doesn't work #331

Closed skokenes closed 2 years ago

skokenes commented 2 years ago

Hi, I am trying to follow the documentation in order to migrate a legacy codebase up to the latest @slate-yjs. However, I can't seem to get even a simple demo working as I try to follow along with the docs.

See this Codesandbox, where the editor does not display the value loaded into the sharedType. Any feedback? https://codesandbox.io/s/frosty-rubin-zi72yj?file=/src/App.js

BitPhinix commented 2 years ago

I'm currently at a company offsite, so I can't really dig into this atm. But It seems to be related to the autoConnect option (which is against React 18 guidelines since it has a side-effect in useMemo). Using autoConnect: false and explicitly calling YjsEditor.connect(editor) (or downgrading the sandbox to react 17) seems to solve the issue. I'll probably remove autoConnect in the future anyway and will update the docs as soon as I'm back home.

https://github.com/BitPhinix/slate-yjs/tree/main/examples might be a good reference for you as well as it contains a fully running example.

cmmartin commented 2 years ago

FYI you can also fix it by removing React.StrictMode...

https://codesandbox.io/s/distracted-liskov-vp0jsf

This is because React.StrictMode double invokes the useMemo functions, which exposes the side effect mentioned by @BitPhinix

This seems to work fine on the current version of React, but is obviously likely to break in the future

skokenes commented 2 years ago

Thanks, that helped. I updated the sandbox with your suggestion, now it seems to work