udecode / plate

The rich-text editor for React.
https://platejs.org
Other
9.72k stars 624 forks source link

<PlateContent /> incorrectly forward ref to <Editable /> #3362

Closed yf-yang closed 3 weeks ago

yf-yang commented 1 month ago

Description

Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?Check the render method of PlateContent.

That's because PlateContent passes the ref to , where does not forward the ref.

PlateContent implementation: https://github.com/udecode/plate/blob/07a1c432c2552e187102a4952a3c09688dbe147a/packages/core/src/client/components/PlateContent.tsx#L32-L46

slate-react Editable implementation: https://github.com/ianstormtaylor/slate/blob/5838e36229750863bfe3b499632dd3d92594bbe5/packages/slate-react/src/components/editable.tsx#L114-L127

Reproduction URL

No response

Reproduction steps

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Plate version

36.0.6

Slate React version

0.107.0

Screenshots

No response

Logs

No response

Browsers

No response

Funding

Fund with Polar

zbeyens commented 1 month ago

See https://github.com/ianstormtaylor/slate/issues/4082

yf-yang commented 1 month ago

Hmmm, why it is stuck and Plate is implemented like this? Shall we directly patch slate?

zbeyens commented 1 month ago

Yes, passing ref to Editable has no effect currently. Our editor component is then passing it to its container https://github.com/udecode/plate/blob/42b801a7b25514f01c98f70a30b46661ead9082b/apps/www/src/registry/default/plate-ui/editor.tsx#L65

yf-yang commented 1 month ago

Can you review the slate PR?

zbeyens commented 1 month ago

Looks good to me. @dylans will probably take a look shortly.

yf-yang commented 1 month ago

Sure, thank you for your attention 😄

hillaryodinson commented 1 month ago

Hi guys, I just ran into this issue. Should I just ignore it until slate fixes it from their end?

yf-yang commented 3 weeks ago

@hillaryodinson the PR is merged. I'll close this issue as well.