Test setup2

babel.config.js

@@ -0,0 +1,59 @@
+// eslint-disable-next-line
+module.exports = {
+  presets: [ 
+    'module:metro-react-native-babel-preset', 
+    '@babel/preset-env',
+    '@babel/preset-typescript',
+    '@babel/preset-react',
+    'module:@react-native/babel-preset'
+  ],
+  plugins: [
+    [
+      'module-resolver',
+      {
+          alias: {
+              '@': './src',
+              'assets': './assets',
+          }
+      },
+  ],
+    'react-native-reanimated/plugin', // reanimated plugin must be listed last
+  ],
+  // plugins: [
+  //   [
+  //     'module-resolver',
+  //     {
+  //       root: './',
+  //       extensions: [
+  //         '.ios.ts',
+  //         '.android.ts',
+  //         '.ts',
+  //         '.ios.tsx',
+  //         '.android.tsx',
+  //         '.tsx',
+  //         '.jsx',
+  //         '.js',
+  //         '.json',
+  //         'jpg',
+  //         'jpeg',
+  //       ],
+  //       alias: {
+  //         '@react-native-ama/core/src': `${__dirname}/packages/core/src`,
+  //         '@react-native-ama/core': `${__dirname}/packages/core/src`,
+  //         '@react-native-ama/internal/src': `${__dirname}/packages/internal/src`,
+  //         '@react-native-ama/internal': `${__dirname}/packages/internal/src`,
+  //         '@react-native-ama/animations/src': `${__dirname}/packages/animations/src`,
+  //         '@react-native-ama/animations': `${__dirname}/packages/animations/src`,
+  //         '@react-native-ama/extras/src': `${__dirname}/packages/extras/src`,
+  //         '@react-native-ama/extras': `${__dirname}/packages/extras/src`,
+  //         '@react-native-ama/lists/src': `${__dirname}/packages/lists/src`,
+  //         '@react-native-ama/lists': `${__dirname}/packages/lists/src`,
+  //         '@react-native-ama/react-native/src': `${__dirname}/packages/react-native/src`,
+  //         '@react-native-ama/react-native': `${__dirname}/packages/react-native/src`,
+  //         '@react-native-ama/internal/src': `${__dirname}/packages/internal/src`,
+  //         '@react-native-ama/internal': `${__dirname}/packages/internal/src`,
+  //       },
+  //     },
+  //   ],
+  // ],
+};

examples/bare/package.json

@@ -40,4 +40,4 @@
   "engines": {
     "node": ">=18"
   }
-}
+}

jest.config.js

