Manual test fixes

apps/common-app/src/examples/RuntimeTests/tests/advancedAPI/useFrameCallback.test.tsx

@@ -39,7 +39,7 @@ describe('Test *****useFrameCallback*****', () => {
       await wait(timeToStop + 200);
 
       const expectedWidth = timeToStop / 8;
-      expect(await animatedComponent.getAnimatedStyle('width')).toBeWithinRange(expectedWidth - 1, expectedWidth + 2);
+      expect(await animatedComponent.getAnimatedStyle('width')).toBeWithinRange(expectedWidth - 5, expectedWidth + 5);
     });
   });
 

apps/common-app/src/examples/RuntimeTests/tests/animations/withDecay/basic.test.tsx

@@ -51,7 +51,7 @@ describe('withDecay animation, test various config', () => {
     { velocity: 900, clamp: [0, 150], rubberBandEffect: true },
     { velocity: 2000, clamp: [0, 150], rubberBandEffect: true },
     { velocity: 2000, clamp: [0, 150], rubberBandEffect: true, rubberBandFactor: 2 },
-  ] as Array<WithDecayConfig>)('Config ${0}', async config => {
+  ] as Array<WithDecayConfig>)('Config %p', async config => {
     const snapshotName = ('decay_' +
       Object.entries(config)
         .map(([key, val]) => {

apps/common-app/src/examples/RuntimeTests/tests/animations/withSequence/arrays.test.tsx

@@ -8,9 +8,19 @@ import Animated, {
   Easing,
   withDelay,
 } from 'react-native-reanimated';
-import { describe, test, render, wait, useTestRef, getTestComponent, expect } from '../../../ReJest/RuntimeTestsApi';
+import {
+  describe,
+  test,
+  render,
+  wait,
+  useTestRef,
+  getTestComponent,
+  expect,
+  recordAnimationUpdates,
+  mockAnimationTimer,
+} from '../../../ReJest/RuntimeTestsApi';
 import { View, StyleSheet } from 'react-native';
-import { ComparisonMode } from '../../../ReJest/types';
+import { ArraySnapshots } from './snapshots.snapshot';
 
 type TestCase = {
   startValues: [number, number, number];
@@ -91,6 +101,9 @@ describe('withSequence animation of array', () => {
   ] as Array<TestCase>)(
     'Animate ${startValues} → ${finalValues} → ${middleValues} → ${finalValues}, animation nr ${animationNumber}',
     async ({ startValues, middleValues, finalValues, animationNumber }) => {
+      await mockAnimationTimer();
+      const updatesContainer = await recordAnimationUpdates();
+
       await render(
         <WidthComponent
           startValues={startValues}
@@ -99,23 +112,20 @@ describe('withSequence animation of array', () => {
           animationNumber={animationNumber}
         />,
       );
-      const componentOne = getTestComponent(COMPONENT_REF.first);
-      const componentTwo = getTestComponent(COMPONENT_REF.second);
-      const componentThree = getTestComponent(COMPONENT_REF.third);
-      const margin = 30;
 
-      await wait(200 + DELAY / 2);
-      expect(await componentOne.getAnimatedStyle('left')).toBe(finalValues[0] + margin, ComparisonMode.PIXEL);
-      expect(await componentTwo.getAnimatedStyle('left')).toBe(finalValues[1] + margin, ComparisonMode.PIXEL);
-      expect(await componentThree.getAnimatedStyle('left')).toBe(finalValues[2] + margin, ComparisonMode.PIXEL);
-      await wait(300 + DELAY / 2);
-      expect(await componentOne.getAnimatedStyle('left')).toBe(middleValues[0] + margin, ComparisonMode.PIXEL);
-      expect(await componentTwo.getAnimatedStyle('left')).toBe(middleValues[1] + margin, ComparisonMode.PIXEL);
-      expect(await componentThree.getAnimatedStyle('left')).toBe(middleValues[2] + margin, ComparisonMode.PIXEL);
-      await wait(200 + DELAY);
-      expect(await componentOne.getAnimatedStyle('left')).toBe(finalValues[0] + 20 + margin, ComparisonMode.PIXEL);
-      expect(await componentTwo.getAnimatedStyle('left')).toBe(finalValues[1] + 20 + margin, ComparisonMode.PIXEL);
-      expect(await componentThree.getAnimatedStyle('left')).toBe(finalValues[2] + 20 + margin, ComparisonMode.PIXEL);
+      const snapshotNamePrefix = `from_${startValues.join('_')}_through_${middleValues.join('_')}_to_${finalValues.join(
+        '_',
+      )}_animation_${animationNumber}`.replace('-', 'min');
+
+      await wait(1000); // waitForAnimationUpdates doesn't work with multiple view recordings
+
+      for (const refName of ['first', 'second', 'third'] as const) {
+        const snapshotName = `${snapshotNamePrefix}_${refName}` as keyof typeof ArraySnapshots;
+
+        expect(updatesContainer.getUpdates(getTestComponent(COMPONENT_REF[refName]))).toMatchSnapshots(
+          ArraySnapshots[snapshotName],
+        );
+      }
     },
   );
 });

apps/common-app/src/examples/RuntimeTests/tests/animations/withSequence/callbackCascade.test.tsx

@@ -19,6 +19,8 @@ import {
   getRegisteredValue,
   registerValue,
   waitForAnimationUpdates,
+  waitForNotify,
+  notify,
 } from '../../../ReJest/RuntimeTestsApi';
 import { Snapshots } from './snapshots.snapshot';
 
@@ -183,6 +185,7 @@ describe(`Test all callbacks have been called in valid order`, () => {
         // finishes at 900
         withTiming(200, { duration: 400 }, () => {
           callbackArray.value = [...callbackArray.value, 'NINE'];
+          notify('lastCallback');
         }),
       );
     });
@@ -202,7 +205,7 @@ describe(`Test all callbacks have been called in valid order`, () => {
     await mockAnimationTimer();
     const updatesContainerActive = await recordAnimationUpdates();
     await render(<CallbackComponent />);
-    await waitForAnimationUpdates(Snapshots.CallbackOrder.length);
+    await waitForNotify('lastCallback');
     const updates = updatesContainerActive.getUpdates();
     const nativeUpdates = await updatesContainerActive.getNativeSnapshots();
     expect(updates).toMatchSnapshots(Snapshots.CallbackOrder);