diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm b/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm index c9e551b96b6ef2..a015c450ee21b7 100644 --- a/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm +++ b/packages/react-native/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm @@ -28,7 +28,7 @@ @implementation RCTViewComponentView { UIColor *_backgroundColor; - CALayer *_borderLayer; + __weak CALayer *_borderLayer; BOOL _needsInvalidateLayer; BOOL _isJSResponder; BOOL _removeClippedSubviews; @@ -404,9 +404,7 @@ - (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics _layoutMetrics = layoutMetrics; _needsInvalidateLayer = YES; - if (_borderLayer) { - _borderLayer.frame = self.layer.bounds; - } + _borderLayer.frame = self.layer.bounds; if (_contentView) { _contentView.frame = RCTCGRectFromRect(_layoutMetrics.getContentFrame()); @@ -610,10 +608,7 @@ - (void)invalidateLayer if (useCoreAnimationBorderRendering) { layer.mask = nil; - if (_borderLayer) { - [_borderLayer removeFromSuperlayer]; - _borderLayer = nil; - } + [_borderLayer removeFromSuperlayer]; layer.borderWidth = (CGFloat)borderMetrics.borderWidths.left; CGColorRef borderColor = RCTCreateCGColorRefFromSharedColor(borderMetrics.borderColors.left); @@ -626,11 +621,12 @@ - (void)invalidateLayer layer.backgroundColor = backgroundColor; } else { if (!_borderLayer) { - _borderLayer = [CALayer new]; - _borderLayer.zPosition = -1024.0f; - _borderLayer.frame = layer.bounds; - _borderLayer.magnificationFilter = kCAFilterNearest; - [layer addSublayer:_borderLayer]; + CALayer *borderLayer = [CALayer new]; + borderLayer.zPosition = -1024.0f; + borderLayer.frame = layer.bounds; + borderLayer.magnificationFilter = kCAFilterNearest; + [layer addSublayer:borderLayer]; + _borderLayer = borderLayer; } layer.backgroundColor = nil; @@ -671,6 +667,10 @@ - (void)invalidateLayer } } + // If mutations are applied inside of Animation block, it may cause _borderLayer to be animated. + // To stop that, imperatively remove all animations from _borderLayer. + [_borderLayer removeAllAnimations]; + // Stage 2.5. Custom Clipping Mask CAShapeLayer *maskLayer = nil; CGFloat cornerRadius = 0;