Merge pull request #339 from dohooo/develop

Support to test.

Author: dohooo

.changeset/strange-masks-perform.md

@@ -0,0 +1,5 @@
+---
+'react-native-reanimated-carousel': minor
+---
+
+🚀 Support to test.

README.md

@@ -148,6 +148,15 @@ export default Index;
 -   Working principle
     -   [About RNRC](./docs/about.md)
 
+-  How to run tests in `exampleExpo`
+    ```shell 
+    $ yarn prepare
+    $ yarn link --global
+    $ cd ./exampleExpo
+    $ yarn link react-native-reanimated-carousel --global
+    $ yarn test
+    ```
+
 ## Reason
 
 <details>

README.zh-CN.md

@@ -144,6 +144,14 @@ export default Index;
     -   如果你使用 EXPO 托管工作流，请确定你的 EXPO SDK 版本大于 41，因为旧的版本并不支持`Reanimated(v2)`。
 -   工作原理
     - [关于RNRC](./docs/about.zh-CN.md)
+-  如何运行`exampleExpo`的测试
+    ```shell 
+    $ yarn prepare
+    $ yarn link --global
+    $ cd ./exampleExpo
+    $ yarn link react-native-reanimated-carousel --global
+    $ yarn test
+    ```
 
 ## 原因
 

exampleExpo/babel.config.js

@@ -10,6 +10,7 @@ module.exports = function (api) {
     "react-native-reanimated/plugin",
     "inline-dotenv",
     "@babel/plugin-syntax-dynamic-import",
+    "import-glob",
   ];
 
   if (!isProd) {

exampleExpo/package.json

@@ -11,7 +11,11 @@
     "web": "expo start --web",
     "web:pretty": "PRETTY=true expo start --web",
     "start": "expo start",
-    "test": "jest",
+    "test": "jest --watch --coverage=false --changedSince=origin/main",
+    "test:debug": "jest -o --watch --coverage=false",
+    "test:final": "jest",
+    "test:updateSnapshots": "jest -u --coverage=false",
+    "test:updateSnapshots:watch": "jest -u --watch --coverage=false",
     "build:web": "expo build:web",
     "deploy": "gh-pages -d web-build",
     "predeploy": "yarn build:web"
@@ -26,11 +30,13 @@
     "@unimodules/react-native-adapter": "^6.3.9",
     "babel-loader": "^8.2.3",
     "expo": "^46.0.0",
-    "expo-cli": "^6.1.0",
     "expo-blur": "~11.2.0",
+    "expo-cli": "^6.1.0",
     "expo-constants": "~13.2.4",
     "expo-status-bar": "~1.4.0",
     "expo-updates": "~0.14.7",
+    "jest": "^26.6.3",
+    "jest-expo": "^47.0.1",
     "metro-config": "^0.71.1",
     "react": "18.0.0",
     "react-dom": "18.0.0",
@@ -47,8 +53,11 @@
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/runtime": "^7.9.6",
     "@expo/webpack-config": "^0.17.0",
+    "@testing-library/jest-native": "^5.4.1",
+    "@testing-library/react-native": "^11.5.0",
     "@types/react": "~17.0.0",
     "@types/react-native-snap-carousel": "^3.8.5",
+    "babel-plugin-import-glob": "^2.0.0",
     "babel-plugin-inline-dotenv": "^1.6.0",
     "babel-plugin-module-resolver": "^4.1.0",
     "babel-plugin-react-native-web": "^0.17.5",
@@ -61,5 +70,18 @@
   "resolutions": {
     "@types/react": "^17",
     "react-error-overlay": "6.0.9"
+  },
+  "jest": {
+    "preset": "jest-expo",
+    "setupFilesAfterEnv": [
+      "./test/jest-setup.js",
+      "@testing-library/jest-native/extend-expect"
+    ],
+    "transformIgnorePatterns": [
+      "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native-svg)"
+    ],
+    "moduleDirectories": [
+      "<rootDir>/node_modules"
+    ]
   }
 }

exampleExpo/src/Home.tsx

@@ -11,37 +11,37 @@ import {
 import type { NavigationProp } from "@react-navigation/native";
 import { useNavigation } from "@react-navigation/native";
 
-import AdvancedParallaxComponent from "./advanced-parallax";
-import AnimTabBarComponent from "./anim-tab-bar";
-import BlurParallax from "./blur-parallax";
-import Circular from "./circular";
-import ComplexComponent from "./complex";
-import Cube3D from "./cube-3d";
-import Curve from "./curve";
-import Flow from "./flow";
-import Fold from "./fold";
-import LeftAlignComponent from "./left-align";
-import MarqueeComponent from "./marquee";
-import MultipleComponent from "./multiple";
-import NormalComponent from "./normal";
-import ParallaxComponent from "./parallax";
-import ParallaxLayers from "./parallax-layers";
-import PauseAdvancedParallaxComponent from "./pause-advanced-parallax";
-import PressSwipe from "./press-swipe";
-import RotateInOutComponent from "./rotate-in-out";
-import RotateScaleFadeInOutComponent from "./rotate-scale-fade-in-out";
-import ScaleFadeInOutComponent from "./scale-fade-in-out";
-import StackComponent from "./stack";
-import StackCards from "./stack-cards";
-import Tear from "./tear";
+import AdvancedParallaxComponent from "./pages/advanced-parallax";
+import AnimTabBarComponent from "./pages/anim-tab-bar";
+import BlurParallax from "./pages/blur-parallax";
+import Circular from "./pages/circular";
+import ComplexComponent from "./pages/complex";
+import Cube3D from "./pages/cube-3d";
+import Curve from "./pages/curve";
+import Flow from "./pages/flow";
+import Fold from "./pages/fold";
+import LeftAlignComponent from "./pages/left-align";
+import MarqueeComponent from "./pages/marquee";
+import MultipleComponent from "./pages/multiple";
+import NormalComponent from "./pages/normal";
+import ParallaxComponent from "./pages/parallax";
+import ParallaxLayers from "./pages/parallax-layers";
+import PauseAdvancedParallaxComponent from "./pages/pause-advanced-parallax";
+import PressSwipe from "./pages/press-swipe";
+import RotateInOutComponent from "./pages/rotate-in-out";
+import RotateScaleFadeInOutComponent from "./pages/rotate-scale-fade-in-out";
+import ScaleFadeInOutComponent from "./pages/scale-fade-in-out";
+import StackComponent from "./pages/stack";
+import StackCards from "./pages/stack-cards";
+import Tear from "./pages/tear";
 import { isAndroid, isIos } from "./utils";
 
 // Not support to WEB (react-native-snap-carousel)
 const SnapCarouselComplexComponent = React.lazy(
-  () => import("./snap-carousel-complex"),
+  () => import("./pages/snap-carousel-complex"),
 );
 const SnapCarouselLoopComponent = React.lazy(
-  () => import("./snap-carousel-loop"),
+  () => import("./pages/snap-carousel-loop"),
 );
 
 export const LayoutsPage = [