Add Fantom integration tests for core public APIs

Summary:
Adds Fantom `-itest.js` coverage for maintained, public React Native APIs that were previously untested or thinly tested, driving both the JavaScript logic and the underlying cross-platform C++ through the public `react-native` package surface.

New test files:
- `Animated/__tests__/SpringAnimation-itest.js`, `DecayAnimation-itest.js`, `AnimatedColor-itest.js`, `AnimatedComposition-itest.js` — spring/decay animations (JS and native driver), `Animated.Color` value semantics, and the composition nodes (`add`/`subtract`/`multiply`/`divide`/`modulo`/`diffClamp`/tracking).
- `Components/View/__tests__/View-nativeCSSParsing-itest.js` — string-valued CSS (color functions, transform, gradients) parsed via native CSS parsing.
- `Pressability/__tests__/Pressability-touch-itest.js` — press in/out/press, long press, press delay, and responder termination via touch events and the deterministic timer mock.
- `Interaction/__tests__/PanResponder-itest.js` — grant/move/release/terminate and gesture state across touch sequences.
- `LayoutAnimation/__tests__/LayoutAnimation-itest.js` — `configureNext`/`create`/presets applying the resulting layout.
- `Network/__tests__/Network-itest.js` — synchronous `XMLHttpRequest` lifecycle and validation.

Extended test files:
- `Components/TextInput/__tests__/TextInput-itest.js` — `onSelectionChange`/`onSubmitEditing`/`onKeyPress`/`onEndEditing` events.
- `Lists/__tests__/FlatList-itest.js` — `onViewableItemsChanged` via `viewabilityConfig` and `viewabilityConfigCallbackPairs`.
- `Text/__tests__/Text-itest.js` — `letterSpacing`, `lineHeight`, and `fontVariant` styles.

The JS-driver decay test asserts that the animation completes (which exercises `onUpdate`) rather than asserting per-frame movement, since the `requestAnimationFrame`-based decay does not expose stable intermediate frame values under the test runner's virtual clock.

This is a test-only change with no runtime or user-facing impact.

Changelog:
[Internal]

Differential Revision: D110784436

Author: rubennorte

packages/react-native/Libraries/Animated/__tests__/AnimatedColor-itest.js

@@ -0,0 +1,127 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+import '@react-native/fantom/src/setUpDefaultReactNativeEnvironment';
+
+import type {HostInstance} from 'react-native';
+
+import ensureInstance from '../../../src/private/__tests__/utilities/ensureInstance';
+import * as Fantom from '@react-native/fantom';
+import {createRef} from 'react';
+import {Animated, useAnimatedColor} from 'react-native';
+import ReactNativeElement from 'react-native/src/private/webapis/dom/nodes/ReactNativeElement';
+
+describe('Animated.Color value semantics', () => {
+  it('defaults to opaque black', () => {
+    const color = new Animated.Color();
+    expect(color.__getValue()).toBe('rgba(0, 0, 0, 1)');
+  });
+
+  it('parses an rgba() string into channels', () => {
+    const color = new Animated.Color('rgba(255, 128, 0, 1)');
+    expect(color.__getValue()).toBe('rgba(255, 128, 0, 1)');
+    expect(color.r.__getValue()).toBe(255);
+    expect(color.g.__getValue()).toBe(128);
+    expect(color.b.__getValue()).toBe(0);
+    expect(color.a.__getValue()).toBe(1);
+  });
+
+  it('parses a hex string into channels', () => {
+    const color = new Animated.Color('#ff0000');
+    expect(color.__getValue()).toBe('rgba(255, 0, 0, 1)');
+  });
+
+  it('accepts an rgba object', () => {
+    const color = new Animated.Color({r: 10, g: 20, b: 30, a: 0.5});
+    expect(color.__getValue()).toBe('rgba(10, 20, 30, 0.5)');
+  });
+
+  it('accepts individual AnimatedValues for each channel', () => {
+    const color = new Animated.Color({
+      r: new Animated.Value(1),
+      g: new Animated.Value(2),
+      b: new Animated.Value(3),
+      a: new Animated.Value(1),
+    });
+    expect(color.__getValue()).toBe('rgba(1, 2, 3, 1)');
+  });
+
+  it('updates all channels via setValue and notifies listeners', () => {
+    const color = new Animated.Color('rgba(0, 0, 0, 1)');
+    const listener = jest.fn();
+    color.addListener(listener);
+
+    color.setValue({r: 5, g: 6, b: 7, a: 1});
+
+    expect(color.__getValue()).toBe('rgba(5, 6, 7, 1)');
+    expect(listener).toHaveBeenCalled();
+  });
+
+  it('applies and flattens an offset', () => {
+    const color = new Animated.Color({r: 10, g: 10, b: 10, a: 1});
+    color.setOffset({r: 5, g: 5, b: 5, a: 0});
+    expect(color.__getValue()).toBe('rgba(15, 15, 15, 1)');
+
+    color.flattenOffset();
+    expect(color.r.__getValue()).toBe(15);
+
+    color.setOffset({r: 1, g: 1, b: 1, a: 0});
+    color.extractOffset();
+    // extractOffset moves the base into the offset, leaving the composed value
+    // unchanged.
+    expect(color.__getValue()).toBe('rgba(16, 16, 16, 1)');
+  });
+});
+
+describe('Animated.Color rendering', () => {
+  it('drives backgroundColor and animates to a target color', () => {
+    let color: Animated.Color = new Animated.Color();
+    const viewRef = createRef<HostInstance>();
+
+    function MyApp() {
+      const animatedColor = useAnimatedColor('rgba(255, 0, 0, 1)');
+      color = animatedColor;
+      return (
+        <Animated.View
+          ref={viewRef}
+          style={{width: 100, height: 100, backgroundColor: animatedColor}}
+        />
+      );
+    }
+
+    const root = Fantom.createRoot();
+    Fantom.runTask(() => {
+      root.render(<MyApp />);
+    });
+
+    ensureInstance(viewRef.current, ReactNativeElement);
+
+    expect(
+      root.getRenderedOutput({props: ['backgroundColor']}).toJSX(),
+    ).toEqual(<rn-view backgroundColor="rgba(255, 0, 0, 1)" />);
+
+    let finished = false;
+    Fantom.runTask(() => {
+      Animated.timing(color, {
+        toValue: {r: 0, g: 0, b: 255, a: 1},
+        duration: 100,
+        useNativeDriver: false,
+      }).start(result => {
+        finished = result.finished;
+      });
+    });
+
+    Fantom.unstable_produceFramesForDuration(200);
+    Fantom.runWorkLoop();
+
+    expect(finished).toBe(true);
+    expect(color.__getValue()).toBe('rgba(0, 0, 255, 1)');
+  });
+});

