Failure to deduplicate network requests about query HOT 12 CLOSED

I'm not sure what you mean, so PR is welcome.

from query.

Hi, thanks for your response.

Basically, I am seeing multiple canceled network requests in the network tab of chrome when using a query in multiple places at the same time. (see stackblitz).

I am not 100% sure what the expected behavior should be. But I think it shouldn't happen that there are multiple concurrent network requests for a single query.

I am willing to create to try to fix this, but I prefer to both agree first that this is in fact a bug.

from query.

Multiple queries with the same key should produce one request.

from query.

The queries in my example have the same key, but produce multiple requests,

So I guess seeing multiple canceled network requests is an error.
But perhaps thee is something wrong with my example code.

from query.

Can you reproduce on stackblitz, please?

from query.

Ah I mixed up code sandbox and stackblitz.

I have reproduced on stackblitz (https://stackblitz.com/~/github.com/roel-de-jong-iqvia/request_deduplication)

The canceled network requests appear the second time you press the "invalidate" button.

from query.

it doesn't load

from query.

Works in my browser.

Press the "invalidate query" button.

Second time you press the button there are multiple canceled requests

(Perhaps it wasn't working at first because it requires changes to be pushed to the github repository)

from query.

Seems like the issue is in take(1).

    this.characters$ = this.event.pipe(
      switchMap(() => this.queryService.character$("joehoe"))
    );

This works

from query.

btw why do you use take 1?

from query.

Indeed, I also noticed this:

When I continuously observe the query, only a single network request is fired.

btw why do you use take 1?

In the minimal reproduction I posted it admittedly does not make a lot of sense.

However, in our project we are migrating from Akita stores to Tanstack Query.

In response to an Akita store change, I need to calculate / derive some state from the Tanstack query data,
Originally, the code which performed the calculation was synchronous. However, fetching of query data is of course by nature asynchronous. To mimic the synchronous nature of the original code, I opted to take only the first emitted value.

I can remove the take 1 and workaround it, but it seems to me having promise-like behavior (where we are only interested in a single value emitted by the query) should work in the sense that no duplicate requests are made.

Without having studied the library code I suspect some query context is lost when all query observers unsubscribe?

from query.

If you only need to get the data once you can use ensureQueryData or getQueryData.

https://tanstack.com/query/latest/docs/reference/QueryClient#queryclientgetquerydata
https://tanstack.com/query/latest/docs/reference/QueryClient#queryclientensurequerydata

from query.