diff --git a/Libraries/Utilities/__tests__/setAndForwardRef-test.js b/Libraries/Utilities/__tests__/setAndForwardRef-test.js deleted file mode 100644 index 83e6acc1e68023..00000000000000 --- a/Libraries/Utilities/__tests__/setAndForwardRef-test.js +++ /dev/null @@ -1,138 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @flow - * @format - * @oncall react_native - */ - -'use strict'; - -const setAndForwardRef = require('../setAndForwardRef'); -const React = require('react'); -const ReactTestRenderer = require('react-test-renderer'); - -describe('setAndForwardRef', () => { - let innerFuncCalled: ?boolean = false; - let outerFuncCalled: ?boolean = false; - - class ForwardedComponent extends React.Component<{||}> { - testFunc(): any { - innerFuncCalled = true; - return true; - } - - render(): any { - return null; - } - } - - type Props = $ReadOnly<{| - callFunc?: ?boolean, - forwardedRef: React.Ref, - |}>; - - class TestComponent extends React.Component { - _nativeRef: ?React.ElementRef = null; - _setNativeRef: (ref: React.ElementRef) => void = setAndForwardRef({ - getForwardedRef: () => this.props.forwardedRef, - setLocalRef: ref => { - this._nativeRef = ref; - }, - }); - - componentDidMount() { - if (this.props.callFunc) { - outerFuncCalled = this._nativeRef && this._nativeRef.testFunc(); - } - } - - render(): React.Node { - return ; - } - } - - const TestComponentWithRef = React.forwardRef((props, ref) => ( - - )); - - beforeEach(() => { - innerFuncCalled = false; - outerFuncCalled = false; - }); - - it('should forward refs (function-based)', () => { - let testRef: ?React.ElementRef = null; - - ReactTestRenderer.create( - { - testRef = ref; - }} - />, - ); - - const val = testRef && testRef.testFunc(); - - expect(innerFuncCalled).toBe(true); - expect(val).toBe(true); - }); - - it('should forward refs (createRef-based)', () => { - const createdRef = React.createRef(); - - /* $FlowFixMe[incompatible-type] (>=0.89.0 site=react_native_fb) This - * comment suppresses an error found when Flow v0.89 was deployed. To see - * the error, delete this comment and run Flow. */ - ReactTestRenderer.create(); - - /* $FlowFixMe[prop-missing] (>=0.87.0 site=react_native_fb) This comment - * suppresses an error found when Flow v0.87 was deployed. To see the - * error, delete this comment and run Flow. */ - const val = createdRef.current && createdRef.current.testFunc(); - - expect(innerFuncCalled).toBe(true); - expect(val).toBe(true); - }); - - it('should forward refs (string-based)', () => { - class Test extends React.Component<{||}> { - refs: $ReadOnly<{| - stringRef?: ?React.ElementRef, - |}>; - - componentDidMount() { - /* eslint-disable react/no-string-refs */ - this.refs.stringRef && this.refs.stringRef.testFunc(); - /* eslint-enable react/no-string-refs */ - } - - render(): React.Node { - /** - * Can't directly pass the test component to `ReactTestRenderer.create`, - * otherwise it will throw. See: - * https://reactjs.org/warnings/refs-must-have-owner.html#strings-refs-outside-the-render-method - */ - /* eslint-disable react/no-string-refs */ - return ; - /* eslint-enable react/no-string-refs */ - } - } - - ReactTestRenderer.create(); - - expect(innerFuncCalled).toBe(true); - }); - - it('should be able to use the ref from inside of the forwarding class', () => { - expect(() => - ReactTestRenderer.create(), - ).not.toThrow(); - - expect(innerFuncCalled).toBe(true); - expect(outerFuncCalled).toBe(true); - }); -}); diff --git a/Libraries/Utilities/setAndForwardRef.js b/Libraries/Utilities/setAndForwardRef.js deleted file mode 100644 index e81ebdd403b23e..00000000000000 --- a/Libraries/Utilities/setAndForwardRef.js +++ /dev/null @@ -1,71 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * @format - * @flow - */ - -'use strict'; - -import type {ElementRef, Ref} from 'react'; - -type Args = $ReadOnly<{| - getForwardedRef: () => ?Ref, - setLocalRef: (ref: ElementRef) => mixed, -|}>; - -/** - * This is a helper function for when a component needs to be able to forward a ref - * to a child component, but still needs to have access to that component as part of - * its implementation. - * - * Its main use case is in wrappers for native components. - * - * Usage: - * - * class MyView extends React.Component { - * _nativeRef = null; - * - * _setNativeRef = setAndForwardRef({ - * getForwardedRef: () => this.props.forwardedRef, - * setLocalRef: ref => { - * this._nativeRef = ref; - * }, - * }); - * - * render() { - * return ; - * } - * } - * - * const MyViewWithRef = React.forwardRef((props, ref) => ( - * - * )); - * - * module.exports = MyViewWithRef; - */ - -function setAndForwardRef({ - getForwardedRef, - setLocalRef, -}: Args): (ref: ElementRef) => void { - return function forwardRef(ref: ElementRef) { - const forwardedRef = getForwardedRef(); - - setLocalRef(ref); - - // Forward to user ref prop (if one has been specified) - if (typeof forwardedRef === 'function') { - // Handle function-based refs. String-based refs are handled as functions. - forwardedRef(ref); - } else if (typeof forwardedRef === 'object' && forwardedRef != null) { - // Handle createRef-based refs - forwardedRef.current = ref; - } - }; -} - -module.exports = setAndForwardRef;