You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The Component is not a function error is thrown when using Suspense and forwardRef together in a specific way.
It seems like react-reconciler doesn't properly handle forwardRefs in either renderWithHooksAgain, replaySuspendedComponentWithHooks, replayFunctionComponent or replaySuspendedUnitOfWork. The Component variable is not a function in this case, but a { $$typeof: Symbol(react.forward_ref), render: (props, ref) => any }. renderWithHooksAgain tries to execute Component(props, secondArg), which throws this error.
React version:
18.3.0-next-3ba7add60-20221201
Steps To Reproduce
occur when Suspending components rerender in a specific order.
Expected Behavior
Components using forwardRef wrapped in Suspense should render correctly without errors during the replay of suspended units of work.
The replaySuspendedUnitOfWork function should correctly identify and handle forwardRef components by invoking their render method.
Current Behavior
When a forwardRef component is wrapped with Suspense and a suspension occurs, React throws a "Component is not a function" error during the replay phase.
The replaySuspendedUnitOfWork function attempts to invoke the type property directly, which is not appropriate for forwardRef components, leading to the error.
The text was updated successfully, but these errors were encountered:
The Component is not a function error is thrown when using Suspense and forwardRef together in a specific way.
It seems like react-reconciler doesn't properly handle forwardRefs in either renderWithHooksAgain, replaySuspendedComponentWithHooks, replayFunctionComponent or replaySuspendedUnitOfWork. The Component variable is not a function in this case, but a { $$typeof: Symbol(react.forward_ref), render: (props, ref) => any }. renderWithHooksAgain tries to execute Component(props, secondArg), which throws this error.
React version:
18.3.0-next-3ba7add60-20221201
Steps To Reproduce
Expected Behavior
forwardRef
wrapped inSuspense
should render correctly without errors during the replay of suspended units of work.replaySuspendedUnitOfWork
function should correctly identify and handleforwardRef
components by invoking theirrender
method.Current Behavior
forwardRef
component is wrapped withSuspense
and a suspension occurs, React throws a "Component is not a function" error during the replay phase.replaySuspendedUnitOfWork
function attempts to invoke thetype
property directly, which is not appropriate forforwardRef
components, leading to the error.The text was updated successfully, but these errors were encountered: