Fix cursor positioning on android on markdown style change

[Skalakid]

Details

Related Issues

https://github.com/Expensify/App/issues/40504

Manual Tests

1. Modify the MarkdownTextInput component in App. tsx with the following code:

    <MarkdownTextInput
       multiline
       autoCapitalize="none"
       value={value}
       onChangeText={(val) => {
         if (val.includes(':+1:'))r {
           setMarkdownStyle({emoji: {fontSize: 30}});
         }
         setValue(val.replaceAll(':+1:', '👍'));
       }}
       style={styles.input}
       ref={ref}
       markdownStyle={markdownStyle}
       placeholder="Type here..."
       onSelectionChange={(e) => setSelection(e.nativeEvent.selection)}
       selection={selection}
     />

2. Clear the whole text
3. Enter :+1:
4. Check if the cursor is positioned correctly (after the emoji)

Linked PRs

[robertKozik]

@Skalakid Is it testable in example app?

[BartoszGrajdek]

@Skalakid Is it testable in example app?

Bump 👀

Please add some test steps 🙏🏻

[Skalakid]

@BartoszGrajdek @robertKozik Sorry, I forgot to add test steps. The issue is in E/App because we are changing text and styles (for example changing :+1: into an emoji). We can reproduce it in our example app only after app modifying App.tsx file. For example:

      <MarkdownTextInput
        multiline
        autoCapitalize="none"
        value={value}
        onChangeText={(val) => {
          if (val.includes(':+1:'))r {
            setMarkdownStyle({emoji: {fontSize: 30}});
          }
          setValue(val.replaceAll(':+1:', '👍'));
        }}
        style={styles.input}
        ref={ref}
        markdownStyle={markdownStyle}
        placeholder="Type here..."
        onSelectionChange={(e) => setSelection(e.nativeEvent.selection)}
        selection={selection}
      />

I updated the test steps ;)