Rewrite jest unit tests to TypeScript (#4399)

## Summary

- Renamed all tests with their respective TypeScript counterparts.
- Fixed jestUtils to properly allow strict checking of AnimatedStyle.
- Added type declaration emitting to plugin.
- Moved building plugin files before running TypeScript on the project
(otherwise TypeScript tests would fail during type-checking).
- Added test for jestUtils.
- Bumped `jest` version and added `@types/react-test-renderer`.

---
Added to `jest-setup.js`:
```diff
+    delete global.MessageChannel;
```
This line is coming from `react-16-node-hanging-test-fix`. It fixes an
error of open handles in `@testing-library/react-native` function
`render` and jest going 😵.
[Reference](facebook/react#20756).

## Test plan

`yarn && yarn jest --detectOpenHandles` ftw

.gitignore

@@ -57,3 +57,4 @@ react-native-reanimated-tests.js
 
 # plugin
 !plugin/build
+plugin/types

__tests__/Animation.test.js → __tests__/Animation.test.tsx

@@ -6,10 +6,15 @@ import Animated, {
   useSharedValue,
   useAnimatedStyle,
   withTiming,
-} from '../src/';
+  SharedValue,
+} from '../src';
 import { getAnimatedStyle } from '../src/reanimated2/jestUtils';
 
-const AnimatedSharedValueComponent = (props) => {
+interface Props {
+  sharedValue: SharedValue<number>;
+}
+
+const AnimatedSharedValueComponent = (props: Props) => {
   const widthSV = props.sharedValue;
 
   const style = useAnimatedStyle(() => {
@@ -110,16 +115,17 @@ describe('Tests of animations', () => {
     fireEvent.press(button);
     jest.advanceTimersByTime(250);
     style.width = 50; // value of component width after 250ms of animation
-    expect(view).toHaveAnimatedStyle(style, true);
+    expect(view).toHaveAnimatedStyle(style, { shouldMatchAllProps: true });
   });
 
   test('withTiming animation, define shared value outside component', () => {
-    let sharedValue;
+    let sharedValue: SharedValue<number>;
     renderHook(() => {
       sharedValue = useSharedValue(0);
     });
     const { getByTestId } = render(
-      <AnimatedComponent sharedValue={sharedValue} />
+      // @ts-expect-error TypeScript doesn't understand that renderHook defined sharedValue;
+      <AnimatedSharedValueComponent sharedValue={sharedValue} />
     );
     const view = getByTestId('view');
     const button = getByTestId('button');
@@ -130,14 +136,16 @@ describe('Tests of animations', () => {
   });
 
   test('withTiming animation, change shared value outside component', () => {
-    let sharedValue;
+    let sharedValue: SharedValue<number>;
     renderHook(() => {
       sharedValue = useSharedValue(0);
     });
     const { getByTestId } = render(
+      // @ts-expect-error TypeScript doesn't understand that renderHook defined sharedValue;
       <AnimatedSharedValueComponent sharedValue={sharedValue} />
     );
     const view = getByTestId('view');
+    // @ts-expect-error TypeScript doesn't understand that renderHook defined sharedValue;
     sharedValue.value = 50;
     jest.advanceTimersByTime(600);
     expect(view).toHaveAnimatedStyle({ width: 50 });

__tests__/InterpolateColor.test.js → __tests__/InterpolateColor.test.tsx

@@ -153,21 +153,24 @@ describe('colors interpolation', () => {
     const view = getByTestId('view');
     const button = getByTestId('button');
 
-    expect(view).toHaveAnimatedStyle({ backgroundColor: '#105060' }, true);
+    expect(view).toHaveAnimatedStyle(
+      { backgroundColor: '#105060' },
+      { shouldMatchAllProps: true }
+    );
 
     fireEvent.press(button);
     jest.advanceTimersByTime(250);
 
     expect(view).toHaveAnimatedStyle(
       { backgroundColor: 'rgba(71, 117, 73, 1)' },
-      true
+      { shouldMatchAllProps: true }
     );
 
     jest.advanceTimersByTime(250);
 
     expect(view).toHaveAnimatedStyle(
       { backgroundColor: 'rgba(96, 144, 32, 1)' },
-      true
+      { shouldMatchAllProps: true }
     );
 
     jest.runOnlyPendingTimers();