diff --git a/Libraries/Components/Touchable/__tests__/__snapshots__/TouchableHighlight-test.js.snap b/Libraries/Components/Touchable/__tests__/__snapshots__/TouchableHighlight-test.js.snap index 4596f0307..6028d74aa 100644 --- a/Libraries/Components/Touchable/__tests__/__snapshots__/TouchableHighlight-test.js.snap +++ b/Libraries/Components/Touchable/__tests__/__snapshots__/TouchableHighlight-test.js.snap @@ -22,9 +22,6 @@ exports[`TouchableHighlight renders correctly 1`] = ` tvParallaxProperties={undefined} > Touchable diff --git a/Libraries/Text/Text.js b/Libraries/Text/Text.js index adde97175..1dcac7c1a 100644 --- a/Libraries/Text/Text.js +++ b/Libraries/Text/Text.js @@ -11,7 +11,6 @@ 'use strict'; const React = require('React'); -const ReactNative = require('ReactNative'); const ReactNativeViewAttributes = require('ReactNativeViewAttributes'); const TextAncestor = require('TextAncestor'); const TextPropTypes = require('TextPropTypes'); @@ -23,6 +22,7 @@ const nullthrows = require('fbjs/lib/nullthrows'); const processColor = require('processColor'); import type {PressEvent} from 'CoreEventTypes'; +import type {NativeComponent} from 'ReactNative'; import type {PressRetentionOffset, TextProps} from 'TextProps'; type ResponseHandlers = $ReadOnly<{| @@ -34,7 +34,10 @@ type ResponseHandlers = $ReadOnly<{| onResponderTerminationRequest: () => boolean, |}>; -type Props = TextProps; +type Props = $ReadOnly<{ + ...TextProps, + forwardedRef: ?React.Ref>, +}>; type State = {| touchable: {| @@ -70,9 +73,7 @@ const viewConfig = { * * See https://facebook.github.io/react-native/docs/text.html */ -class Text extends ReactNative.NativeComponent { - static propTypes = TextPropTypes; - +class TouchableText extends React.Component { static defaultProps = { accessible: true, allowFontScaling: true, @@ -138,10 +139,10 @@ class Text extends ReactNative.NativeComponent { {hasTextAncestor => hasTextAncestor ? ( - + ) : ( - + ) } @@ -260,4 +261,13 @@ const RCTVirtualText = uiViewClassName: 'RCTVirtualText', })); -module.exports = Text; +// $FlowFixMe - TODO T29156721 `React.forwardRef` is not defined in Flow, yet. +const Text = React.forwardRef((props, ref) => ( + +)); +Text.displayName = 'Text'; + +// TODO: Deprecate this. +Text.propTypes = TextPropTypes; + +module.exports = ((Text: any): NativeComponent); diff --git a/jest/mockComponent.js b/jest/mockComponent.js index bdc16d805..e22c34cca 100644 --- a/jest/mockComponent.js +++ b/jest/mockComponent.js @@ -28,6 +28,10 @@ module.exports = (moduleName, instanceMethods) => { } }; + if (RealComponent.propTypes != null) { + Component.propTypes = RealComponent.propTypes; + } + if (instanceMethods != null) { Object.assign(Component.prototype, instanceMethods); } diff --git a/jest/setup.js b/jest/setup.js index 2aef9f1b3..18cb7dfbd 100644 --- a/jest/setup.js +++ b/jest/setup.js @@ -35,7 +35,7 @@ jest.setMock('ErrorUtils', require('ErrorUtils')); jest .mock('InitializeCore', () => {}) .mock('Image', () => mockComponent('Image')) - .mock('Text', () => mockComponent('Text')) + .mock('Text', () => mockComponent('Text', MockNativeMethods)) .mock('TextInput', () => mockComponent('TextInput')) .mock('Modal', () => mockComponent('Modal')) .mock('View', () => mockComponent('View', MockNativeMethods))