Update Pressable props (#4421)

## Description

Follow-up to #4416. None of the `Pressable` engines forwarded hover
handlers as `testOnly_*` props, so `fireEvent(element, 'hoverIn')` from
React Native Testing Library had no way to reach
`onHoverIn`/`onHoverOut`. RNTL resolves `testOnly_on{EventName}`
generically for any event, so exposing the props is all that's needed.

This adds `testOnly_onHoverIn`/`testOnly_onHoverOut` to the button props
and forwards them, guarded by `isTestEnv()`, from all three engines:
legacy `Pressable`, `StatefulPressable` and `PressableWithTouchable`.

Also widens the relation props
(`simultaneousWith`/`requireToFail`/`block`) from `AnyGesture` to
`AnyGesture | AnyGesture[]`. The JSDoc already promises a gesture object
or an array of gesture objects and the runtime handles arrays in both
directions (`relationUtils` flattens them into handler tags and pushes
the symmetric relation onto each array element), only the prop type was
narrowed.

## Test plan

Added tests in `src/__tests__/mocks.test.tsx` asserting the hover props
are wired on the button for both v3 engines — relation-free and routed
to `StatefulPressable` via `simultaneousWith={[]}` (which the type
widening makes legal). Both fail without the engine changes.

In `packages/react-native-gesture-handler`: `yarn test`, `yarn ts-check`
and `yarn lint:js` pass.

Author: m-bert

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

@@ -173,3 +173,51 @@ test('Pressable exposes its press handlers to testing-library', () => {
   expect(button.props.testOnly_onPressOut).toBe(onPressOut);
   expect(button.props.testOnly_onLongPress).toBe(onLongPress);
 });
+
+test('Pressable exposes its hover handlers to testing-library', () => {
+  const onHoverIn = jest.fn();
+  const onHoverOut = jest.fn();
+
+  render(
+    <GestureHandlerRootView>
+      <Pressable
+        testID="pressable"
+        onHoverIn={onHoverIn}
+        onHoverOut={onHoverOut}>
+        <Text>Hover Me</Text>
+      </Pressable>
+    </GestureHandlerRootView>
+  );
+
+  const button = screen.getByTestId('pressable');
+
+  expect(button.props.testOnly_onHoverIn).toBe(onHoverIn);
+  expect(button.props.testOnly_onHoverOut).toBe(onHoverOut);
+});
+
+test('StatefulPressable exposes its press and hover handlers to testing-library', () => {
+  // A relation prop routes `Pressable` to the `StatefulPressable` engine,
+  // which has to forward the same `testOnly_*` props as the default engine.
+  const onPress = jest.fn();
+  const onHoverIn = jest.fn();
+  const onHoverOut = jest.fn();
+
+  render(
+    <GestureHandlerRootView>
+      <Pressable
+        testID="pressable"
+        simultaneousWith={[]}
+        onPress={onPress}
+        onHoverIn={onHoverIn}
+        onHoverOut={onHoverOut}>
+        <Text>Press Me</Text>
+      </Pressable>
+    </GestureHandlerRootView>
+  );
+
+  const button = screen.getByTestId('pressable');
+
+  expect(button.props.testOnly_onPress).toBe(onPress);
+  expect(button.props.testOnly_onHoverIn).toBe(onHoverIn);
+  expect(button.props.testOnly_onHoverOut).toBe(onHoverOut);
+});

packages/react-native-gesture-handler/src/components/GestureButtonsProps.ts

@@ -93,6 +93,20 @@ export interface LegacyRawButtonProps
    */
   // eslint-disable-next-line @typescript-eslint/ban-types
   testOnly_onLongPress?: Function | null | undefined;
+
+  /**
+   * Used for testing-library compatibility, not passed to the native component.
+   * @deprecated test-only props are deprecated and will be removed in the future.
+   */
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  testOnly_onHoverIn?: Function | null | undefined;
+
+  /**
+   * Used for testing-library compatibility, not passed to the native component.
+   * @deprecated test-only props are deprecated and will be removed in the future.
+   */
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  testOnly_onHoverOut?: Function | null | undefined;
 }
 interface ButtonWithRefProps {
   innerRef?: React.Ref<React.ComponentType<any>> | undefined;

packages/react-native-gesture-handler/src/components/GestureHandlerButton.tsx

@@ -264,6 +264,20 @@ export interface ButtonProps extends ViewProps, AccessibilityProps {
    */
   // eslint-disable-next-line @typescript-eslint/ban-types
   testOnly_onLongPress?: Function | null | undefined;
+
+  /**
+   * Used for testing-library compatibility, not passed to the native component.
+   * @deprecated test-only props are deprecated and will be removed in the future.
+   */
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  testOnly_onHoverIn?: Function | null | undefined;
+
+  /**
+   * Used for testing-library compatibility, not passed to the native component.
+   * @deprecated test-only props are deprecated and will be removed in the future.
+   */
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  testOnly_onHoverOut?: Function | null | undefined;
 }
 
 export const ButtonComponent =

packages/react-native-gesture-handler/src/components/Pressable/Pressable.tsx

@@ -399,7 +399,9 @@ const LegacyPressable = (props: LegacyPressableProps) => {
         testOnly_onPress={IS_TEST_ENV ? onPress : undefined}
         testOnly_onPressIn={IS_TEST_ENV ? onPressIn : undefined}
         testOnly_onPressOut={IS_TEST_ENV ? onPressOut : undefined}
-        testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}>
+        testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}
+        testOnly_onHoverIn={IS_TEST_ENV ? onHoverIn : undefined}
+        testOnly_onHoverOut={IS_TEST_ENV ? onHoverOut : undefined}>
         {childrenProp}
         {__DEV__ ? (
           <PressabilityDebugView color="red" hitSlop={normalizedHitSlop} />

packages/react-native-gesture-handler/src/components/Pressable/PressableProps.tsx

@@ -58,19 +58,19 @@ export interface PressableProps extends CommonPressableProps {
    * A gesture object or an array of gesture objects containing the configuration and callbacks to be
    * used with the Pressable's gesture handlers.
    */
-  simultaneousWith?: AnyGesture;
+  simultaneousWith?: AnyGesture | AnyGesture[];
 
   /**
    * A gesture object or an array of gesture objects containing the configuration and callbacks to be
    * used with the Pressable's gesture handlers.
    */
-  requireToFail?: AnyGesture;
+  requireToFail?: AnyGesture | AnyGesture[];
 
   /**
    * A gesture object or an array of gesture objects containing the configuration and callbacks to be
    * used with the Pressable's gesture handlers.
    */
-  block?: AnyGesture;
+  block?: AnyGesture | AnyGesture[];
 }
 
 interface CommonPressableProps

packages/react-native-gesture-handler/src/v3/components/PressableWithTouchable.tsx

@@ -321,7 +321,9 @@ const PressableWithTouchable = (props: PressableProps) => {
       testOnly_onPress={IS_TEST_ENV ? onPress : undefined}
       testOnly_onPressIn={IS_TEST_ENV ? onPressIn : undefined}
       testOnly_onPressOut={IS_TEST_ENV ? onPressOut : undefined}
-      testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}>
+      testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}
+      testOnly_onHoverIn={IS_TEST_ENV ? onHoverIn : undefined}
+      testOnly_onHoverOut={IS_TEST_ENV ? onHoverOut : undefined}>
       {resolvedChildren}
       {__DEV__ ? (
         <PressabilityDebugView color="red" hitSlop={normalizedHitSlop} />

packages/react-native-gesture-handler/src/v3/components/StatefulPressable.tsx

@@ -463,7 +463,9 @@ const StatefulPressable = (props: PressableProps) => {
         testOnly_onPress={IS_TEST_ENV ? onPress : undefined}
         testOnly_onPressIn={IS_TEST_ENV ? onPressIn : undefined}
         testOnly_onPressOut={IS_TEST_ENV ? onPressOut : undefined}
-        testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}>
+        testOnly_onLongPress={IS_TEST_ENV ? onLongPress : undefined}
+        testOnly_onHoverIn={IS_TEST_ENV ? onHoverIn : undefined}
+        testOnly_onHoverOut={IS_TEST_ENV ? onHoverOut : undefined}>
         {childrenProp}
         {__DEV__ ? (
           <PressabilityDebugView color="red" hitSlop={normalizedHitSlop} />