query: Infinate querying when query fails and using suspense + enabled flag

Describe the bug Using suspense + enabled flag to delay querying, when a query fails will cause infinite querying.

To Reproduce

Core code:

function query() {
  return new Promise((resolve, reject) => {
    console.count("query");
    setTimeout(() => reject("Query Error"), 1000);
  });
}

function DataFetch() {
  const [enabled, setEnabledStatus] = useState(false);
  useQuery("mock", query, { suspense: true, enabled, retry: 0 });

  return <button onClick={() => setEnabledStatus(true)}>Start</button>;
}

Complete code: https://codesandbox.io/s/react-query-bug-suspense-enabled-flag-2w762?file=/src/App.tsx

Steps to reproduce the behavior:

  1. Click the Start Button
  2. Look at Console, you will see many queries.

Expected behavior Throw Error and only query once.

Screenshots image

Desktop (please complete the following information):

  • OS: macOS
  • Browser: chrome
  • Version: 91.0.4472.114

Additional context After removing the enabled or suspense flag, anything works well.

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 8
  • Comments: 21 (4 by maintainers)

Commits related to this issue

Most upvoted comments

πŸŽ‰ This issue has been resolved in version 3.34.3 πŸŽ‰

The release is available on:

Your semantic-release bot πŸ“¦πŸš€

Popping in to say thank you guys so much for resolving this! The fix came just as we had identified this as a prod issue and really saved me a ton of grief : )

but… at that time, condition for preventing infinite query was prevQuery.state.status !== β€˜error’. and now it is not(options.suspense), so I think it would be ok to remove the enabled === false option! πŸ˜ƒ

yeah, could be. I would trust the tests here. If the new test works and the old test still works, too, I’m happy to merge this πŸ˜ƒ

sure, I think we added a test case for the other situation as well so that we don’t break it again. please add the test from this issue as well so that we can see that it passes.

also tagging @JaeYeopHan - maybe he remembers why this condition was added?