mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Luna Wei
20b4879dfd
Summary: [Android] [Fixed] - LayoutAnimations cause invalid view operations The dating team has found a consistent repro where following an order of steps will get you the following exception: https://lookaside.facebook.com/intern/pixelcloudnew/asset/?id=2113362972287761 The exception is due to the fact that the following operation `delete child tag 17 from parent tag 481 which is located at index 2` cannot be performed because parent tag 481 only has 2 children.. and they also happen to not have the tag 17 as a child. Somehow the operations and the tree they act upon are out of sync. RN receives operations from React via the native module `UIManagerModule`. The operations use tags (an identifier for a view) and indices to determine what view is updated. These operations (grouped together as a batch) are then passed to the UI thread where we perform them on the platform views. LayoutAnimations are implemented per batch in RN. When LayoutAnimations are on, qualified view updates are animated. Because the delete operation is animated, RN doesn't remove the view from the platform view hierarchy immediately but asynchronously -- after the animation is complete. This is problematic for other view operations that rely on an index on where to insert or delete a view because during the creation of those operations, it was assumed all prior operations were performed synchronously. This is what was occurring in the repro and there were silent view errors occurring before the exception was thrown. This diff proposes a solution to track all pending delete operations across operations. We introduce a map that is keyed on view tags and has a value of a sparse array that represents child index -> count of views that are pending deletion. `{11: [0=1], 481: [2=1]}` where this would be interpreted as for index 0 under view tag 11, there is one async view deletion that has not completed and under tag 481 there is one async view deletion at index 2. We use the map to adjust indices on add / delete operations. We also update the count when the deletion animation is complete and remove the tag from the map when it is deleted. Regarding worst case sizing of the map => O(# of platform views rendered) Reviewed By: mdvacca Differential Revision: D14529038 fbshipit-source-id: 86d8982845e25a2b23d6d89ce27852fd77dbb060
Building React Native for Android
See the docs on the website.
Running tests
When you submit a pull request CircleCI will automatically run all tests. To run tests locally, see Testing.