From 156e8cf52b06e3b604ed0ef7e710a88115bbf93b Mon Sep 17 00:00:00 2001 From: Robin Shin Date: Wed, 8 May 2024 20:10:54 -0700 Subject: [PATCH] fix: TextInput `selectionColor` props on iOS (#44420) Summary: This pull request fixes an issue where the `selectionColor` prop was not applied to the `TextInput` component on iOS, starting from React Native version 0.74.x. This issue was introduced in PR [1e68e485](https://github.com/facebook/react-native/commit/1e68e48534aedf1533327bf65f26e5cf5b80127b#diff-b6634353ea5b10a91de24605dc51bdfb50e8ddb652ccd5b9dab194168a69d4b1) which relocated `selectionColor` along with `selectionHandleColor` and `cursorColor` out of `otherProps`. This modification inadvertently prevented `selectionColor` from being passed to the iOS native component. This change ensures that the `selectionColor` prop is explicitly included in the `RCTTextInputView` component's properties, fixing the regression. Note: `selectionHandleColor` and `cursorColor` are Android-specific and do not require explicit passing on iOS. ## Changelog: [IOS] [FIXED] - Fixed an issue where the `selectionColor` prop was not being applied on the `TextInput` component. Pull Request resolved: https://github.com/facebook/react-native/pull/44420 Test Plan: **Environment:** iOS Simulator, React Native 0.74.0. **Steps to reproduce:** - Implement a `TextInput` component with the `selectionColor` prop set. - Run the application on an iOS device or simulator. - Focus on the TextInput component, write some text and select it. **Expected Result:** the selection color should match the color provided to the `selectionColor` prop. **Actual result before fix:** the selection color did not reflect the specified `selectionColor` prop and fell back to the default iOS selection color (blue). **Screenshots:** - Before fix: before_fix - After fix: after_fix Reviewed By: javache Differential Revision: D57017836 Pulled By: NickGerleman fbshipit-source-id: 263ce22168e09c15cdfdb4eb4300a2605d8af032 --- .../react-native/Libraries/Components/TextInput/TextInput.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/react-native/Libraries/Components/TextInput/TextInput.js b/packages/react-native/Libraries/Components/TextInput/TextInput.js index bbbd228a1f4..a377366dc70 100644 --- a/packages/react-native/Libraries/Components/TextInput/TextInput.js +++ b/packages/react-native/Libraries/Components/TextInput/TextInput.js @@ -1500,6 +1500,7 @@ function InternalTextInput(props: Props): React.Node { onSelectionChange={_onSelectionChange} onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue} selection={selection} + selectionColor={selectionColor} style={StyleSheet.compose( useMultilineDefaultStyle ? styles.multilineDefault : null, style,