snapshot of https://github.com/TanStack/query.git (main, 2026-09-16; blobs > 131072B omitted)

packages/svelte-query/tests/createMutation/OptimisticUpdate.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+  import type { QueryClient } from '@tanstack/query-core'
+  import { createMutation, setQueryClientContext } from '../../src/index.js'
+  import { sleep } from '@tanstack/query-test-utils'
+
+  type Props = {
+    queryClient: QueryClient
+    queryKey: Array<string>
+    shouldSucceed: boolean
+  }
+
+  const { queryClient, queryKey, shouldSucceed }: Props = $props()
+
+  setQueryClientContext(queryClient)
+
+  const mutation = createMutation(() => ({
+    mutationFn: (newTodo: string) =>
+      shouldSucceed
+        ? sleep(10).then(() => newTodo)
+        : sleep(10).then(() => Promise.reject(new Error('Some error'))),
+    onMutate: async (newTodo: string) => {
+      await queryClient.cancelQueries({ queryKey })
+      const previousTodos = queryClient.getQueryData<Array<string>>(queryKey)
+
+      queryClient.setQueryData<Array<string>>(queryKey, (old) => [
+        ...(old ?? []),
+        newTodo,
+      ])
+
+      return { previousTodos }
+    },
+    onError: (_err, _newTodo, onMutateResult) => {
+      queryClient.setQueryData(queryKey, onMutateResult?.previousTodos)
+    },
+  }))
+</script>
+
+<button onclick={() => mutation.mutate('Todo 2')}>add</button>