Text: fix selectable prop not working correctly on initial render (#50822)

Summary:
Fixes https://github.com/facebook/react-native/issues/50010

On the initial render of a Text with the `selectable` prop set as `true`, the Text view is not making itself selectable. I debugged this quite a lot, and by changing the state from false to true using `setState` on the JS side, I made it work.

It turns out that we are setting this property in `onAttachedToWindow`, but somehow if `super.setTextIsSelectable` was already set as `true`, it won't re-apply it and we have to reset it to false before setting it again to true. This PR adds this reset.

I couldn't understand yet why this is not breaking in Fabric.

## Changelog:

[ANDROID] [FIXED] - Fix `selectable` prop not working correctly on initial render (old-arch)

Pull Request resolved: https://github.com/facebook/react-native/pull/50822

Test Plan:
- Test in both Fabric and Paper architectures to ensure there won't be a regression with this change in Fabric, as the issue occurs only in Paper.

- To test this, I created a small example in the RN-Tester playground to toggle the selectable property on/off. Notice in the first video that initially the prop is set as true, but it won't allow selecting. If you toggle to false and then back to true again, it works. With the provider fix it should also allow selecting the text on initial render.

Use this code snippet:

```tsx
function Playground() {
  const [selectable, setSelectable] = React.useState(true);

  return (
    <View style={styles.container}>
      <Text selectable={selectable} selectionColor="blue">
        TESTING: is selectable? {selectable ? 'true' : 'false'}
      </Text>
      <Button title="Press me" onPress={() => setSelectable(!selectable)} />
    </View>
  );
}
```

Videos:

<details>
<summary>Before</summary>

https://github.com/user-attachments/assets/6a24dd0d-7f45-4a38-b18d-5142801ea1c3

</details>

<details>
<summary>After</summary>

https://github.com/user-attachments/assets/ce5f9e6e-9a4c-44d7-9d97-f607f2fdc1b4

</details>

Reviewed By: cortinico

Differential Revision: D73421487

Pulled By: rshest

fbshipit-source-id: c0b9d76076ef2e05930996953015fb58ad2a3d5f
This commit is contained in:
Mateo Guzmán
2025-04-23 02:21:52 -07:00
committed by Facebook GitHub Bot
parent 45160b64af
commit 5ed486cc8f
@@ -542,7 +542,16 @@ public class ReactTextView extends AppCompatTextView implements ReactCompoundVie
@Override
public void onAttachedToWindow() {
super.onAttachedToWindow();
setTextIsSelectable(mTextIsSelectable);
// This is a workaround to ensure the text becomes selectable as it doesn't work if we call
// `setTextIsSelectable(true)` directly when setTextIsSelectable was already true.
if (mTextIsSelectable) {
setTextIsSelectable(false);
setTextIsSelectable(true);
} else {
setTextIsSelectable(false);
}
if (mContainsImages && getText() instanceof Spanned) {
Spanned text = (Spanned) getText();
TextInlineImageSpan[] spans = text.getSpans(0, text.length(), TextInlineImageSpan.class);