404 NotFound in preload(key, fetcher) causes Uncaught (in promise)

[skanaar]

Bug report

Description / Observed Behavior

Using preload https://swr.vercel.app/blog/swr-v2.en-US#preloading-data

When preloading resources that responds with 404 NotFound I see an Uncaught (in promise) error in the console.

When fetching the same resource with useSWR the rejected promise is correctly handled and does not emit a console error.

My code

const fetcher = (url: string) =>
  fetch(url).then((r) => {
    if (!r.ok) throw new Error(`${r.status} fetching ${url}`)
    return r.json()
  })

preload(urlToMissingResource, fetcher)

The output

Uncaught (in promise) Error: 404 fetching /api/en/products/109029_100.json
  | fetcher | @ | resources.ts:34
  | preload | @ | index.mjs:584

Expected Behavior

SWR preload should handle rejected promises and not let "Uncaught (in promise)" be logged to console.

Repro Steps / Code Example

See this CodeSandbox that reproduces the issue.

Displays both the error logging behaviour of preload and the expected silent behaviour of useSWR

Additional Context

SWR version: 2.1.0

[skanaar]

I think that this could be resolved in one of two ways:

A)
In swr/_internal/utils/preload.ts add error handling to the fetcher call:

try {
  const req = fetcher(key_)
  if (isPromise(req)) req.catch(() => /* do something? */ ) // for async fetchers
  PRELOAD[key] = req
  return req
} catch (e) { // for sync fetchers
  /* do something? */
}

or

B)
Change the return type of preload from any to Data | Promise<Data> which is what preload actually returns if I read the source correctly.

declare const preload: <Data = any>(key_: Key, fetcher: BareFetcher<Data>) => Data | Promise<Data>;

And add documentation that any error handling must be done at the call-site when calling preload