diff --git a/packages/svelte-query/src/containers.svelte.ts b/packages/svelte-query/src/containers.svelte.ts index 60d27c68431..f1a646efe40 100644 --- a/packages/svelte-query/src/containers.svelte.ts +++ b/packages/svelte-query/src/containers.svelte.ts @@ -88,6 +88,9 @@ export function createRawRef>( const existingKeys = Object.keys(out) const newKeys = Object.keys(newValue) const keysToRemove = existingKeys.filter((key) => !newKeys.includes(key)) + if (Array.isArray(out)) { + keysToRemove.sort((a, b) => Number(b) - Number(a)) + } for (const key of keysToRemove) { // @ts-expect-error delete out[key] diff --git a/packages/svelte-query/tests/containers.svelte.test.ts b/packages/svelte-query/tests/containers.svelte.test.ts index 3511dbb5b5d..fea823c32b7 100644 --- a/packages/svelte-query/tests/containers.svelte.test.ts +++ b/packages/svelte-query/tests/containers.svelte.test.ts @@ -198,6 +198,13 @@ describe('createRawRef', () => { expect(ref).toEqual([7, 8, 9]) }) + it('should handle removing multiple array items in one update', () => { + const [ref, update] = createRawRef([1, 2, 3, 4]) + + update([5, 6]) + expect(ref).toEqual([5, 6]) + }) + it('should behave like a regular object when not using `update`', () => { const [ref] = createRawRef>({ a: 1, b: 2 }) diff --git a/packages/svelte-query/tests/createQueries.svelte.test.ts b/packages/svelte-query/tests/createQueries.svelte.test.ts index c648942483c..83921f0eebd 100644 --- a/packages/svelte-query/tests/createQueries.svelte.test.ts +++ b/packages/svelte-query/tests/createQueries.svelte.test.ts @@ -1,6 +1,6 @@ import { afterEach, describe, expect, expectTypeOf, it, vi } from 'vitest' import { QueryClient, createQueries } from '../src/index.js' -import { promiseWithResolvers, withEffectRoot } from './utils.svelte.js' +import { promiseWithResolvers, ref, withEffectRoot } from './utils.svelte.js' import type { CreateQueryOptions, CreateQueryResult, @@ -63,6 +63,34 @@ describe('createQueries', () => { }), ) + it( + 'should support removing multiple queries in one update', + withEffectRoot(async () => { + const queryIds = ref([1, 2, 3, 4]) + + const result = createQueries( + () => ({ + queries: queryIds.value.map((id) => ({ + queryKey: ['multi-remove', id] as const, + queryFn: () => Promise.resolve(id), + })), + }), + () => queryClient, + ) + + await vi.waitFor(() => + expect(result.map((query) => query.data)).toEqual([1, 2, 3, 4]), + ) + + queryIds.value = [1, 2] + + await vi.waitFor(() => expect(result).toHaveLength(2)) + await vi.waitFor(() => + expect(result.map((query) => query.data)).toEqual([1, 2]), + ) + }), + ) + it( 'handles type parameter - tuple of tuples', withEffectRoot(() => {