`Await_waterfall` when refreshing query

[henrykrinkle01]

Describe the bug

I have a list of unprocessed items. Once an item has been processed, it's moved to a completed list. Multiple users work on the list at the same time. The list each user sees at any moment may go out of date since some items may have been removed or added by other users. Ideally I would use query.stream for this but it hasn't been implemented yet. Currently I just use a button to refresh the query that the users have to click from time to time.

If the query is refreshed when the data has changed, it works as expected. However, if the query is refreshed but the data remains the same, there will be an await_waterfall warning that I think shouldn't be there.

This simple setup should simulate it:

import { query } from '$app/server';
let data = 1;
export const getData = query(() => {
  if (Math.random() > 0.5) {
    console.log('Data changed');
    data += Math.random();
    return data;
  }
  console.log('Data not changed');
  return data;
});

<script lang="ts">
	import {getData} from './data.remote.js';
	const data = $derived(await getData());
</script>
{data}
<button onclick={()=>getData().refresh()}>Refresh</button>

It only happens if I use the $derived(await...) syntax. Using the await syntax in the template directly doesn't produce the warning but it's currently kind of buggy so I'm avoiding it for now.

Reproduction

https://stackblitz.com/edit/query-refresh-waterfall?file=src%2Froutes%2F%2Bpage.svelte,src%2Froutes%2Fdata.remote.ts

Logs

System Info

svelte@5.45.2
kit@2.49.0

Severity

annoyance

Additional Information

No response

[cam-eo]

As a workaround, you could try derive from the query store instead of the awaited result...if you haven't already and need a workaround

  const q = getData();
  const data = $derived(q.data);