TextInput not reflecting the correct text value

[khetanashita]

Steps to Reproduce

(Write your steps here:)
When the text prop update happens back to back quickly and programmatically (not via user interaction), the latest update request is ignored.

Basic Triage

(Write what you thought would happen.)
The Js side gets updated as expected and an update is triggered to the native side as well, but I think it's ignored in the TextInputViewManager because of this condition:

else if (propertyName == "text") {
 if (m_mostRecentEventCount == m_nativeEventCount) {
   .
   .
   .
  }
} 

The event counts for native and javascript are out of sync. If I manipulate those values it updates correctly.

[chrisglein]

@ahimberg There's some history here with interactions with Redux that I'm told you might be aware of. Can you describe or link to a discussion about this?

@khetanashita Are you using Redux or something similar? Also, can we get more info on the repro so we can start working towards a standalone repro on this?

This issue lacks the environment info requested in the bug template. Please edit your issue report to add this information.

If you are using latest version:

1. react-native -v:
2. react-native run-windows --info:

Otherwise if --info doesn't exist:

1. react-native -v:
2. npm ls rnpm-plugin-windows:
3. npm ls react-native-windows:
4. node -v:
5. npm -v:
6. yarn --version:

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within 14 days of this comment.

[khetanashita]

Yes we are using Redux. I was able to repro the issue using Samples/textinput.tsx in the playground app (v0.60). The code looked something like this:

state = {
  testCounter: 1,
};

onPressChangeText = () => {
  var testCounter = ++this.state.testCounter;
  this.setState({testCounter: testCounter});
};

render() {
  console.log('Counter value: ' + this.state.testCounter);
  return (
    <View style={styles.container}>
      <TextInput
        style={styles.input}
        defaultValue={this.state.testCounter + ''}
      />
      <Button title={'Change text'} onPress={this.onPressChangeText} />
    </View>
  );
}