[Android] Animated.Text nested inside of another Text doesn't animate

[steveccable]

Is this a bug report?

Yes, this is a bug report.

Have you read the Contributing Guidelines?

I have read the contributing guidelines for this repo, and have opened issues before.

Environment

1. react-native -v: 0.48.2
2. node -v: v7.7.2
3. npm -v: 5.0.3

Then, specify:

• Target Platform: This bug only seems to be affecting Android

• Development Operating System: Developing on macOS 10.12.6

• Build tools: Not using any special build tools or specific SDK

Steps to Reproduce

1. Create an Animated.Text that is nested within another Text node
2. Trigger the animation (I am doing this via an onPress on the Animated.Text)

Expected Behavior

Expect that the text will animate, just as it does outside of a Text node (and as it does inside of a Text node on iOS).

Actual Behavior

The text does not animate. All other behavior of the onPress seems to work fine, and the exact same code with only the wrapping Text node removed animates correctly.

Reproducible Demo

https://snack.expo.io/ByK73zw9W

The demo has a comment describing how to see the bug go away, and flipping it over to the iOS simulator rather than android displays the expected behavior regardless of Text nesting.

[alexeymolchan]

Same here, Animated.Text doesn't work when nested in Text on Android

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[steveccable]

I have checked just now and this issue has not been fixed.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[sahrens]

cc @janicduplessis?

[janicduplessis]

I think nested text ends up rendering to a single native view with attributed text so this isn't supported. The best we could do is warn about it I think.

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[steveccable]

The issue is still present in my project (using RN 0.55.2 at time of writing this comment).

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[steveccable]

We upgraded our project to using RN v0.57.8 yesterday and are still seeing this problem occur in our app on Android.

[janicduplessis]

I don't think this will be fixed any time soon, this is a constraint of the current implementation, nested text renders as a single native text component that displays rich text using attributed strings. You'll have to find a way to avoid using nested text to be able to use animations with it.