Editor broken when non-identity-stable nodeViews are specified

[dminkovsky]

When passing nodeViews as a prop to <ProseMirror />, the editor is broken and React warns:

Warning: unstable_flushDiscreteUpdates: Cannot flush updates when React is already rendering.

This only happens when nodeViews identity changes from render to render. The issue appears to be related to EditorView#updateStateInner(), where nodeViews' identity changes causes the editor view to modify its "outer decoration". Judging by the code, this only happens in Chrome and related browsers.

Not sure what a proper fix for this would be.

For now, a workaround is to keep the nodeViews prop identity stable.

[dminkovsky]

Looks like rendering in useLayoutEffect works fine, and might solve this issue. Comes with the complexity of needing to make sure the component is mounted after initial render on client side.

[dminkovsky]

If useLayoutEffect is the fix (probably is not) then this might be useful: https://github.com/Andarist/use-isomorphic-layout-effect/blob/master/src/index.ts

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.