diff --git a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte
index 3e95c2416d..06230edd15 100644
--- a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte
+++ b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/AwaitOnSuccess.svelte
@@ -3,11 +3,10 @@
import { sleep } from '../utils'
import type { Writable } from 'svelte/store'
- export let key: Array
export let states: Writable>
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
states.update((s) => [...s, 'fetching'])
await sleep(10)
@@ -17,7 +16,5 @@
})
-
-
{$state.data}
- fetchStatus: {$state.fetchStatus}
-
+{$query.data}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte b/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte
index d2a863c707..387a34ac0e 100644
--- a/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte
+++ b/packages/svelte-query-persist-client/tests/FreshData/FreshData.svelte
@@ -4,12 +4,11 @@
import type { Writable } from 'svelte/store'
import type { StatusResult } from '../utils'
- export let key: Array
export let states: Writable>>
export let fetched: Writable
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
fetched.set(true)
await sleep(10)
@@ -19,10 +18,8 @@
staleTime: Infinity,
})
- $: states.update((prev) => [...prev, $state])
+ $: states.update((prev) => [...prev, $query])
-
-
data: {$state.data ?? 'null'}
- fetchStatus: {$state.fetchStatus}
-
+data: {$query.data ?? 'null'}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte b/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte
index 8500e62e4b..4c91c2a2c6 100644
--- a/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/FreshData/Provider.svelte
@@ -8,11 +8,10 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let states: Writable>>
export let fetched: Writable
-
+
diff --git a/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte b/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte
index 055dc5a433..2095508dd1 100644
--- a/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte
+++ b/packages/svelte-query-persist-client/tests/InitialData/InitialData.svelte
@@ -4,11 +4,10 @@
import type { Writable } from 'svelte/store'
import type { StatusResult } from '../utils'
- export let key: Array
export let states: Writable>>
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
await sleep(10)
return 'fetched'
@@ -20,10 +19,8 @@
initialDataUpdatedAt: 1,
})
- $: states.update((prev) => [...prev, $state])
+ $: states.update((prev) => [...prev, $query])
-
-
{$state.data}
- fetchStatus: {$state.fetchStatus}
-
+{$query.data}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte b/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte
index 8a4f9011b0..bb7c585027 100644
--- a/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/InitialData/Provider.svelte
@@ -8,10 +8,9 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let states: Writable>>
-
+
diff --git a/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte b/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte
index 335f44741a..2ae8e7d970 100644
--- a/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte
+++ b/packages/svelte-query-persist-client/tests/OnSuccess/OnSuccess.svelte
@@ -2,10 +2,8 @@
import { createQuery } from '@tanstack/svelte-query'
import { sleep } from '../utils'
- export let key: Array
-
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
await sleep(10)
return 'fetched'
@@ -13,7 +11,5 @@
})
-
-
{$state.data}
- fetchStatus: {$state.fetchStatus}
-
+{$query.data}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte b/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte
index 8da03b9ca2..c0d2792771 100644
--- a/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/OnSuccess/Provider.svelte
@@ -6,10 +6,9 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let onSuccess: () => void
-
+
diff --git a/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts b/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts
index ab1bf7b515..0188d210e1 100644
--- a/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts
+++ b/packages/svelte-query-persist-client/tests/PersistQueryClientProvider.test.ts
@@ -9,7 +9,7 @@ import InitialData from './InitialData/Provider.svelte'
import RemoveCache from './RemoveCache/Provider.svelte'
import RestoreCache from './RestoreCache/Provider.svelte'
import UseQueries from './UseQueries/Provider.svelte'
-import { createQueryClient, queryKey, sleep } from './utils'
+import { createQueryClient, sleep } from './utils'
import type {
PersistedClient,
@@ -56,12 +56,11 @@ const createMockErrorPersister = (
describe('PersistQueryClientProvider', () => {
test('restores cache from persister', async () => {
- const key = queryKey()
const statesStore: Writable>> = writable([])
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -75,7 +74,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
states: statesStore,
},
})
@@ -113,12 +111,11 @@ describe('PersistQueryClientProvider', () => {
})
test('should also put useQueries into idle state', async () => {
- const key = queryKey()
const statesStore: Writable>> = writable([])
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -132,7 +129,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
states: statesStore,
},
})
@@ -171,12 +167,11 @@ describe('PersistQueryClientProvider', () => {
})
test('should show initialData while restoring', async () => {
- const key = queryKey()
const statesStore: Writable>> = writable([])
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -190,7 +185,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
states: statesStore,
},
})
@@ -228,12 +222,11 @@ describe('PersistQueryClientProvider', () => {
})
test('should not refetch after restoring when data is fresh', async () => {
- const key = queryKey()
const statesStore: Writable>> = writable([])
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -249,7 +242,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
states: statesStore,
fetched,
},
@@ -277,11 +269,9 @@ describe('PersistQueryClientProvider', () => {
})
test('should call onSuccess after successful restoring', async () => {
- const key = queryKey()
-
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -297,7 +287,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
onSuccess,
},
})
@@ -310,11 +299,9 @@ describe('PersistQueryClientProvider', () => {
})
test('should await onSuccess after successful restoring', async () => {
- const key = queryKey()
-
const queryClient = createQueryClient()
await queryClient.prefetchQuery({
- queryKey: key,
+ queryKey: ['test'],
queryFn: () => Promise.resolve('hydrated'),
})
@@ -330,7 +317,6 @@ describe('PersistQueryClientProvider', () => {
props: {
queryClient,
persistOptions: { persister },
- key,
states: statesStore,
onSuccess: async () => {
statesStore.update((s) => [...s, 'onSuccess'])
@@ -354,7 +340,6 @@ describe('PersistQueryClientProvider', () => {
})
test('should remove cache after non-successful restoring', async () => {
- const key = queryKey()
const consoleMock = vi.spyOn(console, 'error')
const consoleWarn = vi
.spyOn(console, 'warn')
@@ -367,7 +352,7 @@ describe('PersistQueryClientProvider', () => {
const [error, persister] = createMockErrorPersister(removeClient)
const rendered = render(RemoveCache, {
- props: { queryClient, persistOptions: { persister }, key },
+ props: { queryClient, persistOptions: { persister } },
})
await waitFor(() => rendered.getByText('fetched'))
diff --git a/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte b/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte
index b7b70d088f..8738e99bd5 100644
--- a/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/RemoveCache/Provider.svelte
@@ -6,9 +6,8 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
-
+
diff --git a/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte b/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte
index 335f44741a..2ae8e7d970 100644
--- a/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte
+++ b/packages/svelte-query-persist-client/tests/RemoveCache/RemoveCache.svelte
@@ -2,10 +2,8 @@
import { createQuery } from '@tanstack/svelte-query'
import { sleep } from '../utils'
- export let key: Array
-
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
await sleep(10)
return 'fetched'
@@ -13,7 +11,5 @@
})
-
-
{$state.data}
- fetchStatus: {$state.fetchStatus}
-
+{$query.data}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte b/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte
index 59e864fac3..0613c9440f 100644
--- a/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/RestoreCache/Provider.svelte
@@ -8,10 +8,9 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let states: Writable>>
-
+
diff --git a/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte b/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte
index 5122413166..7bae863702 100644
--- a/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte
+++ b/packages/svelte-query-persist-client/tests/RestoreCache/RestoreCache.svelte
@@ -4,21 +4,18 @@
import type { Writable } from 'svelte/store'
import type { StatusResult } from '../utils'
- export let key: Array
export let states: Writable>>
- const state = createQuery({
- queryKey: key,
+ const query = createQuery({
+ queryKey: ['test'],
queryFn: async () => {
await sleep(10)
return 'fetched'
},
})
- $: states.update((prev) => [...prev, $state])
+ $: states.update((prev) => [...prev, $query])
-
-
{$state.data}
- fetchStatus: {$state.fetchStatus}
-
+{$query.data}
+fetchStatus: {$query.fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte b/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte
index 2a78229255..301eb1629e 100644
--- a/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/UseQueries/Provider.svelte
@@ -8,10 +8,9 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let states: Writable>>
-
+
diff --git a/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte b/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte
index 70ef9aceab..8cf6647442 100644
--- a/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte
+++ b/packages/svelte-query-persist-client/tests/UseQueries/UseQueries.svelte
@@ -4,13 +4,12 @@
import type { Writable } from 'svelte/store'
import type { StatusResult } from '../utils'
- export let key: Array
export let states: Writable>>
- const state = createQueries({
+ const queries = createQueries({
queries: [
{
- queryKey: key,
+ queryKey: ['test'],
queryFn: async (): Promise => {
await sleep(10)
return 'fetched'
@@ -19,10 +18,8 @@
],
})
- $: states.update((prev) => [...prev, $state[0]])
+ $: states.update((prev) => [...prev, $queries[0]])
-
-
{$state[0].data}
- fetchStatus: {$state[0].fetchStatus}
-
+{$queries[0].data}
+fetchStatus: {$queries[0].fetchStatus}
diff --git a/packages/svelte-query-persist-client/tests/utils.ts b/packages/svelte-query-persist-client/tests/utils.ts
index c02d3110a0..b246d49a35 100644
--- a/packages/svelte-query-persist-client/tests/utils.ts
+++ b/packages/svelte-query-persist-client/tests/utils.ts
@@ -6,12 +6,6 @@ export function createQueryClient(config?: QueryClientConfig): QueryClient {
return new QueryClient(config)
}
-let queryKeyCount = 0
-export function queryKey(): Array {
- queryKeyCount++
- return [`query_${queryKeyCount}`]
-}
-
export function sleep(timeout: number): Promise {
return new Promise((resolve, _reject) => {
setTimeout(resolve, timeout)
diff --git a/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte b/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte
index 1912606ecd..1debd7311a 100644
--- a/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte
+++ b/packages/svelte-query/tests/QueryClientProvider/ChildComponent.svelte
@@ -5,10 +5,10 @@
const query = createQuery({
queryKey: ['hello'],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'test'
},
})
-{$query.data}
+Data: {$query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/QueryClientProvider/QueryClientProvider.test.ts b/packages/svelte-query/tests/QueryClientProvider/QueryClientProvider.test.ts
index 86c9907cb7..f144e1c9f9 100644
--- a/packages/svelte-query/tests/QueryClientProvider/QueryClientProvider.test.ts
+++ b/packages/svelte-query/tests/QueryClientProvider/QueryClientProvider.test.ts
@@ -13,7 +13,7 @@ describe('QueryClientProvider', () => {
},
})
- await waitFor(() => rendered.getByText('test'))
+ await waitFor(() => rendered.getByText('Data: test'))
expect(queryCache.find({ queryKey: ['hello'] })).toBeDefined()
})
diff --git a/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte b/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte
index 613ca52223..9eb6377e6f 100644
--- a/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte
+++ b/packages/svelte-query/tests/createInfiniteQuery/BaseExample.svelte
@@ -1,6 +1,10 @@
-Data: {JSON.stringify($query.data)}
Status: {$query.status}
diff --git a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
index 2d14e51f03..c991da6b58 100644
--- a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
+++ b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
@@ -1,19 +1,96 @@
-import { describe, test } from 'vitest'
-import { render } from '@testing-library/svelte'
-
-import { sleep } from '../utils'
+import { describe, expect, test } from 'vitest'
+import { render, waitFor } from '@testing-library/svelte'
+import { get, writable } from 'svelte/store'
import BaseExample from './BaseExample.svelte'
+import type { Writable } from 'svelte/store'
+import type { QueryObserverResult } from '@tanstack/query-core'
+
+describe('createInfiniteQuery', () => {
+ test('Return the correct states for a successful query', async () => {
+ const statesStore: Writable> = writable([])
+
+ const rendered = render(BaseExample, {
+ props: {
+ states: statesStore,
+ },
+ })
+
+ await waitFor(() => {
+ expect(rendered.queryByText('Status: success')).toBeInTheDocument()
+ })
-describe('createQuery', () => {
- test('Render and wait for success', async () => {
- const rendered = render(BaseExample)
+ const states = get(statesStore)
- await rendered.findByText('Data: undefined')
- await rendered.findByText('Status: pending')
+ expect(states).toHaveLength(2)
- await sleep(20)
+ expect(states[0]).toEqual({
+ data: undefined,
+ dataUpdatedAt: 0,
+ error: null,
+ errorUpdatedAt: 0,
+ failureCount: 0,
+ failureReason: null,
+ errorUpdateCount: 0,
+ fetchNextPage: expect.any(Function),
+ fetchPreviousPage: expect.any(Function),
+ hasNextPage: false,
+ hasPreviousPage: false,
+ isError: false,
+ isFetched: false,
+ isFetchedAfterMount: false,
+ isFetching: true,
+ isPaused: false,
+ isFetchNextPageError: false,
+ isFetchingNextPage: false,
+ isFetchPreviousPageError: false,
+ isFetchingPreviousPage: false,
+ isLoading: true,
+ isPending: true,
+ isInitialLoading: true,
+ isLoadingError: false,
+ isPlaceholderData: false,
+ isRefetchError: false,
+ isRefetching: false,
+ isStale: true,
+ isSuccess: false,
+ refetch: expect.any(Function),
+ status: 'pending',
+ fetchStatus: 'fetching',
+ })
- await rendered.findByText('Data: {"pages":[0],"pageParams":[0]}')
- await rendered.findByText('Status: success')
+ expect(states[1]).toEqual({
+ data: { pages: [0], pageParams: [0] },
+ dataUpdatedAt: expect.any(Number),
+ error: null,
+ errorUpdatedAt: 0,
+ failureCount: 0,
+ failureReason: null,
+ errorUpdateCount: 0,
+ fetchNextPage: expect.any(Function),
+ fetchPreviousPage: expect.any(Function),
+ hasNextPage: true,
+ hasPreviousPage: false,
+ isError: false,
+ isFetched: true,
+ isFetchedAfterMount: true,
+ isFetching: false,
+ isPaused: false,
+ isFetchNextPageError: false,
+ isFetchingNextPage: false,
+ isFetchPreviousPageError: false,
+ isFetchingPreviousPage: false,
+ isLoading: false,
+ isPending: false,
+ isInitialLoading: false,
+ isLoadingError: false,
+ isPlaceholderData: false,
+ isRefetchError: false,
+ isRefetching: false,
+ isStale: true,
+ isSuccess: true,
+ refetch: expect.any(Function),
+ status: 'success',
+ fetchStatus: 'idle',
+ })
})
})
diff --git a/packages/svelte-query/tests/createQueries/createQueries.test.ts b/packages/svelte-query/tests/createQueries/createQueries.test.ts
index b5f5a59cd5..8e07306210 100644
--- a/packages/svelte-query/tests/createQueries/createQueries.test.ts
+++ b/packages/svelte-query/tests/createQueries/createQueries.test.ts
@@ -13,14 +13,14 @@ describe('createQueries', () => {
{
queryKey: ['key-1'],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'Success 1'
},
},
{
queryKey: ['key-2'],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'Success 2'
},
},
@@ -50,7 +50,7 @@ describe('createQueries', () => {
queries: ids.map((id) => ({
queryKey: [id],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return id
},
})),
diff --git a/packages/svelte-query/tests/createQuery/BaseExample.svelte b/packages/svelte-query/tests/createQuery/BaseExample.svelte
index ede107bcdd..ce196f4783 100644
--- a/packages/svelte-query/tests/createQuery/BaseExample.svelte
+++ b/packages/svelte-query/tests/createQuery/BaseExample.svelte
@@ -15,11 +15,4 @@
Status: {$query.status}
Failure Count: {$query.failureCount}
-
-{#if $query.isPending}
- Loading
-{:else if $query.isError}
- Error
-{:else if $query.isSuccess}
- {$query.data}
-{/if}
+Data: {$query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQuery/DisabledExample.svelte b/packages/svelte-query/tests/createQuery/DisabledExample.svelte
index bcd5a99748..13b1895b69 100644
--- a/packages/svelte-query/tests/createQuery/DisabledExample.svelte
+++ b/packages/svelte-query/tests/createQuery/DisabledExample.svelte
@@ -2,14 +2,17 @@
import { QueryClient } from '@tanstack/query-core'
import { derived, writable } from 'svelte/store'
import { createQuery } from '../../src/createQuery'
- import { queryKey, sleep } from '../utils'
+ import { sleep } from '../utils'
+ import type { QueryObserverResult } from '@tanstack/query-core'
+ import type { Writable } from 'svelte/store'
+
+ export let states: Writable>
const queryClient = new QueryClient()
- const key = queryKey()
const count = writable(0)
const options = derived(count, ($count) => ({
- queryKey: [key, $count],
+ queryKey: ['test', $count],
queryFn: async () => {
await sleep(5)
return $count
@@ -18,8 +21,11 @@
}))
const query = createQuery(options, queryClient)
+
+ $: states.update((prev) => [...prev, $query])
+
Data: {$query.data ?? 'undefined'}
Count: {$count}
diff --git a/packages/svelte-query/tests/createQuery/PlaceholderData.svelte b/packages/svelte-query/tests/createQuery/PlaceholderData.svelte
index b56fd40e78..e864f0d419 100644
--- a/packages/svelte-query/tests/createQuery/PlaceholderData.svelte
+++ b/packages/svelte-query/tests/createQuery/PlaceholderData.svelte
@@ -13,7 +13,7 @@
const options = derived(count, ($count) => ({
queryKey: ['test', $count],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return $count
},
placeholderData: keepPreviousData,
@@ -27,4 +27,4 @@
Status: {$query.status}
-Data: {$query.data}
+Data: {$query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQuery/createQuery.test.ts b/packages/svelte-query/tests/createQuery/createQuery.test.ts
index d1c6d7b5a4..ec6d2d5c77 100644
--- a/packages/svelte-query/tests/createQuery/createQuery.test.ts
+++ b/packages/svelte-query/tests/createQuery/createQuery.test.ts
@@ -16,7 +16,7 @@ describe('createQuery', () => {
const options = {
queryKey: ['test'],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'Success'
},
}
@@ -30,7 +30,7 @@ describe('createQuery', () => {
})
await waitFor(() => {
- expect(rendered.queryByText('Success')).toBeInTheDocument()
+ expect(rendered.queryByText('Status: success')).toBeInTheDocument()
})
const states = get(statesStore)
@@ -204,7 +204,7 @@ describe('createQuery', () => {
const optionsStore = writable({
queryKey: ['test'],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'Success'
},
})
@@ -218,7 +218,7 @@ describe('createQuery', () => {
})
await waitFor(() => {
- expect(rendered.queryByText('Success')).toBeInTheDocument()
+ expect(rendered.queryByText('Status: success')).toBeInTheDocument()
})
})
@@ -230,7 +230,7 @@ describe('createQuery', () => {
const derivedStore = derived(writableStore, ($store) => ({
queryKey: [$store],
queryFn: async () => {
- await sleep(10)
+ await sleep(5)
return 'Success'
},
}))
@@ -244,7 +244,7 @@ describe('createQuery', () => {
})
await waitFor(() => {
- expect(rendered.queryByText('Success')).toBeInTheDocument()
+ expect(rendered.queryByText('Status: success')).toBeInTheDocument()
})
})
@@ -256,8 +256,8 @@ describe('createQuery', () => {
const derivedStore = derived(writableStore, ($store) => ({
queryKey: [$store],
queryFn: async () => {
- await sleep(10)
- return `Success ${$store}`
+ await sleep(5)
+ return $store
},
}))
@@ -272,22 +272,22 @@ describe('createQuery', () => {
})
await waitFor(() => {
- expect(rendered.queryByText('Success 1')).toBeInTheDocument()
- expect(rendered.queryByText('Success 2')).not.toBeInTheDocument()
+ expect(rendered.queryByText('Data: 1')).toBeInTheDocument()
+ expect(rendered.queryByText('Data: 2')).not.toBeInTheDocument()
})
writableStore.set(2)
await waitFor(() => {
- expect(rendered.queryByText('Success 1')).not.toBeInTheDocument()
- expect(rendered.queryByText('Success 2')).toBeInTheDocument()
+ expect(rendered.queryByText('Data: 1')).not.toBeInTheDocument()
+ expect(rendered.queryByText('Data: 2')).toBeInTheDocument()
})
writableStore.set(1)
await waitFor(() => {
- expect(rendered.queryByText('Success 1')).toBeInTheDocument()
- expect(rendered.queryByText('Success 2')).not.toBeInTheDocument()
+ expect(rendered.queryByText('Data: 1')).toBeInTheDocument()
+ expect(rendered.queryByText('Data: 2')).not.toBeInTheDocument()
})
})
@@ -318,6 +318,7 @@ describe('createQuery', () => {
isSuccess: false,
isPlaceholderData: false,
})
+
// Fetched
expect(states[1]).toMatchObject({
data: 0,
@@ -325,6 +326,7 @@ describe('createQuery', () => {
isSuccess: true,
isPlaceholderData: false,
})
+
// Set state
expect(states[2]).toMatchObject({
data: 0,
@@ -332,6 +334,7 @@ describe('createQuery', () => {
isSuccess: true,
isPlaceholderData: true,
})
+
// New data
expect(states[3]).toMatchObject({
data: 1,
@@ -342,7 +345,13 @@ describe('createQuery', () => {
})
test('Should not fetch when switching to a disabled query', async () => {
- const rendered = render(DisabledExample)
+ const statesStore: Writable> = writable([])
+
+ const rendered = render(DisabledExample, {
+ props: {
+ states: statesStore,
+ },
+ })
await waitFor(() => rendered.getByText('Data: 0'))
@@ -352,5 +361,30 @@ describe('createQuery', () => {
rendered.getByText('Count: 1')
rendered.getByText('Data: undefined')
})
+
+ const states = get(statesStore)
+
+ expect(states).toHaveLength(3)
+
+ // Fetch query
+ expect(states[0]).toMatchObject({
+ data: undefined,
+ isFetching: true,
+ isSuccess: false,
+ })
+
+ // Fetched query
+ expect(states[1]).toMatchObject({
+ data: 0,
+ isFetching: false,
+ isSuccess: true,
+ })
+
+ // Switch to disabled query
+ expect(states[2]).toMatchObject({
+ data: undefined,
+ isFetching: false,
+ isSuccess: false,
+ })
})
})
diff --git a/packages/svelte-query/tests/useIsFetching/BaseExample.svelte b/packages/svelte-query/tests/useIsFetching/BaseExample.svelte
index 97737ff37b..d485b7b69b 100644
--- a/packages/svelte-query/tests/useIsFetching/BaseExample.svelte
+++ b/packages/svelte-query/tests/useIsFetching/BaseExample.svelte
@@ -3,18 +3,17 @@
import { derived, writable } from 'svelte/store'
import { createQuery } from '../../src/createQuery'
import { useIsFetching } from '../../src/useIsFetching'
- import { queryKey, sleep } from '../utils'
+ import { sleep } from '../utils'
const queryClient = new QueryClient()
- const key = queryKey()
const ready = writable(false)
const isFetching = useIsFetching(undefined, queryClient)
const options = derived(ready, ($ready) => ({
- queryKey: [key],
+ queryKey: ['test'],
queryFn: async () => {
- await sleep(20)
+ await sleep(5)
return 'test'
},
enabled: $ready,
@@ -24,8 +23,6 @@
-isFetching: {$isFetching}
-{#if $query.isSuccess}
- {$query.data}
-{/if}
+isFetching: {$isFetching}
+Data: {$query.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/useIsMutating/BaseExample.svelte b/packages/svelte-query/tests/useIsMutating/BaseExample.svelte
index 7c30b57207..35dafba38c 100644
--- a/packages/svelte-query/tests/useIsMutating/BaseExample.svelte
+++ b/packages/svelte-query/tests/useIsMutating/BaseExample.svelte
@@ -9,9 +9,9 @@
const mutation = createMutation(
{
- mutationKey: ['mutation1'],
+ mutationKey: ['mutation-1'],
mutationFn: async () => {
- await sleep(20)
+ await sleep(5)
return 'data'
},
},
diff --git a/packages/svelte-query/tests/utils.ts b/packages/svelte-query/tests/utils.ts
index e8c5baf88b..1a3a619a22 100644
--- a/packages/svelte-query/tests/utils.ts
+++ b/packages/svelte-query/tests/utils.ts
@@ -3,10 +3,3 @@ export function sleep(timeout: number): Promise {
setTimeout(resolve, timeout)
})
}
-
-let queryKeyCount = 0
-
-export function queryKey(): string {
- queryKeyCount += 1
- return `query_${queryKeyCount}`
-}
From b6d02960b06489f8dad085fef4e70a518e56e9bb Mon Sep 17 00:00:00 2001
From: Lachlan Collins <1667261+lachlancollins@users.noreply.github.com>
Date: Wed, 17 Jul 2024 23:04:32 +1000
Subject: [PATCH 2/2] Improve createQueries tests
---
.../tests/AwaitOnSuccess/Provider.svelte | 3 +-
.../tests/createQueries/BaseExample.svelte | 20 +++--------
.../tests/createQueries/CombineExample.svelte | 32 ++++++++++++++++++
.../tests/createQueries/createQueries.test.ts | 33 +++++--------------
4 files changed, 46 insertions(+), 42 deletions(-)
create mode 100644 packages/svelte-query/tests/createQueries/CombineExample.svelte
diff --git a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte
index e94ef3616a..c3087ac2fa 100644
--- a/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte
+++ b/packages/svelte-query-persist-client/tests/AwaitOnSuccess/Provider.svelte
@@ -7,11 +7,10 @@
export let queryClient: QueryClient
export let persistOptions: OmitKeyof
- export let key: Array
export let onSuccess: () => Promise
export let states: Writable>
-
+
diff --git a/packages/svelte-query/tests/createQueries/BaseExample.svelte b/packages/svelte-query/tests/createQueries/BaseExample.svelte
index 6401f34b10..7f285fbb18 100644
--- a/packages/svelte-query/tests/createQueries/BaseExample.svelte
+++ b/packages/svelte-query/tests/createQueries/BaseExample.svelte
@@ -1,27 +1,17 @@
-{#if Array.isArray($queries)}
- {#each $queries as query, index}
- {#if query.isPending}
- Loading {index + 1}
- {:else if query.isSuccess}
- {query.data}
- {/if}
- {/each}
-{:else if $queries.isPending}
- Loading
-{:else if $queries.isSuccess}
- {$queries.data}
-{/if}
+{#each $queries as query, index}
+ Status {index + 1}: {query.status}
+ Data {index + 1}: {query.data}
+{/each}
diff --git a/packages/svelte-query/tests/createQueries/CombineExample.svelte b/packages/svelte-query/tests/createQueries/CombineExample.svelte
new file mode 100644
index 0000000000..a37b266db1
--- /dev/null
+++ b/packages/svelte-query/tests/createQueries/CombineExample.svelte
@@ -0,0 +1,32 @@
+
+
+isPending: {$queries.isPending}
+Data: {$queries.data ?? 'undefined'}
diff --git a/packages/svelte-query/tests/createQueries/createQueries.test.ts b/packages/svelte-query/tests/createQueries/createQueries.test.ts
index 8e07306210..91a6f8da3b 100644
--- a/packages/svelte-query/tests/createQueries/createQueries.test.ts
+++ b/packages/svelte-query/tests/createQueries/createQueries.test.ts
@@ -3,6 +3,7 @@ import { render, waitFor } from '@testing-library/svelte'
import { QueryClient } from '@tanstack/query-core'
import { sleep } from '../utils'
import BaseExample from './BaseExample.svelte'
+import CombineExample from './CombineExample.svelte'
describe('createQueries', () => {
test('Render and wait for success', async () => {
@@ -31,47 +32,29 @@ describe('createQueries', () => {
})
await waitFor(() => {
- expect(rendered.getByText('Loading 1')).toBeInTheDocument()
- expect(rendered.getByText('Loading 2')).toBeInTheDocument()
+ expect(rendered.getByText('Status 1: pending')).toBeInTheDocument()
+ expect(rendered.getByText('Status 2: pending')).toBeInTheDocument()
})
await waitFor(() => {
- expect(rendered.getByText('Success 1')).toBeInTheDocument()
- expect(rendered.getByText('Success 2')).toBeInTheDocument()
+ expect(rendered.getByText('Status 1: success')).toBeInTheDocument()
+ expect(rendered.getByText('Status 2: success')).toBeInTheDocument()
})
})
test('Combine queries', async () => {
- const ids = [1, 2, 3]
-
- const rendered = render(BaseExample, {
+ const rendered = render(CombineExample, {
props: {
- options: {
- queries: ids.map((id) => ({
- queryKey: [id],
- queryFn: async () => {
- await sleep(5)
- return id
- },
- })),
- combine: (results) => {
- return {
- isPending: results.some((result) => result.isPending),
- isSuccess: results.every((result) => result.isSuccess),
- data: results.map((res) => res.data).join(','),
- }
- },
- },
queryClient: new QueryClient(),
},
})
await waitFor(() => {
- expect(rendered.getByText('Loading')).toBeInTheDocument()
+ expect(rendered.getByText('isPending: true')).toBeInTheDocument()
})
await waitFor(() => {
- expect(rendered.getByText('1,2,3')).toBeInTheDocument()
+ expect(rendered.getByText('Data: 1,2,3')).toBeInTheDocument()
})
})
})