Expensify / react-native-live-markdown

Drop-in replacement for React Native's TextInput component with Markdown formatting.
https://www.npmjs.com/package/@expensify/react-native-live-markdown
MIT License
670 stars 45 forks source link

Fix selection getting lost on Android on the new arch #335

Closed j-piasecki closed 2 months ago

j-piasecki commented 2 months ago

Details

The commit hook is updating the native state of the decorated text input on every shadow tree commit to override the default measurement method. Since the attributed string with the content of the input is also kept in the state, this was causing the state of the native ReactEditText to be updated on every commit, which effectively meant creating a new spannable on every commit and in turn losing the selection spans.

This PR changes the update to also set the event counter to -1 when it doesn't change between updates, which effectively makes the java part of the state updates a no-op in those cases, similarly to how it's done in the core of RN: https://github.com/facebook/react-native/blob/67392cef3c8e036adfd9f77808419221d70f8f18/packages/react-native/ReactCommon/react/renderer/components/textinput/platform/android/react/renderer/components/androidtextinput/AndroidTextInputShadowNode.cpp#L155-L163

(-1 instead of 0, like above, because 0 would be the most recent counter during the first render)

Always setting the event counter to -1 also seemed to work fine but after quite a while of figuring out issues due to lost state updates in commit hooks, I'm not sure if we want to go that far now. It's something we may want to investigate in the future though.

Before After

Manual Tests

This is testable in the example app, simply select some text. The handles should appear and be draggable. The text editing part should also work correctly.