packages/react-native/Libraries/Animated/__tests__/AnimatedComposition-itest.js

@@ -0,0 +1,196 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+import '@react-native/fantom/src/setUpDefaultReactNativeEnvironment';
+
+import type {HostInstance} from 'react-native';
+
+import ensureInstance from '../../../src/private/__tests__/utilities/ensureInstance';
+import * as Fantom from '@react-native/fantom';
+import {createRef} from 'react';
+import {Animated, useAnimatedValue} from 'react-native';
+import ReactNativeElement from 'react-native/src/private/webapis/dom/nodes/ReactNativeElement';
+
+// Renders an <Animated.View> whose translateX is driven by `makeNode(base)` and
+// returns the base AnimatedValue plus the mounted element so tests can mutate the
+// base and observe the derived value on the shadow tree.
+function renderWithDerivedTranslateX(
+  makeNode: (base: Animated.Value) => Animated.WithAnimatedValue<number>,
+): {base: Animated.Value, element: ReactNativeElement, root: Fantom.Root} {
+  let base: Animated.Value = new Animated.Value(0);
+  const viewRef = createRef<HostInstance>();
+
+  function MyApp() {
+    const value = useAnimatedValue(0);
+    base = value;
+    return (
+      <Animated.View
+        ref={viewRef}
+        style={[
+          {width: 100, height: 100},
+          {transform: [{translateX: makeNode(value)}]},
+        ]}
+      />
+    );
+  }
+
+  const root = Fantom.createRoot();
+  Fantom.runTask(() => {
+    root.render(<MyApp />);
+  });
+
+  const element = ensureInstance(viewRef.current, ReactNativeElement);
+  return {base, element, root};
+}
+
+function getTranslateX(root: Fantom.Root): number {
+  const output = root.getRenderedOutput({props: ['transform']}).toJSONObject();
+  const transform = JSON.parse(output.props.transform);
+  return transform[0].translateX;
+}
+
+describe('Animated.subtract', () => {
+  it('computes the difference of two values and reacts to updates', () => {
+    const {base, root} = renderWithDerivedTranslateX(value =>
+      Animated.subtract(100, value),
+    );
+
+    expect(getTranslateX(root)).toBe(100);
+
+    Fantom.runTask(() => {
+      base.setValue(30);
+    });
+
+    expect(getTranslateX(root)).toBe(70);
+  });
+});
+
+describe('Animated.divide', () => {
+  it('computes the quotient of two values and reacts to updates', () => {
+    const {base, root} = renderWithDerivedTranslateX(value =>
+      Animated.divide(value, 2),
+    );
+
+    Fantom.runTask(() => {
+      base.setValue(80);
+    });
+
+    expect(getTranslateX(root)).toBe(40);
+  });
+
+  it('returns 0 instead of Infinity when dividing by zero', () => {
+    const node = Animated.divide(10, 0);
+    expect(node.__getValue()).toBe(0);
+  });
+});
+
+describe('Animated.modulo', () => {
+  it('wraps values into the [0, modulus) range for positive and negative inputs', () => {
+    const {base, root} = renderWithDerivedTranslateX(value =>
+      Animated.modulo(value, 10),
+    );
+
+    Fantom.runTask(() => {
+      base.setValue(25);
+    });
+    expect(getTranslateX(root)).toBe(5);
+
+    Fantom.runTask(() => {
+      base.setValue(-3);
+    });
+    // ((-3 % 10) + 10) % 10 === 7
+    expect(getTranslateX(root)).toBe(7);
+  });
+});
+
+describe('Animated.diffClamp', () => {
+  // `AnimatedDiffClamp.__getValue()` mutates internal accumulator state on every
+  // call, so it is driven directly here (rather than through the render/commit
+  // pipeline, which may read the node an unpredictable number of times).
+  it('clamps the accumulated delta between min and max', () => {
+    const base = new Animated.Value(0);
+    const clamped = Animated.diffClamp(base, 0, 20);
+
+    expect(clamped.__getValue()).toBe(0);
+
+    // Increase beyond max: 0 + 100 clamped to 20.
+    base.setValue(100);
+    expect(clamped.__getValue()).toBe(20);
+
+    // Decrease by 30: 20 + (70 - 100) = -10, clamped to 0.
+    base.setValue(70);
+    expect(clamped.__getValue()).toBe(0);
+
+    // Increase by 5: 0 + (75 - 70) = 5, within range.
+    base.setValue(75);
+    expect(clamped.__getValue()).toBe(5);
+  });
+});
+
+describe('Animated.add and Animated.multiply', () => {
+  it('compose additions and multiplications', () => {
+    const {base, root} = renderWithDerivedTranslateX(value =>
+      Animated.add(Animated.multiply(value, 2), 10),
+    );
+
+    Fantom.runTask(() => {
+      base.setValue(20);
+    });
+
+    // 20 * 2 + 10 = 50
+    expect(getTranslateX(root)).toBe(50);
+  });
+});
+
+describe('Animated tracking (toValue is an AnimatedNode)', () => {
+  it('follows the target value when animating toward another AnimatedValue', () => {
+    let follower: Animated.Value = new Animated.Value(0);
+    let leader: Animated.Value = new Animated.Value(0);
+    const viewRef = createRef<HostInstance>();
+
+    function MyApp() {
+      const followerValue = useAnimatedValue(0);
+      const leaderValue = useAnimatedValue(0);
+      follower = followerValue;
+      leader = leaderValue;
+      return (
+        <Animated.View
+          ref={viewRef}
+          style={[
+            {width: 100, height: 100},
+            {transform: [{translateX: followerValue}]},
+          ]}
+        />
+      );
+    }
+
+    const root = Fantom.createRoot();
+    Fantom.runTask(() => {
+      root.render(<MyApp />);
+    });
+
+    Fantom.runTask(() => {
+      Animated.timing(follower, {
+        toValue: leader,
+        duration: 100,
+        useNativeDriver: true,
+      }).start();
+    });
+
+    Fantom.runTask(() => {
+      leader.setValue(50);
+    });
+
+    Fantom.unstable_produceFramesForDuration(200);
+    Fantom.runWorkLoop();
+
+    expect(getTranslateX(root)).toBeCloseTo(50, 1);
+  });
+});

