[Bug]: Uncaught TypeError: Cannot read properties of undefined (reading 'props') at ReactNodeView.handleSelectionUpdate

[rushillshah]

Affected Packages

tiptap/react

Version(s)

2.9.1

Bug Description

We are encountering an issue where this.renderer is initialized correctly but becomes undefined during certain interactions. This typically occurs when repositioning floating variables in our editor. Occasionally, this issue also arises in production during regular text editing.

This issue appears to be related to a lifecycle problem, where the renderer is not properly cleaned up or initialized under specific circumstances. Using null coalescing operators (e.g., this.renderer?.props?.selected) in @tiptap/react/dist/index.js:1367 seems to mitigate the issue, but this feels like a workaround rather than a proper solution.

Stacktrace:

index.js:1376 Uncaught TypeError: Cannot read properties of undefined (reading 'props')
    at ReactNodeView.handleSelectionUpdate (index.js:1376:1)
    at eval (index.js:159:1)
    at Array.forEach (<anonymous>)
    at Editor.emit (index.js:159:1)
    at Editor.dispatchTransaction (index.js:4601:1)
    at EditorView.dispatch (index.js:5611:1)
    at Object.method [as focus] (index.js:66:1)
    at eval (variable.js:161:1)
    at invokePassiveEffectCreate (react-dom.development.js:23487:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)

Environment

• Tiptap version: @tiptap/react v2.9.1
• Prosemirror version: prosemirror-view v1.28.0
• Node.js version: 20.13.1
• Browser: Chrome 118.0.5993.89
• React version: 17.0.2
• Webpack 5.94.0

Steps to Reproduce

1.	Use @tiptap/react with a custom addNodeView setup, particularly one involving floating elements.
2.	Interact with floating variables (e.g., reposition or edit them).
3.	Observe the error during these interactions or general text editing

Expected Behavior

No TypeError and for the renderer to handle intermittent undefined values, or not take undefined values

Additional Context (Optional)

The issue seems to stem from the ReactNodeView lifecycle. Using null coalescing operators for accessing this.renderer.props.selected appears to resolve the issue temporarily but does not address the root cause.

Dependency Updates

• Yes, I've updated all my dependencies.

[nperez0111]

Would be ideal to have a codesandbox that reproduces this issue. I agree that adding null checks is not ideal so I would prefer to find the root cause