[No QA] Fix SubmitPlanWelcomeModal test by rendering inside NavigationContainer

src/libs/ExportOnyxState/common.ts

@@ -245,6 +245,7 @@ const safeOnyxKeys = new Set<string>([
     ONYXKEYS.NVP_SEARCH_SIDEBAR,
     ONYXKEYS.NVP_SEEN_NEW_USER_MODAL,
     ONYXKEYS.NVP_SIDE_PANEL,
+    ONYXKEYS.NVP_SUBMIT_MIGRATION_MODAL_SHOWN,
     ONYXKEYS.NVP_TRY_FOCUS_MODE,
     ONYXKEYS.NVP_TRY_NEW_DOT,
     ONYXKEYS.ONBOARDING_ADMINS_CHAT_REPORT_ID,

tests/ui/components/SubmitPlanWelcomeModalTest.tsx

@@ -1,4 +1,4 @@
-import {fireEvent, render, screen} from '@testing-library/react-native';
+import {fireEvent, render, screen, waitFor} from '@testing-library/react-native';
 
 import OnyxListItemProvider from '@components/OnyxListItemProvider';
 import SubmitPlanWelcomeModal from '@components/SubmitPlanWelcomeModal';
@@ -8,6 +8,8 @@ import ONYXKEYS from '@src/ONYXKEYS';
 import type {ViewProps} from 'react-native';
 import type ReactNative from 'react-native';
 
+import {NavigationContainer} from '@react-navigation/native';
+import {createStackNavigator} from '@react-navigation/stack';
 import React from 'react';
 import Onyx from 'react-native-onyx';
 
@@ -48,6 +50,20 @@ jest.mock('@components/ImageSVG', () => {
     return (props: ViewProps) => <View {...props} />;
 });
 
+const Stack = createStackNavigator();
+
+// The modal renders FormAlertWithSubmitButton, which uses usePressLoading -> useFocusEffect. That hook
+// needs a navigation context, so the modal must be rendered inside a NavigationContainer/screen.
+function withNavigation(ui: React.ReactElement): React.ReactElement {
+    return (
+        <NavigationContainer>
+            <Stack.Navigator>
+                <Stack.Screen name="SubmitPlanWelcomeModal">{() => ui}</Stack.Screen>
+            </Stack.Navigator>
+        </NavigationContainer>
+    );
+}
+
 describe('SubmitPlanWelcomeModal', () => {
     beforeAll(() => {
         Onyx.init({keys: ONYXKEYS});
@@ -61,19 +77,16 @@ describe('SubmitPlanWelcomeModal', () => {
     });
 
     function renderModal() {
-        return render(
-            <OnyxListItemProvider>
-                <SubmitPlanWelcomeModal />
-            </OnyxListItemProvider>,
-        );
+        return render(<OnyxListItemProvider>{withNavigation(<SubmitPlanWelcomeModal />)}</OnyxListItemProvider>);
     }
 
-    it('creates a Submit workspace with the current user name when "Get the free plan" is pressed', () => {
+    it('creates a Submit workspace with the current user name when "Get the free plan" is pressed', async () => {
         renderModal();
 
         fireEvent.press(screen.getByText('submitPlanWelcomeModal.confirmText'));
 
-        expect(mockAutoCreateSubmitWorkspace).toHaveBeenCalledWith('John', 'Doe', false);
+        // FormAlertWithSubmitButton runs onSubmit through usePressLoading, which defers the work by one macrotask, so wait for the call.
+        await waitFor(() => expect(mockAutoCreateSubmitWorkspace).toHaveBeenCalledWith('John', 'Doe', false));
     });
 
     it('navigates back (dismissing the modal) when "No thanks" is pressed', () => {