packages/react-native/Libraries/Animated/__tests__/DecayAnimation-itest.js

@@ -0,0 +1,59 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+import '@react-native/fantom/src/setUpDefaultReactNativeEnvironment';
+
+import DecayAnimation from '../animations/DecayAnimation';
+import * as Fantom from '@react-native/fantom';
+import {Animated} from 'react-native';
+
+describe('Animated.decay', () => {
+  it('builds a native decay config with the provided velocity and deceleration', () => {
+    const withDefaults = new DecayAnimation({
+      velocity: 2,
+      useNativeDriver: false,
+    });
+    const defaultConfig = withDefaults.__getNativeAnimationConfig();
+    expect(defaultConfig.type).toBe('decay');
+    expect(defaultConfig.velocity).toBe(2);
+    expect(defaultConfig.deceleration).toBe(0.998);
+
+    const custom = new DecayAnimation({
+      velocity: -1,
+      deceleration: 0.9,
+      useNativeDriver: false,
+    });
+    const customConfig = custom.__getNativeAnimationConfig();
+    expect(customConfig.velocity).toBe(-1);
+    expect(customConfig.deceleration).toBe(0.9);
+  });
+
+  it('runs the JS decay animation to completion', () => {
+    const value = new Animated.Value(0);
+
+    let finished = false;
+    Fantom.runTask(() => {
+      Animated.decay(value, {
+        velocity: 1,
+        useNativeDriver: false,
+      }).start(result => {
+        finished = result.finished;
+      });
+    });
+
+    // Drive the `requestAnimationFrame`-based JS decay to rest. Fantom's virtual
+    // clock does not deterministically expose intermediate frame values for the
+    // JS driver, so we assert that the animation completes (which exercises
+    // `onUpdate`) rather than asserting per-frame movement.
+    Fantom.unstable_produceFramesForDuration(3000);
+
+    expect(finished).toBe(true);
+  });
+});