[Jest] Add opt-out for the GestureHandlerRootView check

packages/docs-gesture-handler/docs/guides/testing.mdx

@@ -28,7 +28,20 @@ Be careful when adding multiple entries to `transformIgnorePatterns`. Since `Jes
 In order to load mocks provided by RNGH, add the following to your jest config:
 
 ```json
-"setupFiles": ["./node_modules/react-native-gesture-handler/jestSetup.js"]
+"setupFiles": ["react-native-gesture-handler/jestSetup.js"]
+```
+
+<Badges version="3.5.0">
+### Rendering without GestureHandlerRootView
+</Badges>
+
+`GestureDetector` throws in development when it is not rendered inside `GestureHandlerRootView`, and this includes `Jest`. Wrap rendered trees in `GestureHandlerRootView`, or skip the check by adding the following file to `setupFiles`:
+
+```json
+"setupFiles": [
+  ...,
+  "react-native-gesture-handler/jest-setup/disableRootViewCheck.js"
+]
 ```
 
 ### Example jest config

packages/react-native-gesture-handler/jest-setup/disableRootViewCheck.js

@@ -0,0 +1,7 @@
+jest.mock('../src/v3/detectors/useEnsureGestureHandlerRootView', () => ({
+  useEnsureGestureHandlerRootView: () => {},
+}));
+
+jest.mock('../lib/module/v3/detectors/useEnsureGestureHandlerRootView', () => ({
+  useEnsureGestureHandlerRootView: () => {},
+}));

packages/react-native-gesture-handler/jest-setup/index.js

@@ -0,0 +1,41 @@
+jest.mock('../src/RNGestureHandlerModule', () => require('../src/mocks/module'));
+jest.mock('../src/components/GestureButtons', () =>
+  require('../src/mocks/GestureButtons')
+);
+jest.mock('../src/components/Pressable/Pressable', () =>
+  require('../src/mocks/Pressable')
+);
+jest.mock('../src/components/GestureComponents', () =>
+  require('../src/mocks/gestureComponents')
+);
+jest.mock('../src/components/touchables', () =>
+  require('../src/mocks/Touchables')
+);
+jest.mock('../src/v3/detectors/HostGestureDetector', () =>
+  require('../src/mocks/hostDetector')
+);
+jest.mock('../src/handlers/gestures/installUIRuntimeBindings', () =>
+  require('../src/mocks/installUIRuntimeBindings')
+);
+
+jest.mock('../lib/module/RNGestureHandlerModule', () =>
+  require('../lib/module/mocks/module')
+);
+jest.mock('../lib/module/components/GestureButtons', () =>
+  require('../lib/module/mocks/GestureButtons')
+);
+jest.mock('../lib/module/components/touchables', () =>
+  require('../lib/module/mocks/Touchables')
+);
+jest.mock('../lib/module/components/Pressable', () =>
+  require('../lib/module/mocks/Pressable')
+);
+jest.mock('../lib/module/components/GestureComponents', () =>
+  require('../lib/module/mocks/gestureComponents')
+);
+jest.mock('../lib/module/v3/detectors/HostGestureDetector', () =>
+  require('../lib/module/mocks/hostDetector')
+);
+jest.mock('../lib/module/handlers/gestures/installUIRuntimeBindings', () =>
+  require('../lib/module/mocks/installUIRuntimeBindings')
+);

packages/react-native-gesture-handler/jestSetup.js

@@ -1,41 +1 @@
-jest.mock('./src/RNGestureHandlerModule', () => require('./src/mocks/module'));
-jest.mock('./src/components/GestureButtons', () =>
-  require('./src/mocks/GestureButtons')
-);
-jest.mock('./src/components/Pressable/Pressable', () =>
-  require('./src/mocks/Pressable')
-);
-jest.mock('./src/components/GestureComponents', () =>
-  require('./src/mocks/gestureComponents')
-);
-jest.mock('./src/components/touchables', () =>
-  require('./src/mocks/Touchables')
-);
-jest.mock('./src/v3/detectors/HostGestureDetector', () =>
-  require('./src/mocks/hostDetector')
-);
-jest.mock('./src/handlers/gestures/installUIRuntimeBindings', () =>
-  require('./src/mocks/installUIRuntimeBindings')
-);
-
-jest.mock('./lib/module/RNGestureHandlerModule', () =>
-  require('./lib/module/mocks/module')
-);
-jest.mock('./lib/module/components/GestureButtons', () =>
-  require('./lib/module/mocks/GestureButtons')
-);
-jest.mock('./lib/module/components/touchables', () =>
-  require('./lib/module/mocks/Touchables')
-);
-jest.mock('./lib/module/components/Pressable', () =>
-  require('./lib/module/mocks/Pressable')
-);
-jest.mock('./lib/module/components/GestureComponents', () =>
-  require('./lib/module/mocks/gestureComponents')
-);
-jest.mock('./lib/module/v3/detectors/HostGestureDetector', () =>
-  require('./lib/module/mocks/hostDetector')
-);
-jest.mock('./lib/module/handlers/gestures/installUIRuntimeBindings', () =>
-  require('./lib/module/mocks/installUIRuntimeBindings')
-);
+require('./jest-setup');

packages/react-native-gesture-handler/package.json

@@ -50,6 +50,7 @@
     "ReanimatedDrawerLayout/",
     "README.md",
     "jestSetup.js",
+    "jest-setup/",
     "RNGestureHandler.podspec",
     "react-native.config.js"
   ],

packages/react-native-gesture-handler/src/v3/detectors/useEnsureGestureHandlerRootView.ts

@@ -2,13 +2,17 @@ import { use } from 'react';
 import { Platform } from 'react-native';
 
 import GestureHandlerRootViewContext from '../../GestureHandlerRootViewContext';
+import { isTestEnv } from '../../utils';
+
+const ERROR_MESSAGE =
+  'GestureDetector must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized. See https://docs.swmansion.com/react-native-gesture-handler/docs/fundamentals/installation for more details.';
+
+const JEST_ERROR_MESSAGE = `${ERROR_MESSAGE} In Jest, wrap the rendered tree in GestureHandlerRootView or disable this check by adding 'react-native-gesture-handler/jest-setup/disableRootViewCheck.js' to setupFiles. See https://docs.swmansion.com/react-native-gesture-handler/docs/guides/testing#rendering-without-gesturehandlerrootview for more details.`;
 
 export function useEnsureGestureHandlerRootView() {
   const rootViewContext = use(GestureHandlerRootViewContext);
 
   if (__DEV__ && !rootViewContext && Platform.OS !== 'web') {
-    throw new Error(
-      'GestureDetector must be used as a descendant of GestureHandlerRootView. Otherwise the gestures will not be recognized. See https://docs.swmansion.com/react-native-gesture-handler/docs/fundamentals/installation for more details.'
-    );
+    throw new Error(isTestEnv() ? JEST_ERROR_MESSAGE : ERROR_MESSAGE);
   }
 }