Skip to content

[svelte] "placeholderData: keepPreviousData" doesn't work on reactive queries #5913

Description

@HugeLetters

Describe the bug

placeholderData: keepPreviousData doesn't work correctly with reactive queries. It still shows undefined when changing keys.

Your minimal, reproducible example

https://stackblitz.com/edit/sveltejs-kit-template-default-fcwhut?file=src%2Froutes%2F%2Bpage.svelte

Steps to reproduce

<script lang="ts">
import { createQuery, keepPreviousData } from '@tanstack/svelte-query'; 
// "@tanstack/svelte-query": "5.0.0-beta.20"

let post: string;
$: query = createQuery({
	queryKey: [post],
	queryFn: () => fetch(`https://jsonplaceholder.typicode.com/posts/${post}`).then((x) => x.text()),
	placeholderData: keepPreviousData
});
</script>
<input bind:value={post}/>
<p>{$query.data}</p>

Expected behavior

I expect to see a previous post until a new post is successfully fetched.

How often does this bug happen?

Every time

Screenshots or Videos

2023-08-26.13-42-19.mp4

Platform

  • Windows
  • Google Chrome

Tanstack Query adapter

svelte-query

TanStack Query version

5.0.0-beta.20

TypeScript version

5.2.2

Additional context

Perhaps I'm just using this wrong - I assume query gets recreated on each post update, and also the keys update and that's why svelte-query cant' really understand where to get the previous data from?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions