Add legacy mocks

[m-bert]

Description

This PR:

• Adds missing legacy mocks
• Adds info to docs about how to import jest utility functions
• Removes react-native-worklets mock from our jestSetup

Test plan

New mock test

Also tested on this test code in new app:

import React from 'react';
import { Text, View } from 'react-native';
import { render } from '@testing-library/react-native';
import {
  // v3 components
  RawButton,
  BaseButton,
  RectButton,
  BorderlessButton,
  Clickable,
  Pressable,
  ScrollView,
  FlatList,
  Switch,
  TextInput,
  RefreshControl,
  GestureHandlerRootView,
  // Legacy components
  LegacyRawButton,
  LegacyBaseButton,
  LegacyRectButton,
  LegacyBorderlessButton,
  LegacyPressable,
  LegacyScrollView,
  LegacyFlatList,
  LegacySwitch,
  LegacyTextInput,
  LegacyRefreshControl,
} from 'react-native-gesture-handler';
import {
  fireGestureHandler,
  getByGestureTestId,
} from 'react-native-gesture-handler/jest-utils';
import { State } from 'react-native-gesture-handler';

describe('v3 components render without crashing', () => {
  test('RawButton', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <RawButton />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('BaseButton', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <BaseButton />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('RectButton', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <RectButton />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('BorderlessButton', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <BorderlessButton />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('Clickable', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <Clickable />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('Pressable', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <Pressable />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('ScrollView', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <ScrollView />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('FlatList', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <FlatList data={[]} renderItem={() => null} />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('Switch', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <Switch />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('TextInput', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <TextInput />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });

  test('RefreshControl', () => {
    expect(() =>
      render(
        <GestureHandlerRootView>
          <ScrollView refreshControl={<RefreshControl refreshing={false} />} />
        </GestureHandlerRootView>,
      ),
    ).not.toThrow();
  });
});

describe('Legacy components render without crashing', () => {
  test('LegacyRawButton', () => {
    expect(() => render(<LegacyRawButton />)).not.toThrow();
  });

  test('LegacyBaseButton', () => {
    expect(() => render(<LegacyBaseButton />)).not.toThrow();
  });

  test('LegacyRectButton', () => {
    expect(() => render(<LegacyRectButton />)).not.toThrow();
  });

  test('LegacyBorderlessButton', () => {
    expect(() => render(<LegacyBorderlessButton />)).not.toThrow();
  });

  test('LegacyPressable', () => {
    expect(() => render(<LegacyPressable />)).not.toThrow();
  });

  test('LegacyScrollView', () => {
    expect(() => render(<LegacyScrollView />)).not.toThrow();
  });

  test('LegacyFlatList', () => {
    expect(() =>
      render(<LegacyFlatList data={[]} renderItem={() => null} />),
    ).not.toThrow();
  });

  test('LegacySwitch', () => {
    expect(() => render(<LegacySwitch />)).not.toThrow();
  });

  test('LegacyTextInput', () => {
    expect(() => render(<LegacyTextInput />)).not.toThrow();
  });

  test('LegacyRefreshControl', () => {
    expect(() =>
      render(<LegacyRefreshControl refreshing={false} />),
    ).not.toThrow();
  });
});

describe('fireGestureHandler works with v3 components', () => {
  test('Clickable onPress fires via gesture handler', () => {
    const onPress = jest.fn();

    render(
      <GestureHandlerRootView>
        <Clickable testID="clickable" onPress={onPress}>
          <Text>Press Me</Text>
        </Clickable>
      </GestureHandlerRootView>,
    );

    const gesture = getByGestureTestId('clickable');

    fireGestureHandler(gesture, [
      { oldState: State.UNDETERMINED, state: State.BEGAN },
      { oldState: State.BEGAN, state: State.ACTIVE },
      { oldState: State.ACTIVE, state: State.END },
    ]);

    expect(onPress).toHaveBeenCalledTimes(1);
  });

  test('RectButton onPress fires via gesture handler', () => {
    const onPress = jest.fn();

    render(
      <GestureHandlerRootView>
        <RectButton testID="rect" onPress={onPress} />
      </GestureHandlerRootView>,
    );

    const gesture = getByGestureTestId('rect');

    fireGestureHandler(gesture, [
      { oldState: State.UNDETERMINED, state: State.BEGAN },
      { oldState: State.BEGAN, state: State.ACTIVE },
      { oldState: State.ACTIVE, state: State.END },
    ]);

    expect(onPress).toHaveBeenCalledTimes(1);
  });
});

[Copilot]

Pull request overview

Adds a Jest mock export for the Clickable component within the gesture button mocks, intended to simplify testing usage of Clickable in environments using the library’s mocks.

Changes:

• Export Clickable from src/mocks/GestureButtons.tsx as an alias of RawButton.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Clickable is a v3 export (src/v3/components/index.ts -> src/v3/components/Clickable/Clickable), but this mock file is used to mock ./src/components/GestureButtons (legacy) in jestSetup.js. Exporting Clickable here likely won’t affect import { Clickable } from 'react-native-gesture-handler' in tests, so the PR may not actually provide a Jest mock for the public Clickable API. Consider adding a dedicated v3 Clickable mock and wiring it up in jestSetup.js (e.g., mock ./src/v3/components/Clickable/Clickable or ./src/v3/components).

[m-bert]

f4b5bdb

[Copilot]

Pull request overview

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

jestSetup.js mocks v3 components only for ./lib/commonjs/... and ./lib/module/..., but not for the ./src/v3/components/... entrypoints. Since the package publishes src/ and also has a react-native entry (package.json:22) that can be used by React Native/Jest resolvers, consumers may still hit the unmocked ./src/v3/components/* implementations in tests. Add equivalent jest.mock('./src/v3/components/...') entries for Clickable, GestureButtons, Pressable, and GestureComponents to keep source and built entrypoints consistent.

[Copilot]

Pull request overview

Copilot reviewed 6 out of 6 changed files in this pull request and generated 5 comments.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.