fix(nuxt): respect custom timeout in useFetch

docs/3.api/2.composables/use-fetch.md

@@ -80,6 +80,7 @@ const { data, pending, error, refresh } = await useFetch('/api/auth/login', {
   - `body`: Request body - automatically stringified (if an object is passed).
   - `headers`: Request headers.
   - `baseURL`: Base URL for the request.
+  - `timeout`: Milliseconds to automatically abort request
 
 ::callout
 All fetch options can be given a `computed` or `ref` value. These will be watched and new requests made automatically with any new values if they are updated.

packages/nuxt/src/app/composables/fetch.ts

@@ -140,6 +140,10 @@ export function useFetch<
     controller?.abort?.()
     controller = typeof AbortController !== 'undefined' ? new AbortController() : {} as AbortController
 
+    if(toValue(opts.timeout)){
+      setTimeout(() => controller.abort(), toValue(opts.timeout));
+    }
+
     let _$fetch = opts.$fetch || globalThis.$fetch
 
     // Use fetch with request context and headers for server direct API calls

test/nuxt/composables.test.ts

@@ -266,6 +266,13 @@ describe('useFetch', () => {
     await useFetch('/api/test', { params: { id: ref('3') } }, '')
     expect.soft(getPayloadEntries()).toBe(baseCount + 3)
   })
+
+  it('should timeout', async () => {
+    const { pending, status, error } = await useFetch('https://httpbin.org/delay/10', { timeout: 1 })
+    await pending.value
+    expect(status.value).toBe('error')
+    expect(error.value).toMatchInlineSnapshot('[Error: [GET] "https://httpbin.org/delay/10": <no response> The operation was aborted.]')
+  })
 })
 
 describe('errors', () => {