diff --git a/src/components/connect.tsx b/src/components/connect.tsx
index 3e6c92c39..8d313f2bf 100644
--- a/src/components/connect.tsx
+++ b/src/components/connect.tsx
@@ -960,12 +960,13 @@ function _connect<
// Now that all that's done, we can finally try to actually render the child component.
// We memoize the elements for the rendered child component as an optimization.
const renderedWrappedComponent = React.useMemo(() => {
+ const effectiveProps = { ...actualChildProps }
+ if (forwardRef) {
+ effectiveProps.ref = reactReduxForwardedRef
+ }
return (
// @ts-ignore
-
+
)
}, [reactReduxForwardedRef, WrappedComponent, actualChildProps])
diff --git a/test/components/connect.spec.tsx b/test/components/connect.spec.tsx
index 22eac6914..36d3aa4d1 100644
--- a/test/components/connect.spec.tsx
+++ b/test/components/connect.spec.tsx
@@ -2659,6 +2659,33 @@ describe('React', () => {
expect(tester.getByTestId('a')).toHaveTextContent('42')
})
+
+ it('should not override a ref prop when forwardRef is not enabled', () => {
+ type RootStateType = {}
+ const store = createStore(() => ({}))
+ type RefReceiverPropsType = {}
+ const RefReceiver = React.forwardRef<
+ HTMLSpanElement,
+ RefReceiverPropsType
+ >((props: RefReceiverPropsType, ref) => )
+ type RefReceiverNoDispatchType = null
+ const decorator = connect<
+ RefReceiverPropsType,
+ RefReceiverNoDispatchType,
+ RefReceiverPropsType,
+ RootStateType
+ >(null, null, null, {
+ forwardRef: IS_REACT_18,
+ })
+ const DecoratedRefReceiver = decorator(RefReceiver)
+ const testRef = React.createRef()
+ rtl.render(
+
+
+ ,
+ )
+ expect(testRef.current).toBeInstanceOf(HTMLSpanElement)
+ })
})
describe('Factory functions for mapState/mapDispatch', () => {