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

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

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 14
  • Comments: 15

Most upvoted comments

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.