Fix #18272 TextInput.setNativeProps({text: ''}) to work

[magicien]

Motivation

Fix #18272. Calling textInputRef.setNativeProps({text: ''}) or textInputRef.clear() should clear the text input.

Test Plan

• All tests of yarn run test are passed
• Test with the sample app.
  • 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

react 0.54.0 (with the bug)

• 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

with bugfix

• clear() works every time
• setNativeProps({text '****'}) works every time

Attributed text with bugfix

• The text keeps the attributes (font family, size, color, text align)

value prop with bugfix

• If value prop is set, the text should not be changed

Release Notes

[IOS] [BUGFIX] [TextInput] - Fix TextInput.clear() and TextInput.setNativeProps({text: ''}) to work

[benadamstyles]

What is the status of this? The regression fixed by this PR is holding us back from publishing our app so I'm keen to help out in any way I can!

[magicien]

Thank you! I was testing my changes.
I'm going to update this PR and remove "WIP" soon!

[magicien]

I added Test Plan and removed "WIP" from the title.
How can I solve the CI error? It seems to have nothing to do with this change.

[magicien]

I added an attributed text test. (Thank you @reyalpsirc!)
And it seems that CI errors are fixed.

[shergin]

I am afraid, this is not right approach.
text property must be managed by ShadowView, not UIView instance.

[magicien]

@shergin Thank you for your review!
I looked into the code again, and I guess the problem is that the value of ShadowView is not sync with user input.
If input events are handled correctly, text property doesn't need to be added to UIView instance.
Let me think how to fix it.

[magicien]

I removed text property from RCTBaseTextInputView and added text accessor to RCTBaseTextInputShadowView.
When text native property (or value prop of TextInput component) is explicitly set, text should be compared with the current local text (_localAttributedText) to check if it needs to update.

This change will also fix #18389 (TextInput value not binding on IOS).

[hramos]

@rowinbot it's imported. Once the reviewer accepts the changes, it will land internally and eventually sync out to github.

[react-native-bot]

@magicien merged commit 2307ea6 into facebook:master.

---

Once this commit is added to a release, you will see the corresponding version tag below the description at 2307ea6. If the commit has a single master tag, it is not yet part of a release.

[hramos]

I've turned off these types of notifications from the bot for now.

We check the thread for an existing comment from the bot before adding a new comment. I'll need to look into why this failed on this PR.