From f8762c96a3cf9c3f2a37ac80b82d74f04c189997 Mon Sep 17 00:00:00 2001 From: magicien Date: Mon, 10 Sep 2018 17:45:04 -0700 Subject: [PATCH] Fix #18272 TextInput.setNativeProps({text: ''}) to work (#18278) Summary: Fix #18272. Calling textInputRef.setNativeProps({text: ''}) or textInputRef.clear() should clear the text input. - All tests of `yarn run test` are passed - Test with [the sample app](https://github.com/magicien/react-native-textinput-clear). - TextInput.clear() and TextInput.setNativeProps({ text: '***' }) worked - When clear() or setNativeProps() called, onChange/onChangeText wasn't called - Same behavior as react 0.53.0 - When non-string values are given to `setNativeProps({text: ___})`, its behavior is the same as react 0.53.0. - Value Type | Result ---------- | ------------ null | same as empty string '' undefined | nothing changes number | throw error function | throw error object | throw error - When clear() or setNativeProps() called, attributed text keeps the attributes - When `value` prop is set, the text can't be changed - `clear()` doesn't work from the second time - `setNativeProps({text '***'})` doesn't work from the second time - Even when `value` prop is set, you can change the text ![ScreenShot_0.54.0](https://raw.githubusercontent.com/magicien/react-native-textinput-clear/master/screenshot/0.54.0_test.gif) - `clear()` works every time - `setNativeProps({text '****'})` works every time ![ScreenShot_Clear_1](https://raw.githubusercontent.com/magicien/react-native-textinput-clear/master/screenshot/clear_test_1.gif) ![ScreenShot_Clear_2](https://raw.githubusercontent.com/magicien/react-native-textinput-clear/master/screenshot/clear_test_2.gif) - The text keeps the attributes (font family, size, color, text align) ![ScreenShot_Slider](https://raw.githubusercontent.com/magicien/react-native-textinput-clear/master/screenshot/attributed_text_test.gif) - If `value` prop is set, the text should not be changed ![ScreenShot_Value](https://raw.githubusercontent.com/magicien/react-native-textinput-clear/master/screenshot/value_test.gif) [IOS] [BUGFIX] [TextInput] - Fix TextInput.clear() and TextInput.setNativeProps({text: ''}) to work Pull Request resolved: https://github.com/facebook/react-native/pull/18278 Reviewed By: shergin Differential Revision: D9692561 Pulled By: hramos fbshipit-source-id: b7ce8f6740fdf666e71d6a85743331ca4805edcb --- .../Text/TextInput/RCTBaseTextInputShadowView.m | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/Libraries/Text/TextInput/RCTBaseTextInputShadowView.m b/Libraries/Text/TextInput/RCTBaseTextInputShadowView.m index f5a7ca1724754d..de01c9232c2891 100644 --- a/Libraries/Text/TextInput/RCTBaseTextInputShadowView.m +++ b/Libraries/Text/TextInput/RCTBaseTextInputShadowView.m @@ -23,6 +23,7 @@ @implementation RCTBaseTextInputShadowView NSAttributedString *_Nullable _localAttributedText; CGSize _previousContentSize; + NSString *_text; NSTextStorage *_textStorage; NSTextContainer *_textContainer; NSLayoutManager *_layoutManager; @@ -101,6 +102,20 @@ - (void)invalidateContentSize }); } +- (NSString *)text +{ + return _text; +} + +- (void)setText:(NSString *)text +{ + _text = text; + // Clear `_previousAttributedText` to notify the view about the change + // when `text` native prop is set. + _previousAttributedText = nil; + [self dirtyLayout]; +} + #pragma mark - RCTUIManagerObserver - (void)uiManagerWillPerformMounting