fix: suspense respects enabled and stale (#238)

* fix: suspense respects enabled and stale

* test: suspense tests

* fix: suspense test against disabled specifically

Author: DamianOsipiuk

jest.config.ts

@@ -16,6 +16,7 @@ const config: Config.InitialOptions = {
     // Exlude devtools
     "!src/vuejs/devtools/**/*",
   ],
+  clearMocks: true,
 };
 
 export default config;

src/vuejs/__tests__/mutationCache.test.ts

@@ -9,10 +9,6 @@ describe("MutationCache", () => {
     jest.spyOn(MutationCacheOrigin.prototype, "findAll");
   });
 
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   describe("find", () => {
     test("should properly unwrap parameters", async () => {
       const mutationCache = new MutationCache();

src/vuejs/__tests__/queryCache.test.ts

@@ -9,10 +9,6 @@ describe("QueryCache", () => {
     jest.spyOn(QueryCacheOrigin.prototype, "findAll");
   });
 
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   describe("find", () => {
     test("should properly unwrap parameters", async () => {
       const queryCache = new QueryCache();

src/vuejs/__tests__/queryClient.test.ts

@@ -16,10 +16,6 @@ describe("QueryCache", () => {
   //   jest.spyOn(QueryCacheOrigin.prototype, "findAll");
   // });
 
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   describe("isFetching", () => {
     test("should properly unwrap 1 parameter", async () => {
       const queryClient = new QueryClient();

src/vuejs/__tests__/useInfiniteQuery.test.ts

@@ -4,10 +4,6 @@ import { useInfiniteQuery } from "../useInfiniteQuery";
 jest.mock("../useQueryClient");
 
 describe("useQuery", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should properly execute infinite query", async () => {
     const { data, fetchNextPage, status } = useInfiniteQuery(
       ["infiniteQuery"],

src/vuejs/__tests__/useIsFetching.test.ts

@@ -7,10 +7,6 @@ import { parseFilterArgs, useIsFetching } from "../useIsFetching";
 jest.mock("../useQueryClient");
 
 describe("useIsFetching", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should properly return isFetching state", async () => {
     const { isFetching: isFetchingQuery } = useQuery(
       ["isFetching1"],

src/vuejs/__tests__/useIsMutating.test.ts

@@ -8,10 +8,6 @@ import { useQueryClient } from "../useQueryClient";
 jest.mock("../useQueryClient");
 
 describe("useIsMutating", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should properly return isMutating state", async () => {
     const mutation = useMutation((params: string) => successMutator(params));
     const mutation2 = useMutation((params: string) => successMutator(params));

src/vuejs/__tests__/useMutation.test.ts

@@ -6,10 +6,6 @@ import { useQueryClient } from "../useQueryClient";
 jest.mock("../useQueryClient");
 
 describe("useMutation", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should be in idle state initially", () => {
     const mutation = useMutation((params) => successMutator(params));
 

src/vuejs/__tests__/useQueries.test.ts

@@ -11,10 +11,6 @@ import { useQueries } from "../useQueries";
 jest.mock("../useQueryClient");
 
 describe("useQueries", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should return result for each query", () => {
     const queries = [
       {

src/vuejs/__tests__/useQuery.test.ts

@@ -20,10 +20,6 @@ jest.mock("../useQueryClient");
 jest.mock("../useBaseQuery");
 
 describe("useQuery", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
   test("should properly execute query", () => {
     useQuery(["key0"], simpleFetcher, { staleTime: 1000 });
 
@@ -239,10 +235,47 @@ describe("useQuery", () => {
       const getCurrentInstanceSpy = getCurrentInstance as jest.Mock;
       getCurrentInstanceSpy.mockImplementation(() => ({ suspense: {} }));
 
-      const query = useQuery(["suspense3"], simpleFetcher);
+      const query = useQuery(["suspense"], simpleFetcher);
       const result = query.suspense();
 
       expect(result).toBeInstanceOf(Promise);
     });
+
+    test("should resolve after being enabled", () => {
+      const getCurrentInstanceSpy = getCurrentInstance as jest.Mock;
+      getCurrentInstanceSpy.mockImplementation(() => ({ suspense: {} }));
+
+      let afterTimeout = false;
+      const isEnabeld = ref(false);
+      const query = useQuery(["suspense"], simpleFetcher, {
+        enabled: isEnabeld,
+      });
+
+      setTimeout(() => {
+        afterTimeout = true;
+        isEnabeld.value = true;
+      }, 200);
+
+      return query.suspense().then((result) => {
+        expect(afterTimeout).toBe(true);
+      });
+    });
+
+    test("should resolve immidiately when stale without refetching", () => {
+      const getCurrentInstanceSpy = getCurrentInstance as jest.Mock;
+      getCurrentInstanceSpy.mockImplementation(() => ({ suspense: {} }));
+
+      const fetcherSpy = jest.fn(() => simpleFetcher());
+
+      // let afterTimeout = false;
+      const query = useQuery(["suspense"], simpleFetcher, {
+        staleTime: 10000,
+        initialData: "foo",
+      });
+
+      return query.suspense().then(() => {
+        expect(fetcherSpy).toHaveBeenCalledTimes(0);
+      });
+    });
   });
 });