fix: do not send events on unmounted components

Author: mdjastrzebski

src/fire-event.ts

@@ -7,7 +7,7 @@ import {
   ScrollViewProps,
 } from 'react-native';
 import act from './act';
-import { isHostElement } from './helpers/component-tree';
+import { isElementMounted, isHostElement } from './helpers/component-tree';
 import { isHostScrollView, isHostTextInput } from './helpers/host-component-names';
 import { isPointerEventEnabled } from './helpers/pointer-events';
 import { isTextInputEditable } from './helpers/text-input';
@@ -121,6 +121,10 @@ type EventName = StringWithAutocomplete<
 >;
 
 function fireEvent(element: ReactTestInstance, eventName: EventName, ...data: unknown[]) {
+  if (!isElementMounted(element)) {
+    return;
+  }
+
   setNativeStateIfNeeded(element, eventName, data[0]);
 
   const handler = findEventHandler(element, eventName);

src/helpers/component-tree.ts

@@ -1,5 +1,5 @@
 import { ReactTestInstance } from 'react-test-renderer';
-
+import { screen } from '../screen';
 /**
  * ReactTestInstance referring to host element.
  */
@@ -13,6 +13,10 @@ export function isHostElement(element?: ReactTestInstance | null): element is Ho
   return typeof element?.type === 'string';
 }
 
+export function isElementMounted(element: ReactTestInstance | null) {
+  return getUnsafeRootElement(element) === screen.UNSAFE_root;
+}
+
 /**
  * Returns first host ancestor for given element.
  * @param element The element start traversing from.

src/user-event/press/__tests__/press.test.tsx

@@ -372,3 +372,27 @@ describe('userEvent.press with fake timers', () => {
     expect(consoleErrorSpy).not.toHaveBeenCalled();
   });
 });
+
+function Component() {
+  const [mounted, setMounted] = React.useState(true);
+
+  const onPressIn = () => {
+    setMounted(false);
+  };
+
+  return (
+    <View>
+      {mounted && (
+        <Pressable onPressIn={onPressIn}>
+          <Text>Unmount</Text>
+        </Pressable>
+      )}
+    </View>
+  );
+}
+
+test('unmounts component', async () => {
+  render(<Component />);
+  await userEvent.press(screen.getByText('Unmount'));
+  expect(screen.queryByText('Unmount')).not.toBeOnTheScreen();
+});

src/user-event/utils/dispatch-event.ts

@@ -1,5 +1,6 @@
 import { ReactTestInstance } from 'react-test-renderer';
 import act from '../../act';
+import { isElementMounted } from '../../helpers/component-tree';
 
 /**
  * Basic dispatch event function used by User Event module.
@@ -9,6 +10,10 @@ import act from '../../act';
  * @param event event payload(s)
  */
 export function dispatchEvent(element: ReactTestInstance, eventName: string, ...event: unknown[]) {
+  if (!isElementMounted(element)) {
+    return;
+  }
+
   const handler = getEventHandler(element, eventName);
   if (!handler) {
     return;