rest

Author: Andrzej Antoni Kwaśniewski

packages/react-native-gesture-handler/src/__tests__/V3.test.tsx

@@ -1,9 +1,10 @@
-import React, { useRef } from 'react';
+import React from 'react';
 import { render, cleanup } from '@testing-library/react-native';
 import {
+  Gesture,
+  GestureDetector,
   GestureHandlerRootView,
   InterceptingGestureDetector,
-  usePanGesture,
   useTapGesture,
 } from '../index';
 import { findNodeHandle, View } from 'react-native';
@@ -34,20 +35,82 @@ describe('VirtualDetector', () => {
     (findNodeHandle as jest.Mock).mockReturnValue(123);
 
     function VirtualDetectorAnimated() {
-      const tap = usePanGesture({ useAnimated: true });
-      const ref = useRef(null);
+      const tap = useTapGesture({ useAnimated: true });
       return (
         <GestureHandlerRootView>
           <InterceptingGestureDetector>
             <VirtualDetector gesture={tap}>
-              <View ref={ref} />
+              <View />
             </VirtualDetector>
           </InterceptingGestureDetector>
         </GestureHandlerRootView>
       );
     }
     expect(() => render(<VirtualDetectorAnimated />)).toThrow(
-      '[react-native-gesture-handler] VirtualGestureDetector cannot handle Animated events with native driver when used inside InterceptingGestureDetector. Use Reanimated or Animated events without native driver instead.'
+      'VirtualGestureDetector cannot handle Animated events with native driver when used inside InterceptingGestureDetector. Use Reanimated or Animated events without native driver instead.'
+    );
+  });
+  test('intercepting detector cant handle multiple types of events', () => {
+    (findNodeHandle as jest.Mock).mockReturnValue(123);
+    const mockWorklet = () => undefined;
+    mockWorklet.__workletHash = 123;
+    function InterceptingDetectorMultipleTypes() {
+      const tap = useTapGesture({ useAnimated: true });
+      const tap2 = useTapGesture({ onActivate: mockWorklet });
+      return (
+        <GestureHandlerRootView>
+          <InterceptingGestureDetector gesture={tap}>
+            <VirtualDetector gesture={tap2}>
+              <View />
+            </VirtualDetector>
+          </InterceptingGestureDetector>
+        </GestureHandlerRootView>
+      );
+    }
+    expect(() => render(<InterceptingDetectorMultipleTypes />)).toThrow(
+      'InterceptingGestureDetector can only handle either Reanimated or Animated events.'
+    );
+  });
+});
+
+describe('Check if descendant of root view', () => {
+  test('gesture detector', () => {
+    function GestureDetectorNoRootView() {
+      const tap = useTapGesture({});
+      return (
+        <GestureDetector gesture={tap}>
+          <View />
+        </GestureDetector>
+      );
+    }
+    expect(() => render(<GestureDetectorNoRootView />)).toThrow(
+      '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.'
+    );
+  });
+  test('intercepting detector', () => {
+    function GestureDetectorNoRootView() {
+      const tap = useTapGesture({});
+      return (
+        <InterceptingGestureDetector gesture={tap}>
+          <View />
+        </InterceptingGestureDetector>
+      );
+    }
+    expect(() => render(<GestureDetectorNoRootView />)).toThrow(
+      '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.'
+    );
+  });
+  test('legacy detector', () => {
+    function GestureDetectorNoRootView() {
+      const tap = Gesture.Tap();
+      return (
+        <GestureDetector gesture={tap}>
+          <View />
+        </GestureDetector>
+      );
+    }
+    expect(() => render(<GestureDetectorNoRootView />)).toThrow(
+      '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.'
     );
   });
 });

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

@@ -1,12 +1,11 @@
 import { use } from 'react';
-import { isTestEnv } from '../../utils';
 import { Platform } from 'react-native';
 import GestureHandlerRootViewContext from '../../GestureHandlerRootViewContext';
 
 export function useEnsureGestureHandlerRootView() {
   const rootViewContext = use(GestureHandlerRootViewContext);
 
-  if (__DEV__ && !rootViewContext && !isTestEnv() && Platform.OS !== 'web') {
+  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.'
     );