@@ -0,0 +1,91 @@
+// eslint-disable-next-line
+module.exports = {
+  preset: "react-native",
+  verbose: true,
+  setupFiles: ["./node_modules/react-native-gesture-handler/jestSetup.js"],
+  setupFilesAfterEnv: [
+    "./jest.setup.js"
+  ],
+  testMatch: ["**/src/**/?(*.)+(spec|test).[jt]s?(x)"],
+  transformIgnorePatterns: [
+    'node_modules/(?!(jest-)?react-native|react-native-reanimated|@react-native|@react-native-community|@react-navigation|ky)',
+    "node_modules/(?!(@react-native|react-native|react-native-reanimated)/)"
+  ],
+  moduleFileExtensions: ['js', 'jsx', 'ts', 'tsx', 'json', 'node'],
+  transform: {
+    '^.+\\.(js|jsx|ts|tsx)$': 'babel-jest', // Ensure Babel is used for transforming JS files
+  },
+  // transformOptions: {
+  //   babelConfig: require('./babel.base.js'),
+  // },
+  // babelConfig: {
+  //   presets: ['@babel/preset-env', '@babel/preset-flow'],
+  // },
+  // globals: {
+  //   'babel-jest': {
+  //     config: require('./babel.base.js'), // Use babel.base.js for configuration
+  //   },
+  // },
+  // moduleNameMapper: {
+  //   '^@babel/runtime': '<rootDir>/node_modules/@babel/runtime',
+  // },
+  // moduleNameMapper: {
+  //   '^@react-native-ama/core$': '<rootDir>/packages/core/src',
+  // },
+  //moduleDirectories: ['node_modules', 'packages'], // Added for module resolution
+  // moduleNameMapper: {
+  //   '^@react-native-ama/internal$': '<rootDir>/packages/core/src', // Adjust as necessary
+  //   '^@react-native-ama/core$': '<rootDir>/packages/core/src',
+  // },
+  testTimeout: 10000,
+  projects: [
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "animations",
+      testMatch: ["<rootDir>/packages/animations/src/**/*.test.ts",
+        "<rootDir>/packages/animations/src/**/*.test.tsx"
+      ],
+    },
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "core",
+      testMatch: ["<rootDir>/packages/core/src/**/*.test.ts",
+          "<rootDir>/packages/core/src/**/*.test.tsx"
+      ],
+    },
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "internal",
+      testMatch: ["<rootDir>/packages/internal/src/**/*.test.ts",
+          "<rootDir>/packages/internal/src/**/*.test.tsx"
+      ],
+    },
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "extras",
+      testMatch: ["<rootDir>/packages/extras/src/**/*.test.ts",
+          "<rootDir>/packages/extras/src/**/*.test.tsx"
+      ],
+    },
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "lists",
+      testMatch: ["<rootDir>/packages/lists/src/**/*.test.ts",
+          "<rootDir>/packages/lists/src/**/*.test.tsx"
+      ],
+    },
+    {
+      testPathIgnorePatterns: ["<rootDir>/node_modules/"],
+      preset: "react-native",
+      displayName: "forms",
+      testMatch: ["<rootDir>/packages/forms/src/**/*.test.ts",
+          "<rootDir>/packages/forms/src/**/*.test.tsx"
+      ],
+    }
+  ],
+}

jest.setup.js

@@ -1,3 +1,4 @@
-import 'react-native-gesture-handler/jestSetup';
 
-require('react-native-reanimated/lib/reanimated2/jestUtils').setUpTests();
+import '@react-native-community/jest-setup';
+import 'react-native-gesture-handler/jestSetup';
+require('react-native-reanimated/lib/reanimated2/jestUtils').setUpTests();

package.json

@@ -20,7 +20,14 @@
     "ts:check": "tsc --noEmit",
     "lint": "eslint --ext .js,.ts,.tsx ./packages",
     "version": "yarn changeset version && yarn install --no-frozen-lockfile",
-    "build": "yarn build:internal && yarn build:core && yarn build:animations && yarn build:react-native && yarn build:extras && yarn build:forms && yarn build:lists"
+    "build": "yarn build:internal && yarn build:core && yarn build:animations && yarn build:react-native && yarn build:extras && yarn build:forms && yarn build:lists",
+    "test:animations": "jest --selectProjects=animations",
+    "test:core": "jest --selectProjects=core",
+    "test:internal": "jest --selectProjects=internal",
+    "test:extras": "jest --selectProjects=extras",
+    "test:lists": "jest --selectProjects=lists",
+    "test:forms": "jest --selectProjects=forms",
+    "test": "jest --selectProjects=animations && jest --selectProjects=core && jest --selectProjects=internal && jest --selectProjects=extra"
   },
   "workspaces": [
     "packages/animations",
@@ -35,16 +42,32 @@
     "examples/shared"
   ],
   "devDependencies": {
+    "@babel/core": "^7.25.8",
+    "@babel/preset-env": "^7.25.8",
+    "@babel/preset-react": "^7.25.7",
+    "@babel/preset-typescript": "^7.25.7",
+    "@babel/runtime": "^7.25.7",
     "@changesets/cli": "^2.27.7",
     "@ianvs/prettier-plugin-sort-imports": "^3.4.2",
+    "@react-native/babel-preset": "^0.75.4",
     "@svitejs/changesets-changelog-github-compact": "^1.1.0",
     "@testing-library/react-native": "^12.3.0",
     "@types/jest": "^29.5.10",
+    "@types/react-test-renderer": "^18.3.0",
+    "babel-jest": "^29.7.0",
+    "babel-plugin-module-resolver": "^5.0.2",
+    "babel-preset-react-native": "^4.0.1",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-prettier": "^3.1.3",
     "husky": "^8.0.1",
     "jest": "^29.7.0",
+    "react-native-reanimated": ">=2.0.0",
+    "react-native-gesture-handler": ">=2.0.0",
+    "react-test-renderer": "^18.3.1",
     "ts-jest": "^29.1.1",
     "typescript": "^5.1.3"
+  },
+  "dependencies": {
+    "metro-react-native-babel-preset": "^0.77.0"
   }
