@@ -1267,117 +1267,100 @@ describe('createQuery', () => {
12671267 } ) ,
12681268 )
12691269
1270- it . todo (
1271- 'should be able to set different stale times for a query' ,
1272- async ( ) => {
1273- /**
1274- * TODO: There's a super weird bug with this test, and I think it's caused by a race condition in query-core.
1275- *
1276- * If you add this to the top `updateResult` in `packages/query-core/src/queryObserver.ts:647`:
1277- * ```
1278- * for (let i = 0; i < 10_000_000; i++) {
1279- * continue
1280- * }
1281- * ```
1282- *
1283- * This test will miraculously start to pass. I'm suspicious that there's some race condition between props
1284- * being tracked and `updateResult` being called, but that _should_ be fixed by `notifyOnChangeProps: 'all'`,
1285- * and that's not doing anything.
1286- *
1287- * This test will also start to magically pass if you put `$inspect(firstQuery)` before `vi.waitFor` near
1288- * the end of the test.
1289- */
1270+ it ( 'should be able to set different stale times for a query' , async ( ) => {
1271+ const key = [ 'test-key' ]
1272+ const states1 : Array < CreateQueryResult < string > > = [ ]
1273+ const states2 : Array < CreateQueryResult < string > > = [ ]
12901274
1291- const key = [ 'test-key' ]
1292- const states1 : Array < CreateQueryResult < string > > = [ ]
1293- const states2 : Array < CreateQueryResult < string > > = [ ]
1275+ // Prefetch the query
1276+ const prefetchPromise = queryClient . prefetchQuery ( {
1277+ queryKey : key ,
1278+ queryFn : async ( ) => {
1279+ await sleep ( 10 )
1280+ return 'prefetch'
1281+ } ,
1282+ } )
1283+ await vi . advanceTimersByTimeAsync ( 10 )
1284+ await prefetchPromise
12941285
1295- // Prefetch the query
1296- await queryClient . prefetchQuery ( {
1297- queryKey : key ,
1298- queryFn : async ( ) => {
1299- await sleep ( 10 )
1300- return 'prefetch'
1301- } ,
1286+ expect ( queryClient . getQueryState ( key ) ?. data ) . toBe ( 'prefetch' )
1287+ // Advance time so secondQuery (staleTime: 10) sees prefetched data as stale
1288+ await vi . advanceTimersByTimeAsync ( 10 )
1289+
1290+ await withEffectRoot ( async ( ) => {
1291+ const firstQuery = createQuery < string > (
1292+ ( ) => ( {
1293+ queryKey : key ,
1294+ queryFn : ( ) => Promise . resolve ( 'one' ) ,
1295+ staleTime : 100 ,
1296+ } ) ,
1297+ ( ) => queryClient ,
1298+ )
1299+
1300+ $effect ( ( ) => {
1301+ states1 . push ( { ...firstQuery } )
13021302 } )
13031303
1304- await vi . advanceTimersByTimeAsync ( 10 )
1305- expect ( queryClient . getQueryState ( key ) ?. data ) . toBe ( 'prefetch' )
1306-
1307- await withEffectRoot ( async ( ) => {
1308- const firstQuery = createQuery < string > (
1309- ( ) => ( {
1310- queryKey : key ,
1311- queryFn : ( ) => Promise . resolve ( 'one' ) ,
1312- staleTime : 100 ,
1313- } ) ,
1314- ( ) => queryClient ,
1315- )
1316-
1317- $effect ( ( ) => {
1318- states1 . push ( { ...firstQuery } )
1319- } )
1320-
1321- const secondQuery = createQuery < string > (
1322- ( ) => ( {
1323- queryKey : key ,
1324- queryFn : ( ) => Promise . resolve ( 'two' ) ,
1325- staleTime : 10 ,
1326- } ) ,
1327- ( ) => queryClient ,
1328- )
1329-
1330- $effect ( ( ) => {
1331- states2 . push ( { ...secondQuery } )
1332- } )
1333-
1334- await vi . advanceTimersByTimeAsync ( 101 )
1335- expect ( firstQuery ) . toMatchObject ( { data : 'two' , isStale : true } )
1336- expect ( secondQuery ) . toMatchObject ( { data : 'two' , isStale : true } )
1337-
1338- expect ( states1 ) . toMatchObject ( [
1339- // First render
1340- {
1341- data : 'prefetch' ,
1342- isStale : false ,
1343- } ,
1344- // Second createQuery started fetching
1345- {
1346- data : 'prefetch' ,
1347- isStale : false ,
1348- } ,
1349- // Second createQuery data came in
1350- {
1351- data : 'two' ,
1352- isStale : false ,
1353- } ,
1354- // Data became stale after 100ms
1355- {
1356- data : 'two' ,
1357- isStale : true ,
1358- } ,
1359- ] )
1304+ const secondQuery = createQuery < string > (
1305+ ( ) => ( {
1306+ queryKey : key ,
1307+ queryFn : ( ) => Promise . resolve ( 'two' ) ,
1308+ staleTime : 10 ,
1309+ } ) ,
1310+ ( ) => queryClient ,
1311+ )
13601312
1361- expect ( states2 ) . toMatchObject ( [
1362- // First render, data is stale and starts fetching
1363- {
1364- data : 'prefetch' ,
1365- isStale : true ,
1366- } ,
1367- // Second createQuery data came in
1368- {
1369- data : 'two' ,
1370- isStale : false ,
1371- } ,
1372- // Data became stale after 10ms
1373- {
1374- data : 'two' ,
1375- isStale : true ,
1376- } ,
1377- ] )
1378- } ) ( )
1379- } ,
1380- )
1313+ $effect ( ( ) => {
1314+ states2 . push ( { ...secondQuery } )
1315+ } )
1316+
1317+ // Wait for both staleTime to expire (100ms for firstQuery)
1318+ await vi . advanceTimersByTimeAsync ( 101 )
1319+ expect ( firstQuery ) . toMatchObject ( { data : 'two' , isStale : true } )
1320+ expect ( secondQuery ) . toMatchObject ( { data : 'two' , isStale : true } )
1321+
1322+ expect ( states1 ) . toMatchObject ( [
1323+ // First render
1324+ {
1325+ data : 'prefetch' ,
1326+ isStale : false ,
1327+ } ,
1328+ // Second createQuery started fetching
1329+ {
1330+ data : 'prefetch' ,
1331+ isStale : false ,
1332+ } ,
1333+ // Second createQuery data came in
1334+ {
1335+ data : 'two' ,
1336+ isStale : false ,
1337+ } ,
1338+ // Data became stale after 100ms
1339+ {
1340+ data : 'two' ,
1341+ isStale : true ,
1342+ } ,
1343+ ] )
1344+
1345+ expect ( states2 ) . toMatchObject ( [
1346+ // First render, data is stale and starts fetching
1347+ {
1348+ data : 'prefetch' ,
1349+ isStale : true ,
1350+ } ,
1351+ // Second createQuery data came in
1352+ {
1353+ data : 'two' ,
1354+ isStale : false ,
1355+ } ,
1356+ // Data became stale after 10ms
1357+ {
1358+ data : 'two' ,
1359+ isStale : true ,
1360+ } ,
1361+ ] )
1362+ } ) ( )
1363+ } )
13811364
13821365 it (
13831366 'should re-render when a query becomes stale' ,
0 commit comments