From 5002c3edbbd1677ff0469563ee868ee51b30aed3 Mon Sep 17 00:00:00 2001 From: Zeya Peng Date: Mon, 2 Jun 2025 07:15:06 -0700 Subject: [PATCH] (Redo PR #51264) Remove native animation fabric sync in JS and infinite animation loop workaround Summary: ## Changelog: [General] [Changed] - Remove native animation fabric sync in JS and infinite animation loop workaround, when cxxNativeAnimated is enabled when cxxNativeAnimated is enabled, we'll sync native animation props back to Fabric in native, when that happens we can remove the code in JS for same purpose Differential Revision: D75789100 --- .../Libraries/Animated/animations/Animation.js | 7 +++++-- .../src/private/animated/createAnimatedPropsHook.js | 5 ++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/react-native/Libraries/Animated/animations/Animation.js b/packages/react-native/Libraries/Animated/animations/Animation.js index 6587e9189fd8..35f43245bf80 100644 --- a/packages/react-native/Libraries/Animated/animations/Animation.js +++ b/packages/react-native/Libraries/Animated/animations/Animation.js @@ -13,6 +13,7 @@ import type AnimatedNode from '../nodes/AnimatedNode'; import type AnimatedValue from '../nodes/AnimatedValue'; import NativeAnimatedHelper from '../../../src/private/animated/NativeAnimatedHelper'; +import * as ReactNativeFeatureFlags from '../../../src/private/featureflags/ReactNativeFeatureFlags'; import AnimatedProps from '../nodes/AnimatedProps'; export type EndResult = { @@ -149,8 +150,10 @@ export default class Animation { if (value != null) { animatedValue.__onAnimatedValueUpdateReceived(value, offset); - if (this.__isLooping === true) { - return; + if (!ReactNativeFeatureFlags.cxxNativeAnimatedEnabled()) { + if (this.__isLooping === true) { + return; + } } // Once the JS side node is synced with the updated values, trigger an diff --git a/packages/react-native/src/private/animated/createAnimatedPropsHook.js b/packages/react-native/src/private/animated/createAnimatedPropsHook.js index 444ec9eb8e9a..4f76a4fb4cdd 100644 --- a/packages/react-native/src/private/animated/createAnimatedPropsHook.js +++ b/packages/react-native/src/private/animated/createAnimatedPropsHook.js @@ -132,7 +132,10 @@ export default function createAnimatedPropsHook( if (node.__isNative) { // Check 2: this is an animation driven by native. // In native driven animations, this callback is only called once the animation completes. - if (isFabricNode) { + if ( + isFabricNode && + !ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() + ) { // Call `scheduleUpdate` to synchronise Fiber and Shadow tree. // Must not be called in Paper. scheduleUpdate();