-}
+}

packages/animations/package.json

@@ -49,4 +49,4 @@
   },
   "author": "",
   "license": "MIT"
-}
+}

packages/animations/src/components/AnimatedContainer.test.tsx

@@ -81,8 +81,9 @@ describe('AnimatedContainer', () => {
 });
 
 jest.mock('../hooks/useReanimatedAnimationBuilder');
-jest.mock('../hooks/useFocus', () => {
+jest.mock('@react-native-ama/core', () => {
   return {
+    AutofocusContainer: jest.fn(() => <div />),
     useFocus: () => {
       return {
         setFocus: jest.fn(),

packages/animations/src/components/AnimatedContainer.tsx

@@ -47,9 +47,8 @@ export const AnimatedContainer = React.forwardRef<
       duration,
     });
 
-    const Wrapper = autofocus ? AutofocusContainer : React.Fragment;
-    return (
-      <Wrapper>
+    return autofocus ? (
+      <AutofocusContainer>
         <Animated.View
           style={style}
           entering={entering}
@@ -58,7 +57,16 @@ export const AnimatedContainer = React.forwardRef<
           {...rest}>
           {children}
         </Animated.View>
-      </Wrapper>
+      </AutofocusContainer>
+    ) : (
+      <Animated.View
+        style={style}
+        entering={entering}
+        exiting={exiting}
+        ref={forwardRef}
+        {...rest}>
+        {children}
+      </Animated.View>
     );
   },
 );

packages/animations/src/hooks/useReanimatedAnimationBuilder.test.ts → packages/animations/src/hooks/useReanimatedAnimationBuilder.test.tsx

@@ -1,5 +1,6 @@
 import * as AMAProvider from '@react-native-ama/core';
-import { renderHook } from '@testing-library/react-native';
+import { act, renderHook } from '@testing-library/react-native';
+import * as React from 'react';
 
 import { useReanimatedAnimationBuilder } from './useReanimatedAnimationBuilder';
 
@@ -9,20 +10,33 @@ beforeEach(() => {
 
 let withTiming: jest.Mock;
 
+const renderHookWrapper = ({ children }) => (
+  <AMAProvider.AMAProvider>{children}</AMAProvider.AMAProvider>
+);
+
 describe('useReanimatedAnimationBuilder', () => {
   describe('entering animation', () => {
-    it('handles the custom reanimated params', () => {
-      const { result } = renderHook(() =>
-        useReanimatedAnimationBuilder({
-          from: { transform: [{ translateY: 'targetHeight' }], opacity: 0 },
-          to: {
-            transform: [{ translateY: -42 }],
-            opacity: 1,
-          },
-          duration: 300,
-        }),
+    it('handles the custom reanimated params', async () => {
+      const { result } = renderHook(
+        () =>
+          useReanimatedAnimationBuilder({
+            from: { transform: [{ translateY: 'targetHeight' }], opacity: 0 },
+            to: {
+              transform: [{ translateY: -42 }],
+              opacity: 1,
+            },
+            duration: 300,
+          }),
+        { wrapper: renderHookWrapper },
       );
+      await act(() => {
+        // Call the entering method within act
+        result.current.entering({
+          targetHeight: 42,
+        } as any);
+      });
 
+      // Assert the expected result after the act
       expect(
         result.current.entering({
           targetHeight: 42,

packages/core/jest.config.ts

@@ -0,0 +1,5 @@
+import rootConfig from '../../jest.config';
+
+export default {
+  ...rootConfig,
+};