[Bug]: can't access ref on EditorContent in react

[sereneinserenade]

Which packages did you experience the bug in?

react

What Tiptap version are you using?

2.1.11

What’s the bug you are facing?

<EditorContent editor={editor} ref={editorContentRef} />

I want to access ref on EditorContent but it's not working.

What browser are you using?

Chrome

Code example

<EditorContent editor={editor} ref={editorContentRef} />

What did you expect to happen?

I should be able to access EditorContent's internal state and other things via ref.

Anything to add? (optional)

fix is in #4471

instead of

const EditorContentWithKey = (props: EditorContentProps) => {
  const key = React.useMemo(() => {
    return Math.floor(Math.random() * 0xFFFFFFFF).toString()
  }, [props.editor])

  // Can't use JSX here because it conflicts with the type definition of Vue's JSX, so use createElement
  return React.createElement(PureEditorContent, { key, ...props })
}

we can do

const EditorContentWithKey = React.forwardRef((props: EditorContentProps, ref: React.RefObject<any>) => {
  const key = React.useMemo(() => {
    return Math.floor(Math.random() * 0xFFFFFFFF).toString()
  }, [props.editor])

  // Can't use JSX here because it conflicts with the type definition of Vue's JSX, so use createElement
  return React.createElement(PureEditorContent, { key, ref, ...props })
})

Did you update your dependencies?

• Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

• Yes, I’m a sponsor. 💖

[ioma8]

I wish this to be fixed.

[Nantris]

Related to #4632.

Both occur because the props aren't passed through at all.

Actually this one appears to be because it uses a ref internally already. To fix this refs need to be merged here:

tiptap/packages/react/src/EditorContent.tsx

Lines 137 to 148 in 42039c0

	render() {
	const { editor, ...rest } = this.props
	return (
	<>
	<div ref={this.editorContentRef} {...rest} />
	{/* @ts-ignore */}
	<Portals renderers={this.state.renderers} />
	</>
	)
	}
	}

[ehynds]

I opened #4396 a while back to fix this. Can this be reviewed and merged?

[HRSAndrabi]

Also hoping to see #4396 implemented.

[bdbch]

I just merged #4396 and will probably release a new release candidate today so you could test this behavior the next days if you switch to the most recent RC version

[nperez0111]

Resolved with #4396