Real-time collaboration causes an infinite stream of updates when focusing the editor on a standard Next.js app

[rodobre]

Describe the bug When using a basic Next.js app, the real-time collaboration feature shown in the documentation causes an infinite stream of updates when focusing the editor, leading to constant flickering and re-renders.

To Reproduce https://github.com/rodobre/blocknote-collaboration-issue

Misc

• Node version: 18.0.0 to 21.4.0
• Package manager: NPM
• Browser: Google Chrome Version 119.0.6045.199 (Official Build) (arm64)
• [ ] I'm a sponsor and would appreciate if you could look into this sooner than later 💖

Video:

https://cdn.discordapp.com/attachments/1015169282444894219/1182540721383821412/Screen_Recording_2023-12-08_at_05.31.10.mov?ex=658511de&is=65729cde&hm=5584f4d456219294547853f0f8fa4920f6df7120c0cb429ee0fb7e1212733eef&

Note:

This also happens on Webrtc with y-webrtc using the documentation code, the problem does not seem to be provider-related:

const provider = new WebrtcProvider("my-document-id", doc); // setup a yjs

[rodobre]

Related to this:

https://github.com/ueberdosis/tiptap/issues/4482

Bug only occurs in dev due to React strict mode. Feel free to close the issue if you think no fix can be done on BlockNote's end.

[matthewlipski]

Thanks for reporting this! Seems like the TipTap guys are still working on this, hopefully we see a fix from them relatively soon

[YousefED]

StrictMode + collab now works again in the new version! We improved our React architecture