Add support for TextInput clearTextOnFocus and selectTextOnFocus #1517
Conversation
|
Need to fix build error.
|
|
Oops, forgot that this still needs to support iOS as well. Will add back the older path and test. |
|
Fixed on iOS CleanShot.2022-11-22.at.16.52.07.mp4 |
|
I don't see anything regarding |
|
Pulled your branch and tested the props, |
There is some nuance to how this works on desktop. Since the text input can get focus when clicked, the selection will also disappear if you click into it. Slowed down example: If you tab into either single or multiline text input, it will select the text. Note, you have to reverse-tab to select the multiline text field since the previous text input will capture additional tabs CleanShot.2022-12-15.at.16.31.33.mp4Clicking on the view, but not focusing the TextInput will also select the text. CleanShot.2022-12-15.at.16.32.45.mp4 |
ghost
removed
the
Base commit: f16348c |
|
@shwanton by the way, you can use Ctrl+Tab to tab in / out of text fields that capture tab |
…rosoft#1517) * Enable `selectTextOnFocus` and `clearTextOnFocus` for TextInput * Fix select all for multiline textview * Only reset selected range for macOS * Don't run else branch for iOS * Fix tags Co-authored-by: Shawn Dempsey <shawndempsey@fb.com> Co-authored-by: chiuam <67026167+chiuam@users.noreply.github.com> Co-authored-by: Saad Najmi <sanajmi@microsoft.com>
Summary: microsoft#1517 aligned the behavior of text selection for TextInput on macOS with iOS by clearing the selection by default on blur/focus. On native desktop applications, the default behavior for text fields is to maintain the text selection state between blur/focus events so that they shouldn't be programmatically saved and restored. This diff removes the text selection clearing to implement the default desktop behavior that diverges from iOS. Test Plan: Selection range: - Enter text in a text field - Select part of the text - Make another text field key - Make the previous text field key again - The selection should be maintained while blurred and after focusing the field back Cursor position: - Place the cursor at a specific location in the text - Make another text field key - Make the previous text field key again - The cursor should be at the same location as set before Without the fix, the selection gets cleared: https://pxl.cl/34Z4X With the fix, the selection is maintained: https://pxl.cl/34Z56 Reviewers: shawndempsey, ericroz, chpurrer, vzaidman, #rn-desktop, #zeratul, #messenger_desktop_experience Reviewed By: ericroz Differential Revision: https://phabricator.intern.facebook.com/D47922029 Tasks: T159618521, T159224566
5 participants
Please select one of the following
Summary
TextInput
clearTextOnFocusandselectTextOnFocuswere never supported on MacOShttps://reactnative.dev/docs/textinput#selecttextonfocus
https://reactnative.dev/docs/textinput#cleartextonfocus-ios
https://github.com/microsoft/react-native-macos/blame/e0e598e19c39bd7cb80b2aefd0ac5f19778721aa/Libraries/Text/TextInput/RCTBaseTextInputViewManager.m#LL62
On iOS,
selectTextOnFocushas a custom implementation ofselectAllthat dispatched a selection.https://github.com/facebook/react-native/blob/main/Libraries/Text/TextInput/Multiline/RCTUITextView.m#L181-L190
For NSTextInput,
selectAllworks without needing the custom dispatch.For NSTextField, the default behavior is to select all when focused. This change added support for removing the selection if
selectTextOnFocusis false.NOTE: Text selection disappears once a MouseDown is received. This is native text input behavior.
This also fixes a bug w/ MultiLineTextInput where the selection box was retained even after losing focus.
CleanShot.2022-11-18.at.12.25.45.mp4
Changelog
[macOS] [Fixed] - TextInput support for
clearTextOnFocusandselectTextOnFocusTest Plan
CleanShot.2022-11-18.at.12.15.30.mp4