From 7bd4a5496815943b031b68ca46792560d8d798d8 Mon Sep 17 00:00:00 2001
From: Tim Yung <yungsters@meta.com>
Date: Sat, 14 Sep 2024 22:21:27 -0700
Subject: [PATCH] Animated: Restore `AnimatedNode.prototype.toJSON` (#46498)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46498

Looks like this is still necessary because we still run into this error when using the Components tab when using React DevTools:

> TypeError: cyclical structure in JSON object

This effectively reverts https://github.com/facebook/react-native/pull/46382.

Changelog:
[General][Changed] - AnimatedNode (and its subclasses) once again implement `toJSON()`.

Reviewed By: javache

Differential Revision: D62690380

fbshipit-source-id: d5b7c1d156b49838abefe48a7d7b61471cc3488a
---
 .../Libraries/Animated/__tests__/Animated-test.js         | 4 ++++
 .../react-native/Libraries/Animated/nodes/AnimatedNode.js | 8 ++++++++
 .../__tests__/__snapshots__/public-api-test.js.snap       | 1 +
 3 files changed, 13 insertions(+)

diff --git a/packages/react-native/Libraries/Animated/__tests__/Animated-test.js b/packages/react-native/Libraries/Animated/__tests__/Animated-test.js
index 354bd521630871..53f2af95717d10 100644
--- a/packages/react-native/Libraries/Animated/__tests__/Animated-test.js
+++ b/packages/react-native/Libraries/Animated/__tests__/Animated-test.js
@@ -162,6 +162,10 @@ describe('Animated tests', () => {
       expect(anim.__getValue()).toBe(15);
     });
 
+    it('convert to JSON', () => {
+      expect(JSON.stringify(new Animated.Value(10))).toBe('10');
+    });
+
     it('bypasses `setNativeProps` in test environments', async () => {
       const opacity = new Animated.Value(0);
 
diff --git a/packages/react-native/Libraries/Animated/nodes/AnimatedNode.js b/packages/react-native/Libraries/Animated/nodes/AnimatedNode.js
index 1835d43ec67df4..a3dd21236396e9 100644
--- a/packages/react-native/Libraries/Animated/nodes/AnimatedNode.js
+++ b/packages/react-native/Libraries/Animated/nodes/AnimatedNode.js
@@ -189,4 +189,12 @@ export default class AnimatedNode {
   __setPlatformConfig(platformConfig: ?PlatformConfig) {
     this._platformConfig = platformConfig;
   }
+
+  /**
+   * NOTE: This is intended to prevent `JSON.stringify` from throwing "cyclic
+   * structure" errors in React DevTools. Avoid depending on this!
+   */
+  toJSON(): mixed {
+    return this.__getValue();
+  }
 }
diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
index 00b85b64cbe8c0..7fd38d248d6f12 100644
--- a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
+++ b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
@@ -933,6 +933,7 @@ exports[`public API should not change unintentionally Libraries/Animated/nodes/A
   __getNativeConfig(): Object;
   __getPlatformConfig(): ?PlatformConfig;
   __setPlatformConfig(platformConfig: ?PlatformConfig): void;
+  toJSON(): mixed;
 }
 "
 `;