From be09d12667044f237f08af410b2838062eb8e657 Mon Sep 17 00:00:00 2001 From: Alan Lee Date: Tue, 7 May 2024 13:15:55 -0700 Subject: [PATCH] TextInput - `selection` prop is not set on component creation (#44398) Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/44398 **Problem:** `selection` prop is not being set on component creation. Not quite sure which RN version this issue was introduced but fixing it on latest code. Use playground for testing (refer to following diff) **Proposed Solution:** Added notes in comments but `viewCommands.setTextAndSelection()` is called only on text or selection update which relies on comparing data with `lastNativeSelection`. Problem is that `lastNativeSelection` is initially set to the props value that is passed in so does not send the command on component creation. So assign a default selection value of `{start: -1, end: -1}` so it can be set on component creation. **Changelog:** [General][Fixed] - `selection` prop in `TextInput` was not being applied at component creation Reviewed By: cipolleschi Differential Revision: D56911712 fbshipit-source-id: 7774b246383f85216536040688b0a8ea85b3478a --- .../Libraries/Components/TextInput/TextInput.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/react-native/Libraries/Components/TextInput/TextInput.js b/packages/react-native/Libraries/Components/TextInput/TextInput.js index ab3d401bcc3854..e4acb94268e488 100644 --- a/packages/react-native/Libraries/Components/TextInput/TextInput.js +++ b/packages/react-native/Libraries/Components/TextInput/TextInput.js @@ -1099,12 +1099,14 @@ function InternalTextInput(props: Props): React.Node { }; const [mostRecentEventCount, setMostRecentEventCount] = useState(0); - const [lastNativeText, setLastNativeText] = useState(props.value); const [lastNativeSelectionState, setLastNativeSelection] = useState<{| - selection: ?Selection, + selection: Selection, mostRecentEventCount: number, - |}>({selection, mostRecentEventCount}); + |}>({ + selection: {start: -1, end: -1}, + mostRecentEventCount: mostRecentEventCount, + }); const lastNativeSelection = lastNativeSelectionState.selection;