diff --git a/change/react-native-windows-9aaace3c-20a8-4c24-90b2-d777742f65ba.json b/change/react-native-windows-9aaace3c-20a8-4c24-90b2-d777742f65ba.json new file mode 100644 index 00000000000..b564de4ff87 --- /dev/null +++ b/change/react-native-windows-9aaace3c-20a8-4c24-90b2-d777742f65ba.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "If initial value is set, updated TextInput.value changes will not be reflected", + "packageName": "react-native-windows", + "email": "30809111+acoates-ms@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/vnext/Microsoft.ReactNative/Views/TextInputViewManager.cpp b/vnext/Microsoft.ReactNative/Views/TextInputViewManager.cpp index 8324c21d818..07ee10374ac 100644 --- a/vnext/Microsoft.ReactNative/Views/TextInputViewManager.cpp +++ b/vnext/Microsoft.ReactNative/Views/TextInputViewManager.cpp @@ -132,6 +132,7 @@ class TextInputShadowNode : public ShadowNodeBase { void SetSelection(int64_t start, int64_t end); winrt::Shape FindCaret(xaml::DependencyObject element); + bool m_initialUpdateComplete = false; bool m_shouldClearTextOnFocus = false; bool m_shouldSelectTextOnFocus = false; bool m_contextMenuHidden = false; @@ -171,6 +172,9 @@ void TextInputShadowNode::createView(const winrt::Microsoft::ReactNative::JSValu } void TextInputShadowNode::dispatchTextInputChangeEvent(winrt::hstring newText) { + if (!m_initialUpdateComplete) { + return; + } m_nativeEventCount++; folly::dynamic eventData = folly::dynamic::object("target", m_tag)("text", react::uwp::HstringToDynamic(newText))( "eventCount", m_nativeEventCount); @@ -195,14 +199,20 @@ void TextInputShadowNode::registerEvents() { // another TextChanged event with correct event count. if (m_isTextBox) { m_passwordBoxPasswordChangingRevoker = {}; - m_textBoxTextChangingRevoker = control.as().TextChanging( - winrt::auto_revoke, [=](auto &&, auto &&) { m_nativeEventCount++; }); + m_textBoxTextChangingRevoker = + control.as().TextChanging(winrt::auto_revoke, [=](auto &&, auto &&) { + if (m_initialUpdateComplete) + m_nativeEventCount++; + }); } else { m_textBoxTextChangingRevoker = {}; if (control.try_as()) { - m_passwordBoxPasswordChangingRevoker = control.as().PasswordChanging( - winrt::auto_revoke, [=](auto &&, auto &&) { m_nativeEventCount++; }); + m_passwordBoxPasswordChangingRevoker = + control.as().PasswordChanging(winrt::auto_revoke, [=](auto &&, auto &&) { + if (m_initialUpdateComplete) + m_nativeEventCount++; + }); } } @@ -603,6 +613,7 @@ void TextInputShadowNode::updateProperties(winrt::Microsoft::ReactNative::JSValu Super::updateProperties(props); m_updating = false; + m_initialUpdateComplete = true; } void TextInputShadowNode::SetText(const winrt::Microsoft::ReactNative::JSValue &text) { diff --git a/vnext/src/Libraries/Components/TextInput/TextInput.windows.js b/vnext/src/Libraries/Components/TextInput/TextInput.windows.js index 74b3d60e1b3..63c033e78f2 100644 --- a/vnext/src/Libraries/Components/TextInput/TextInput.windows.js +++ b/vnext/src/Libraries/Components/TextInput/TextInput.windows.js @@ -1162,6 +1162,7 @@ function InternalTextInput(props: Props): React.Node { ref={_setNativeRef} {...props} dataDetectorTypes={props.dataDetectorTypes} + mostRecentEventCount={mostRecentEventCount} onBlur={_onBlur} onChange={_onChange} onContentSizeChange={props.onContentSizeChange}