test(cli): refactor tests for async render utilities (#23252)

packages/cli/src/test-utils/render.test.tsx

@@ -12,24 +12,18 @@ import { waitFor } from './async.js';
 
 describe('render', () => {
   it('should render a component', async () => {
-    const { lastFrame, waitUntilReady, unmount } = render(
-      <Text>Hello World</Text>,
-    );
-    await waitUntilReady();
+    const { lastFrame, unmount } = await render(<Text>Hello World</Text>);
     expect(lastFrame()).toBe('Hello World\n');
     unmount();
   });
 
   it('should support rerender', async () => {
-    const { lastFrame, rerender, waitUntilReady, unmount } = render(
+    const { lastFrame, rerender, waitUntilReady, unmount } = await render(
       <Text>Hello</Text>,
     );
-    await waitUntilReady();
     expect(lastFrame()).toBe('Hello\n');
 
-    await act(async () => {
-      rerender(<Text>World</Text>);
-    });
+    await act(async () => rerender(<Text>World</Text>));
     await waitUntilReady();
     expect(lastFrame()).toBe('World\n');
     unmount();
@@ -42,10 +36,8 @@ describe('render', () => {
       return <Text>Hello</Text>;
     }
 
-    const { unmount, waitUntilReady } = render(<TestComponent />);
-    await waitUntilReady();
+    const { unmount } = await render(<TestComponent />);
     unmount();
-
     expect(cleanupMock).toHaveBeenCalled();
   });
 });
@@ -54,36 +46,27 @@ describe('renderHook', () => {
   it('should rerender with previous props when called without arguments', async () => {
     const useTestHook = ({ value }: { value: number }) => {
       const [count, setCount] = useState(0);
-      useEffect(() => {
-        setCount((c) => c + 1);
-      }, [value]);
+      useEffect(() => setCount((c) => c + 1), [value]);
       return { count, value };
     };
 
-    const { result, rerender, waitUntilReady, unmount } = renderHook(
+    const { result, rerender, waitUntilReady, unmount } = await renderHook(
       useTestHook,
-      {
-        initialProps: { value: 1 },
-      },
+      { initialProps: { value: 1 } },
     );
-    await waitUntilReady();
 
     expect(result.current.value).toBe(1);
     await waitFor(() => expect(result.current.count).toBe(1));
 
     // Rerender with new props
-    await act(async () => {
-      rerender({ value: 2 });
-    });
+    await act(async () => rerender({ value: 2 }));
     await waitUntilReady();
     expect(result.current.value).toBe(2);
     await waitFor(() => expect(result.current.count).toBe(2));
 
     // Rerender without arguments should use previous props (value: 2)
     // This would previously crash or pass undefined if not fixed
-    await act(async () => {
-      rerender();
-    });
+    await act(async () => rerender());
     await waitUntilReady();
     expect(result.current.value).toBe(2);
     // Count should not increase because value didn't change
@@ -98,14 +81,11 @@ describe('renderHook', () => {
     };
 
     const { result, rerender, waitUntilReady, unmount } =
-      renderHook(useTestHook);
-    await waitUntilReady();
+      await renderHook(useTestHook);
 
     expect(result.current.count).toBe(0);
 
-    await act(async () => {
-      rerender();
-    });
+    await act(async () => rerender());
     await waitUntilReady();
     expect(result.current.count).toBe(0);
     unmount();
@@ -113,19 +93,14 @@ describe('renderHook', () => {
 
   it('should update props if undefined is passed explicitly', async () => {
     const useTestHook = (val: string | undefined) => val;
-    const { result, rerender, waitUntilReady, unmount } = renderHook(
+    const { result, rerender, waitUntilReady, unmount } = await renderHook(
       useTestHook,
-      {
-        initialProps: 'initial' as string | undefined,
-      },
+      { initialProps: 'initial' },
     );
-    await waitUntilReady();
 
     expect(result.current).toBe('initial');
 
-    await act(async () => {
-      rerender(undefined);
-    });
+    await act(async () => rerender(undefined));
     await waitUntilReady();
     expect(result.current).toBeUndefined();
     unmount();