Fix tests after upgrade @testing-library/react

reduxjs · Nov 24, 2024 · 6dd69f5 · 6dd69f5
1 parent bed2d60
commit 6dd69f5
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 22 deletions.
diff --git a/packages/toolkit/src/query/tests/buildHooks.test.tsx b/packages/toolkit/src/query/tests/buildHooks.test.tsx
@@ -6,6 +6,7 @@ import {
   actionsReducer,
   setupApiStore,
   useRenderCounter,
+  waitForFakeTimer,
   waitMs,
   withProvider,
 } from '@internal/tests/utils/helpers'
@@ -46,7 +47,7 @@ interface Item {
 
 const api = createApi({
   baseQuery: async (arg: any) => {
-    await waitMs(150)
+    await waitForFakeTimer(20)
     if (arg?.body && 'amount' in arg.body) {
       amount += 1
     }
@@ -774,7 +775,7 @@ describe('hooks tests', () => {
         resPromise = refetch()
       })
       expect(resPromise).toBeInstanceOf(Promise)
-      const res = await resPromise
+      const res = await act(() => resPromise)
       expect(res.data!.amount).toBeGreaterThan(originalAmount)
     })
 
@@ -954,15 +955,15 @@ describe('hooks tests', () => {
       // Allow at least three state effects to hit.
       // Trying to see if any [true, false, true] occurs.
       await act(async () => {
-        await waitMs(1)
+        await waitForFakeTimer(20)
       })
 
       await act(async () => {
-        await waitMs(1)
+        await waitForFakeTimer(20)
       })
 
       await act(async () => {
-        await waitMs(1)
+        await waitForFakeTimer(20)
       })
 
       // Find if at any time the isLoading state has reverted
@@ -1723,7 +1724,8 @@ describe('hooks tests', () => {
         expect(screen.getByTestId('isFetching').textContent).toBe('false'),
       )
 
-      userEvent.hover(screen.getByTestId('highPriority'))
+      await userEvent.hover(screen.getByTestId('highPriority'))
+
       expect(
         api.endpoints.getUser.select(USER_ID)(storeRef.store.getState() as any),
       ).toEqual({
@@ -1860,7 +1862,7 @@ describe('hooks tests', () => {
       await waitMs(400)
 
       // This should run the query being that we're past the threshold
-      userEvent.hover(screen.getByTestId('lowPriority'))
+      await userEvent.hover(screen.getByTestId('lowPriority'))
       expect(
         api.endpoints.getUser.select(USER_ID)(storeRef.store.getState() as any),
       ).toEqual({
@@ -1960,7 +1962,7 @@ describe('hooks tests', () => {
 
       render(<User />, { wrapper: storeRef.wrapper })
 
-      userEvent.hover(screen.getByTestId('lowPriority'))
+      await userEvent.hover(screen.getByTestId('lowPriority'))
 
       expect(
         api.endpoints.getUser.select(USER_ID)(storeRef.store.getState() as any),
@@ -2852,6 +2854,11 @@ describe('skip behavior', () => {
     await act(async () => {
       rerender([1])
     })
+
+    await act(async () => {
+      await waitForFakeTimer(20)
+    })
+
     expect(result.current).toMatchObject({ status: QueryStatus.fulfilled })
     await waitMs(1)
     expect(getSubscriptionCount('getUser(1)')).toBe(1)
@@ -2888,6 +2895,11 @@ describe('skip behavior', () => {
     await act(async () => {
       rerender([1])
     })
+
+    await act(async () => {
+      await waitForFakeTimer(20)
+    })
+
     expect(result.current).toMatchObject({ status: QueryStatus.fulfilled })
     await waitMs(1)
     expect(getSubscriptionCount('getUser(1)')).toBe(1)
@@ -2916,7 +2928,7 @@ describe('skip behavior', () => {
     )
 
     await act(async () => {
-      await waitMs(1)
+      await waitForFakeTimer(20)
     })
 
     // Normal fulfilled result, with both `data` and `currentData`

diff --git a/packages/toolkit/src/query/tests/cleanup.test.tsx b/packages/toolkit/src/query/tests/cleanup.test.tsx
@@ -43,7 +43,7 @@ function UsingAB() {
 }
 
 beforeAll(() => {
-  vi.useFakeTimers()
+  vi.useFakeTimers({ shouldAdvanceTime: true })
 })
 
 test('data stays in store when component stays rendered', async () => {

diff --git a/packages/toolkit/src/query/tests/refetchingBehaviors.test.tsx b/packages/toolkit/src/query/tests/refetchingBehaviors.test.tsx
@@ -71,12 +71,12 @@ describe('refetchOnFocus tests', () => {
       expect(screen.getByTestId('amount').textContent).toBe('1'),
     )
 
+    fireEvent.focus(window)
+
     await act(async () => {
-      fireEvent.focus(window)
+      await delay(150)
     })
 
-    await delay(150)
-
     await waitFor(() =>
       expect(screen.getByTestId('amount').textContent).toBe('2'),
     )
@@ -111,9 +111,7 @@ describe('refetchOnFocus tests', () => {
       expect(screen.getByTestId('amount').textContent).toBe('1'),
     )
 
-    act(() => {
-      fireEvent.focus(window)
-    })
+    fireEvent.focus(window)
 
     await delay(150)
 
@@ -165,9 +163,7 @@ describe('refetchOnFocus tests', () => {
       expect(screen.getByTestId('amount').textContent).toBe('1'),
     )
 
-    act(() => {
-      fireEvent.focus(window)
-    })
+    fireEvent.focus(window)
     expect(screen.getByTestId('isLoading').textContent).toBe('false')
     await waitFor(() =>
       expect(screen.getByTestId('isFetching').textContent).toBe('true'),
@@ -213,9 +209,7 @@ describe('refetchOnFocus tests', () => {
 
     expect(getIncrementedAmountState()).not.toBeUndefined()
 
-    await act(async () => {
-      fireEvent.focus(window)
-    })
+    fireEvent.focus(window)
 
     await delay(1)
     expect(getIncrementedAmountState()).toBeUndefined()