feat: 🎸 handle promise rice

ariesjia · Jul 31, 2020 · 714358c · 714358c
1 parent ecae3b4
commit 714358c
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 10 deletions.
diff --git a/src/__tests__/index.test.tsx b/src/__tests__/index.test.tsx
@@ -180,7 +180,6 @@ describe("usePromiseCall test",() => {
       await flushPromises();
     })
   })
-
   it('should set loading when excute reload method', async () => {
     const query = jest.fn().mockResolvedValue(null)
     const { container } = render(() => {
@@ -197,9 +196,42 @@ describe("usePromiseCall test",() => {
     act(() => {
       container.hook.run('id')
     })
+    expect(container.hook.loading).toBeTruthy();
     await act(async () => {
       await flushPromises();
     })
-    expect(query).toHaveBeenCalledWith('id');
+    expect(container.hook.loading).toBeFalsy();
+  })
+  it('should handle promise race', async () => {
+    let called = false;
+    let count = 0;
+    const query = jest.fn().mockImplementation(() => {
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          resolve(++count)
+        }, called ? 100 : 200)
+      })
+    })
+    const { container } = render(() => {
+      return usePromiseCall(
+        query,
+        [],
+        { manual:true }
+      )
+    })
+    act(() => {
+      container.hook.run()
+      container.hook.run()
+    })
+    await act(async () => {
+      await flushTimeout(100);
+    })
+    expect(container.hook.data).toEqual(null);
+    expect(container.hook.loading).toBeTruthy();
+    await act(async () => {
+      await flushTimeout(100);
+    })
+    expect(container.hook.data).toEqual(2);
+    expect(container.hook.loading).toBeFalsy();
   })
 })
diff --git a/src/index.ts b/src/index.ts
@@ -25,6 +25,7 @@ const usePromiseCall = <T = any, K = any>(
 ) => {
   const { interval = 100, initial = null, manual } = options
   const didCancel = useRef(false);
+  const lastCall = useRef<number>(0);
   const initialValue: State<T, K> = {
     data: initial,
     error: null,
@@ -47,6 +48,8 @@ const usePromiseCall = <T = any, K = any>(
   );
   const paramsRef = useRef();
   const load = (requestParams: any) => {
+    lastCall.current += 1;
+    const callNumber = lastCall.current;
     const params = getParamArray(requestParams);
     dispatch({
       error: null,
@@ -55,16 +58,20 @@ const usePromiseCall = <T = any, K = any>(
     const promise = asyncMethod(...params);
     promise.then(
       res => {
-        dispatch({
-          data: res,
-          loading: false,
-        });
+        if(callNumber === lastCall.current) {
+          dispatch({
+            data: res,
+            loading: false,
+          });
+        }
       },
       err => {
-        dispatch({
-          error: err,
-          loading: false,
-        });
+        if(callNumber === lastCall.current) {
+          dispatch({
+            error: err,
+            loading: false,
+          });
+        }
       },
     );
     return promise