[Modal] bug when LayoutAnimation is not "consumed": NSInternalInconsistencyException: Could not locate shadow view with tag #x

[benadamstyles]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 7.8.0
Yarn: 1.0.1
npm: 4.2.0
Watchman: 4.7.0
Xcode: Xcode 9.0 Build version 9A235
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.0.0-alpha.12 => 16.0.0-alpha.12
react-native: 0.48.4 => 0.48.4

Target Platform: iOS (11)

Steps to Reproduce

1. Show a Modal
2. Call an animation API (I can't work out if this happens with LayoutAnimation only, or also with Animated)
3. Hide the Modal

Expected Behavior

The Modal should be correctly dismissed.

Actual Behavior

The Modal is dismissed as expected, but then immediately shows again, and the app crashes with the above error in the simulator. In the Snack demo below and on a physical device, the app does not crash, but the interface is unresponsive. However, text inputs are still able to be focused (correctly bringing up the keyboard), and ScrollViews are still scrollable.

Reproducible Demo

https://snack.expo.io/rJa7CJWhb

[benadamstyles]

Ok a little more investigation: this appears to be confined to LayoutAnimation, and the bug goes away if the animation queued up by LayoutAnimation.<method>() is actually used.

Here is another repro which has two buttons, Trigger animation (used) and Trigger animation (unused): https://snack.expo.io/SkkjMxW2-

If you tap the used one and dismiss the modal, the bug doesn't happen.

If you tap the unused one, it does.

In conclusion: if you call a LayoutAnimation method but don't then "consume" that animation, and then you dismiss a Modal, the queued animation gets applied to the Modal somehow and this results in the Modal getting shown again but being unresponsive because it is theoretically still "not shown".

This is new behaviour, and was not happening in react-native v0.47.

[smrpl6]

Same problem there

[jslok]

+1

[arminsal1]

Also dealing with this problem

[makirby]

Very much encountering the same warning, has appeared after upgrading from RN 0.48. Does anyone have any tips on canceling or dequeuing layout animations?

[davidck]

Just ran into this (RN 0.49.5), been debugging this for hours thinking it's an updated behaviour of RN 0.49 affecting race conditions. Disabled LayoutAnimation for now.

[jackkinsella]

Having the exact same issue. I tried using LayoutAnimation in a parent component and then isolating the Modal into a subcomponent (ModalManager) without LayoutAnimation, but this didn't help either.

[benadamstyles]

@jackkinsella Yeah, as I understand it LayoutAnimation applies globally

[Tennen]

+1

[darkfiredarkhalo]

+1

[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.

[benadamstyles]

This issue has had no resolution and clearly still affects people. For these reasons I think it should be reopened.

[DanGDroid]

#15698

[react-native-bot]

Thanks for posting this! It looks like you may not be using the latest version of React Native, v0.53.0, released on January 2018. Can you make sure this issue can still be reproduced in the latest version?

I am going to close this, but please feel free to open a new issue if you are able to confirm that this is still a problem in v0.53.0 or newer.

_{How to Contribute • What to Expect from Maintainers}

[Voxguru]

Hi, This bug is still. preset in v0.53.0 or newer.