From 46d73bffb3655af5a446fd0b299ee54ce645f5a2 Mon Sep 17 00:00:00 2001
From: Alan Lee <alanlee2@meta.com>
Date: Tue, 9 Dec 2025 10:05:06 -0800
Subject: [PATCH] Fix Modal Fantom test (#54811)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary:

Test was failing in CI with following error:
```
Summary of all failing tests
FAIL packages/react-native/Libraries/Modal/__tests__/Modal-itest.js (5.619 s)
  ● <Modal> (hermes) › props › presentationStyle › renders a Modal with presentationStyle="pageSheet"

    Exception in HostFunction: MessageQueue is not empty
        at validateEmptyMessageQueue (native)

      417 |     require('react-native/src/private/testing/fantom/specs/NativeFantom').default;
      418 |
    > 419 |   NativeFantom.validateEmptyMessageQueue();
          |                                         ^
      420 | }
      421 |
      422 | function serializeError(error: Error): FailureDetail {

      at validateEmptyMessageQueue (private/react-native-fantom/runtime/setup.js:419:41)
      at invokeHooks (private/react-native-fantom/runtime/setup.js:286:11)
      at spec (private/react-native-fantom/runtime/setup.js:336:16)
      at suite (private/react-native-fantom/runtime/setup.js:390:20)
      at child (private/react-native-fantom/runtime/setup.js:374:33)
      at suite (private/react-native-fantom/runtime/setup.js:388:22)
      at child (private/react-native-fantom/runtime/setup.js:374:33)
      at suite (private/react-native-fantom/runtime/setup.js:388:22)
      at child (private/react-native-fantom/runtime/setup.js:374:33)
      at suite (private/react-native-fantom/runtime/setup.js:388:22)
      at child (private/react-native-fantom/runtime/setup.js:374:33)
      at suite (private/react-native-fantom/runtime/setup.js:388:22)
      at currentContext (private/react-native-fantom/runtime/setup.js:436:20)
      at anonymous (private/react-native-fantom/runtime/setup.js:470:27)
```

The Modal Fantom test was failing in CI with "MessageQueue is not empty" error.
Referencing other tests, added afterEach() to call `root.destroy()` for proper cleanup after each test.

Changelog: [Internal] Fix Fantom test

Differential Revision: D88538595
---
 .../Libraries/Modal/__tests__/Modal-itest.js  | 46 +++++++++++--------
 1 file changed, 27 insertions(+), 19 deletions(-)

diff --git a/packages/react-native/Libraries/Modal/__tests__/Modal-itest.js b/packages/react-native/Libraries/Modal/__tests__/Modal-itest.js
index 9cf86470d4f77f..fb411e3f482af7 100644
--- a/packages/react-native/Libraries/Modal/__tests__/Modal-itest.js
+++ b/packages/react-native/Libraries/Modal/__tests__/Modal-itest.js
@@ -28,9 +28,15 @@ const DEFAULT_MODAL_CHILD_VIEW = (
 );
 
 describe('<Modal>', () => {
+  let root: Fantom.Root;
+
+  afterEach(() => {
+    root.destroy();
+  });
+
   describe('props', () => {
     it('renders a Modal with the default values when no props are passed', () => {
-      const root = Fantom.createRoot();
+      root = Fantom.createRoot();
 
       Fantom.runTask(() => {
         root.render(<Modal />);
@@ -44,7 +50,7 @@ describe('<Modal>', () => {
     });
     describe('animationType', () => {
       it('renders a Modal with animationType="none" by default', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal animationType="none" />);
@@ -61,7 +67,7 @@ describe('<Modal>', () => {
 
       (['slide', 'fade'] as const).forEach(animationType => {
         it(`renders a Modal with animationType="${animationType}"`, () => {
-          const root = Fantom.createRoot();
+          root = Fantom.createRoot();
 
           Fantom.runTask(() => {
             root.render(<Modal animationType={animationType} />);
@@ -80,7 +86,7 @@ describe('<Modal>', () => {
 
     describe('presentationStyle', () => {
       it('renders a Modal with presentationStyle="fullScreen" by default', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal presentationStyle="fullScreen" />);
@@ -98,7 +104,7 @@ describe('<Modal>', () => {
       (['pageSheet', 'formSheet', 'overFullScreen'] as const).forEach(
         presentationStyle => {
           it(`renders a Modal with presentationStyle="${presentationStyle}"`, () => {
-            const root = Fantom.createRoot();
+            root = Fantom.createRoot();
 
             Fantom.runTask(() => {
               root.render(<Modal presentationStyle={presentationStyle} />);
@@ -117,7 +123,7 @@ describe('<Modal>', () => {
     });
     describe('transparent', () => {
       it('renders a Modal with transparent="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal transparent={true} />);
@@ -137,7 +143,7 @@ describe('<Modal>', () => {
       });
 
       it('renders a Modal with transparent="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal transparent={false} />);
@@ -156,7 +162,7 @@ describe('<Modal>', () => {
     });
     describe('statusBarTranslucent', () => {
       it('renders a Modal with statusBarTranslucent="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal statusBarTranslucent={true} />);
@@ -171,7 +177,7 @@ describe('<Modal>', () => {
         );
       });
       it('renders a Modal with statusBarTranslucent="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal statusBarTranslucent={false} />);
@@ -188,7 +194,7 @@ describe('<Modal>', () => {
     });
     describe('navigationBarTranslucent', () => {
       it('renders a Modal with navigationBarTranslucent="true" and statusBarTranslucent="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           // navigationBarTranslucent=true with statusBarTranslucent=false is not supported
@@ -216,7 +222,7 @@ describe('<Modal>', () => {
         );
       });
       it('renders a Modal with navigationBarTranslucent="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal navigationBarTranslucent={false} />);
@@ -238,7 +244,7 @@ describe('<Modal>', () => {
 
     describe('hardwareAccelerated', () => {
       it('renders a Modal with hardwareAccelerated="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal hardwareAccelerated={true} />);
@@ -253,7 +259,7 @@ describe('<Modal>', () => {
         );
       });
       it('renders a Modal with hardwareAccelerated="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal hardwareAccelerated={false} />);
@@ -271,7 +277,7 @@ describe('<Modal>', () => {
 
     describe('visible', () => {
       it('renders a Modal with visible="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal visible={true} />);
@@ -283,8 +289,9 @@ describe('<Modal>', () => {
           </rn-modalHostView>,
         );
       });
+
       it('renders nothing when visible="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal visible={false} />);
@@ -296,7 +303,7 @@ describe('<Modal>', () => {
 
     describe('allowSwipeDismissal', () => {
       it('renders a Modal with allowSwipeDismissal="true"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal allowSwipeDismissal={true} />);
@@ -311,7 +318,7 @@ describe('<Modal>', () => {
         );
       });
       it('renders a Modal with allowSwipeDismissal="false"', () => {
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
 
         Fantom.runTask(() => {
           root.render(<Modal allowSwipeDismissal={false} />);
@@ -332,7 +339,7 @@ describe('<Modal>', () => {
         // The 'animated' prop is deprecated and ignored when the Modal is rendered
         // Users should use the 'animationType' prop instead.
         it(`[DEPRECATED] renders a Modal with animated="${animated ? 'true' : 'false'}"`, () => {
-          const root = Fantom.createRoot();
+          root = Fantom.createRoot();
 
           Fantom.runTask(() => {
             root.render(<Modal animated={animated} />);
@@ -356,7 +363,8 @@ describe('<Modal>', () => {
     describe('instance', () => {
       it('uses the "RN:ModalHostView" tag name', () => {
         const elementRef = createRef<HostInstance>();
-        const root = Fantom.createRoot();
+        root = Fantom.createRoot();
+
         Fantom.runTask(() => {
           root.render(<Modal ref={elementRef} />);
         });