feat: modern fireEvent.press

Author: mdjastrzebski

src/events/__tests__/fire-event.test.tsx

@@ -60,17 +60,19 @@ test('fireEvent.changeText', async () => {
   );
 });
 
-test('fireEvent.press uses the legacy implementation', async () => {
+test('fireEvent.press calls onPress of Pressable with the event of the selected event system', async () => {
   const onPress = jest.fn();
   await render(
     <Pressable testID="pressable" onPress={onPress}>
       <Text>Press me</Text>
     </Pressable>,
   );
 
-  expect(await fireEvent.press(screen.getByText('Press me'))).toBeUndefined();
+  const result = await fireEvent.press(screen.getByText('Press me'));
+  const isModern = getConfig().unstable_eventSystem === 'modern';
+  expect(result).toBe(isModern ? true : undefined);
   expect(onPress).toHaveBeenCalledTimes(1);
-  expect(onPress.mock.calls[0][0]).not.toBeInstanceOf(SyntheticEvent);
+  expect(onPress.mock.calls[0][0] instanceof SyntheticEvent).toBe(isModern);
 });
 
 test('fireEvent.scroll and fireEvent.layout pass events of the selected event system', async () => {

src/events/fire-event.ts

@@ -32,10 +32,16 @@ fireEvent.changeText = async (instance: TestInstance, text: string): Promise<unk
   return await legacyFireEvent.changeText(instance, text);
 };
 
-// Legacy in both event systems for now: `Pressable` and `Touchable*` get touches through the
-// responder system, which the modern event system doesn't implement yet.
-fireEvent.press = async (instance: TestInstance, eventProps?: EventProps): Promise<void> => {
+fireEvent.press = async (
+  instance: TestInstance,
+  eventProps?: EventProps,
+): Promise<boolean | undefined> => {
+  if (isModern()) {
+    return await modernFireEvent.press(instance, eventProps as FireEventInit);
+  }
+
   await legacyFireEvent.press(instance, eventProps);
+  return undefined;
 };
 
 fireEvent.scroll = async (

src/events/legacy/index.ts

@@ -1,6 +1,6 @@
 export * from './builders/common';
 export * from '../shared/handler';
-export { isPointerEventEnabled } from './is-enabled';
+export { isPointerEventEnabled } from '../shared/pointer-events';
 export * from '../shared/native-state';
 export type { EventWarning } from './warnings';
 export { formatDisabledTargets, getPointerEventsBlockedTargets, logEventWarning } from './warnings';

src/events/legacy/is-enabled.ts

@@ -1,27 +1,8 @@
-import { StyleSheet } from 'react-native';
 import type { TestInstance } from 'test-renderer';
 
 import { isHostTextInput } from '../../helpers/host-component-names';
 import { isEditableTextInput } from '../../helpers/text-input';
-
-/**
- * pointerEvents controls whether the View can be the target of touch events.
- * 'auto': The View and its children can be the target of touch events.
- * 'none': The View is never the target of touch events.
- * 'box-none': The View is never the target of touch events but its subviews can be
- * 'box-only': The view can be the target of touch events but its subviews cannot be
- * see the official react native doc https://reactnative.dev/docs/view#pointerevents */
-export function isPointerEventEnabled(instance: TestInstance): boolean {
-  return getPointerEventsBlocker(instance) == null;
-}
-
-/**
- * Returns the element whose `pointerEvents` prevents the instance from being the target of
- * touch events: the instance itself or one of its ancestors. Returns `null` if nothing blocks it.
- */
-export function getPointerEventsBlocker(instance: TestInstance): TestInstance | null {
-  return findPointerEventsBlocker(instance, false);
-}
+import { isPointerEventEnabled } from '../shared/pointer-events';
 
 export function isTouchResponder(instance: TestInstance) {
   return Boolean(instance.props.onStartShouldSetResponder) || isHostTextInput(instance);
@@ -73,21 +54,3 @@ export function isEventEnabled(
 
   return touchStart === undefined && touchMove === undefined;
 }
-
-function findPointerEventsBlocker(instance: TestInstance, isParent: boolean): TestInstance | null {
-  // Check both props.pointerEvents and props.style.pointerEvents
-  const pointerEvents =
-    instance?.props.pointerEvents ?? StyleSheet.flatten(instance?.props.style)?.pointerEvents;
-
-  const parentCondition = isParent ? pointerEvents === 'box-only' : pointerEvents === 'box-none';
-
-  if (pointerEvents === 'none' || parentCondition) {
-    return instance;
-  }
-
-  if (!instance.parent) {
-    return null;
-  }
-
-  return findPointerEventsBlocker(instance.parent, true);
-}

src/events/legacy/warnings.ts

@@ -8,7 +8,8 @@ import { isHostTextInput } from '../../helpers/host-component-names';
 import { logger } from '../../helpers/logger';
 import { isEditableTextInput } from '../../helpers/text-input';
 import { getEventHandlerName, normalizeEventType } from '../shared/handler';
-import { getPointerEventsBlocker, isEventBlockableByPointerEvents } from './is-enabled';
+import { getPointerEventsBlocker } from '../shared/pointer-events';
+import { isEventBlockableByPointerEvents } from './is-enabled';
 
 type UnhandledEventInfo = {
   skippedTargets: TestInstance[];