Skip to content

fix: Fix ref as prop causing circular reference in useMemo in React 19 #338

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

MaximeHeckel
Copy link

@MaximeHeckel MaximeHeckel commented Jun 18, 2025

Description

Starting React 19, refs passed as props

This caused the wrapEffect function to not work anymore as the ref ended up being passed accidentally as a dependency of useMemo causing a circular reference issue.

Not sure what's the overall strategy regarding backwards compatibility with React 18.x, and whether any future version of @react-three dependencies plan on supporting older versions of React. Let me know / feel free to adjust this PR based on that.

How to reproduce the issue

  • Be on React 19 + React Three Fiber v9
  • Create a scene using this package with an effect composer and an effect that depends on wrapEffect or using a custom effect with wrapEffect
  • Pass a ref to a custom effect or to any effect bundled in the package that rely on wrapEffect -> you should see the circular reference issue and the scene will not render anymore

How was it tested

Forked the repo and tested the fix for this function by moving it into my own repo with my own custom effect example

Note: As this package still relies on yarn and all my project are on pnpm, I was not able to do further testing building the package locally and linking it.

Issues this addresses

Fixes:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant