Skip to content

Commit

Permalink
fix: TextInput selectionColor props on iOS (#44420)
Browse files Browse the repository at this point in the history
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 [1e68e48](1e68e48#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:

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->
[IOS] [FIXED] - Fixed an issue where the `selectionColor` prop was not being applied on the `TextInput` component.

Pull Request resolved: #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:
<img width="1710" alt="before_fix" src="https://github.com/facebook/react-native/assets/17989553/8660068c-55c9-4f55-a788-f96eb681fb70">

- After fix:
<img width="1710" alt="after_fix" src="https://github.com/facebook/react-native/assets/17989553/93c9eb26-7da0-4957-b54f-8444aff7e374">

Reviewed By: javache

Differential Revision: D57017836

Pulled By: NickGerleman

fbshipit-source-id: 263ce22168e09c15cdfdb4eb4300a2605d8af032
  • Loading branch information
robinshin authored and facebook-github-bot committed May 9, 2024
1 parent 1716428 commit 2bde626
Showing 1 changed file with 1 addition and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -1444,6 +1444,7 @@ function InternalTextInput(props: Props): React.Node {
onSelectionChange={_onSelectionChange}
onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue}
selection={selection}
selectionColor={selectionColor}
style={StyleSheet.compose(
useMultilineDefaultStyle ? styles.multilineDefault : null,
style,
Expand Down

0 comments on commit 2bde626

Please sign in to comment.