diff --git a/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte b/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte
new file mode 100644
index 0000000000..00983843d1
--- /dev/null
+++ b/packages/svelte-query/tests/createInfiniteQuery/SelectExample.svelte
@@ -0,0 +1,28 @@
+
+
+
{$query.data?.pages.join(',')}
diff --git a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
index c991da6b58..b05763b279 100644
--- a/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
+++ b/packages/svelte-query/tests/createInfiniteQuery/createInfiniteQuery.test.ts
@@ -2,6 +2,7 @@ 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 SelectExample from './SelectExample.svelte'
import type { Writable } from 'svelte/store'
import type { QueryObserverResult } from '@tanstack/query-core'
@@ -93,4 +94,32 @@ describe('createInfiniteQuery', () => {
fetchStatus: 'idle',
})
})
+
+ test('Select a part of the data', async () => {
+ const statesStore: Writable> = writable([])
+
+ const rendered = render(SelectExample, {
+ props: {
+ states: statesStore,
+ },
+ })
+
+ await waitFor(() => {
+ expect(rendered.queryByText('count: 1')).toBeInTheDocument()
+ })
+
+ const states = get(statesStore)
+
+ expect(states).toHaveLength(2)
+
+ expect(states[0]).toMatchObject({
+ data: undefined,
+ isSuccess: false,
+ })
+
+ expect(states[1]).toMatchObject({
+ data: { pages: ['count: 1'] },
+ isSuccess: true,
+ })
+ })
})
diff --git a/packages/svelte-query/tests/createMutation/BaseExample.svelte b/packages/svelte-query/tests/createMutation/BaseExample.svelte
deleted file mode 100644
index e4bf80d4dd..0000000000
--- a/packages/svelte-query/tests/createMutation/BaseExample.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-
-
-
diff --git a/packages/svelte-query/tests/createMutation/FailureExample.svelte b/packages/svelte-query/tests/createMutation/FailureExample.svelte
new file mode 100644
index 0000000000..52f9c8887f
--- /dev/null
+++ b/packages/svelte-query/tests/createMutation/FailureExample.svelte
@@ -0,0 +1,24 @@
+
+
+
+
+Data: {$mutation.data?.count}
+Status: {$mutation.status}
+Failure Count: {$mutation.failureCount}
+Failure Reason: {$mutation.failureReason}
diff --git a/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte b/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte
new file mode 100644
index 0000000000..7349bf42df
--- /dev/null
+++ b/packages/svelte-query/tests/createMutation/OnSuccessExample.svelte
@@ -0,0 +1,28 @@
+
+
+
+
+Count: {$count}
diff --git a/packages/svelte-query/tests/createMutation/ResetExample.svelte b/packages/svelte-query/tests/createMutation/ResetExample.svelte
new file mode 100644
index 0000000000..f5095d7182
--- /dev/null
+++ b/packages/svelte-query/tests/createMutation/ResetExample.svelte
@@ -0,0 +1,21 @@
+
+
+
+
+
+Error: {$mutation.error?.message}
diff --git a/packages/svelte-query/tests/createMutation/createMutation.test.ts b/packages/svelte-query/tests/createMutation/createMutation.test.ts
index 88414c2651..f309d334b6 100644
--- a/packages/svelte-query/tests/createMutation/createMutation.test.ts
+++ b/packages/svelte-query/tests/createMutation/createMutation.test.ts
@@ -1,23 +1,108 @@
import { describe, expect, test, vi } from 'vitest'
import { fireEvent, render, waitFor } from '@testing-library/svelte'
-import BaseExample from './BaseExample.svelte'
+import { sleep } from '../utils'
+import ResetExample from './ResetExample.svelte'
+import OnSuccessExample from './OnSuccessExample.svelte'
+import FailureExample from './FailureExample.svelte'
describe('createMutation', () => {
- test('Call mutate and check function runs', async () => {
- const mutationFn = vi.fn()
+ test('Able to reset `error`', async () => {
+ const rendered = render(ResetExample)
- const rendered = render(BaseExample, {
+ await waitFor(() => {
+ expect(rendered.queryByText('Error: undefined')).toBeInTheDocument()
+ })
+
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+
+ await waitFor(() => {
+ expect(
+ rendered.queryByText('Error: Expected mock error'),
+ ).toBeInTheDocument()
+ })
+
+ fireEvent.click(rendered.getByRole('button', { name: /Reset/i }))
+
+ await waitFor(() => {
+ expect(rendered.queryByText('Error: undefined')).toBeInTheDocument()
+ })
+ })
+
+ test('Able to call `onSuccess` and `onSettled` after each successful mutate', async () => {
+ const onSuccessMock = vi.fn()
+ const onSettledMock = vi.fn()
+
+ const rendered = render(OnSuccessExample, {
props: {
- options: {
- mutationFn,
- },
+ onSuccessMock,
+ onSettledMock,
},
})
- fireEvent.click(rendered.getByRole('button'))
+ await waitFor(() => {
+ expect(rendered.queryByText('Count: 0')).toBeInTheDocument()
+ })
+
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+
+ await waitFor(() => {
+ expect(rendered.queryByText('Count: 3')).toBeInTheDocument()
+ })
+
+ await waitFor(() => {
+ expect(onSuccessMock).toHaveBeenCalledTimes(3)
+ })
+
+ expect(onSuccessMock).toHaveBeenCalledWith(1)
+ expect(onSuccessMock).toHaveBeenCalledWith(2)
+ expect(onSuccessMock).toHaveBeenCalledWith(3)
await waitFor(() => {
- expect(mutationFn).toHaveBeenCalledTimes(1)
+ expect(onSettledMock).toHaveBeenCalledTimes(3)
+ })
+
+ expect(onSettledMock).toHaveBeenCalledWith(1)
+ expect(onSettledMock).toHaveBeenCalledWith(2)
+ expect(onSettledMock).toHaveBeenCalledWith(3)
+ })
+
+ test('Set correct values for `failureReason` and `failureCount` on multiple mutate calls', async () => {
+ type Value = { count: number }
+
+ const mutationFn = vi.fn<(value: Value) => Promise>()
+
+ mutationFn.mockImplementationOnce(() => {
+ return Promise.reject(`Expected mock error`)
})
+
+ mutationFn.mockImplementation(async (value) => {
+ await sleep(5)
+ return Promise.resolve(value)
+ })
+
+ const rendered = render(FailureExample, {
+ props: {
+ mutationFn,
+ },
+ })
+
+ await waitFor(() => rendered.queryByText('Data: undefined'))
+
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+ await waitFor(() => rendered.getByText('Data: undefined'))
+ await waitFor(() => rendered.getByText('Status: error'))
+ await waitFor(() => rendered.getByText('Failure Count: 1'))
+ await waitFor(() =>
+ rendered.getByText('Failure Reason: Expected mock error'),
+ )
+
+ fireEvent.click(rendered.getByRole('button', { name: /Mutate/i }))
+ await waitFor(() => rendered.getByText('Status: pending'))
+ await waitFor(() => rendered.getByText('Status: success'))
+ await waitFor(() => rendered.getByText('Data: 2'))
+ await waitFor(() => rendered.getByText('Failure Count: 0'))
+ await waitFor(() => rendered.getByText('Failure Reason: null'))
})
})