Set _borderLayer.frame when border changes

Summary:
Changelog: [Internal]

Setting `_borderLayer.frame` inside `-[RCTViewComponentView layoutSubviews]` causes unwanted animation because it is not wrapped in `CATransaction`.
Moving it to `-[RCTViewComponentView updateLayoutMetrics]` which is called inside `CATransaction`.

Reviewed By: shergin

Differential Revision: D20836890

fbshipit-source-id: 2048a25fd2edb8109f6275c1186c0adae4b9f504

React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm

@@ -54,14 +54,13 @@ - (void)setContentView:(UIView *)contentView
 - (void)layoutSubviews
 {
   [super layoutSubviews];
-
-  if (_borderLayer) {
-    _borderLayer.frame = self.layer.bounds;
-  }
-
-  if (_contentView) {
-    _contentView.frame = RCTCGRectFromRect(_layoutMetrics.getContentFrame());
-  }
+  // Consider whether using `updateLayoutMetrics:oldLayoutMetrics`
+  // isn't more appropriate for your use case. `layoutSubviews` is called
+  // by UIKit while `updateLayoutMetrics:oldLayoutMetrics` is called
+  // by React Native Renderer within `CATransaction`.
+  // If you are calling `setFrame:` or other methods that cause
+  // `layoutSubviews` to be triggered, `_contentView`'s and `_borderLayout`'s
+  // frames might get out of sync with `self.bounds`.
 }
 
 - (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
@@ -258,6 +257,14 @@ - (void)updateLayoutMetrics:(LayoutMetrics const &)layoutMetrics
 
   _layoutMetrics = layoutMetrics;
   _needsInvalidateLayer = YES;
+
+  if (_borderLayer) {
+    _borderLayer.frame = self.layer.bounds;
+  }
+
+  if (_contentView) {
+    _contentView.frame = RCTCGRectFromRect(_layoutMetrics.getContentFrame());
+  }
 }
 
 - (void)finalizeUpdates:(RNComponentViewUpdateMask)updateMask