Describe the bug
The query gets stuck at fetching status when you try to re-fetch data and it has cycles in it.
Your minimal, reproducible example
https://codesandbox.io/p/sandbox/react-query-mfsz4x
Steps to reproduce
- create a query that returns data with cycles in it
- re-fetch the query
- see that the
fetchStatus gets stuck at fetching
Expected behavior
The query should change the fetchStatus to idle when re-fetch has been finished.
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
- OS: MaxOs
- Browser: Chrome
- Version: 121.0.6167.184 (Official Build) (x86_64)
Tanstack Query adapter
react-query
TanStack Query version
v5.22.2
TypeScript version
No response
Additional context
As far as I understand, when you turn off structuralSharing for the query - the issue will go away.
After some digging, I found that default structuralSharing functionality is to call replaceEqualDeep function. And when there are cycles in the data, this function goes into infinite loop because it recursively calls itself on each data property.
Describe the bug
The query gets stuck at
fetchingstatus when you try to re-fetch data and it has cycles in it.Your minimal, reproducible example
https://codesandbox.io/p/sandbox/react-query-mfsz4x
Steps to reproduce
fetchStatusgets stuck atfetchingExpected behavior
The query should change the
fetchStatustoidlewhen re-fetch has been finished.How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
Tanstack Query adapter
react-query
TanStack Query version
v5.22.2
TypeScript version
No response
Additional context
As far as I understand, when you turn off
structuralSharingfor the query - the issue will go away.After some digging, I found that default
structuralSharingfunctionality is to callreplaceEqualDeepfunction. And when there are cycles in the data, this function goes into infinite loop because it recursively calls itself on each data property.