LayoutAnimations: when delaying a REMOVE operation, insert operation indices on the same level must also be adjusted

Summary:
This will prevent views from becoming out-of-order as view removals are delayed and there are inserts at the same level.

There is at least one additional issue that crops up if many animations are queued up at the same time, that will be resolved separately.

Changelog: [Internal]

Reviewed By: sammy-SC

Differential Revision: D22130185

fbshipit-source-id: d8041c6afdcd729939dd392c9e2c23fe8ec1b706

ReactCommon/fabric/animations/LayoutAnimationKeyFrameManager.cpp

@@ -716,14 +716,23 @@ LayoutAnimationKeyFrameManager::pullTransaction(
             // instruction will be delayed and therefore may execute outside of
             // otherwise-expected order, other views may be inserted before the
             // Remove is executed, requiring index adjustment.
+            // To be clear: when executed synchronously, REMOVE operations
+            // always come before INSERT operations (at the same level of the
+            // tree hierarchy).
             {
               int adjustedIndex = mutation.index;
-              for (const auto &otherMutation : mutations) {
+              for (auto &otherMutation : mutations) {
                 if (otherMutation.type == ShadowViewMutation::Type::Insert &&
                     otherMutation.parentShadowView.tag == parentTag) {
                   if (otherMutation.index <= adjustedIndex &&
                       !mutatedViewIsVirtual(otherMutation)) {
                     adjustedIndex++;
+                  } else {
+                    // If we are delaying this remove instruction, conversely,
+                    // we must adjust upward the insertion index of any INSERT
+                    // instructions if the View is insert *after* this view in
+                    // the hierarchy.
+                    otherMutation.index++;
                   }
                 }
               }