Skip to content

Commit

Permalink
feat: make fetchAdvanced drop-in & make timeout optional (closes #30)
Browse files Browse the repository at this point in the history
  • Loading branch information
Sv443 committed Feb 11, 2024
1 parent 4a58caa commit 5038967
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 14 deletions.
5 changes: 5 additions & 0 deletions .changeset/smooth-suits-cheat.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@sv443-network/userutils": minor
---

`fetchAdvanced` is now a drop-in replacement and timeout can now optionally be disabled
13 changes: 8 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -1059,14 +1059,15 @@ window.addEventListener("resize", debounce((event) => {
### fetchAdvanced()
Usage:
```ts
fetchAdvanced(url: string, options?: {
fetchAdvanced(input: string | Request | URL, options?: {
timeout?: number,
// any other options from fetch() except for signal
}): Promise<Response>
```

A wrapper around the native `fetch()` function that adds options like a timeout property.
The timeout will default to 10 seconds if left undefined.
A drop-in replacement for the native `fetch()` function that adds options like a timeout property.
The timeout will default to 10 seconds if left undefined. Set it to a negative number to disable the timeout.
Note that the `signal` option will be overwritten if passed.

<details><summary><b>Example - click to view</b></summary>

Expand All @@ -1077,10 +1078,12 @@ fetchAdvanced("https://jokeapi.dev/joke/Any?safe-mode", {
timeout: 5000,
// also accepts any other fetch options like headers:
headers: {
"Accept": "application/json",
"Accept": "text/plain",
},
}).then(async (response) => {
console.log("Data:", await response.json());
console.log("Fetch data:", await response.text());
}).catch((err) => {
console.error("Fetch error:", err);
});
```

Expand Down
27 changes: 18 additions & 9 deletions lib/misc.ts
Original file line number Diff line number Diff line change
Expand Up @@ -63,21 +63,30 @@ export function debounce<TFunc extends (...args: TArgs[]) => void, TArgs = any>(
}

/** Options for the `fetchAdvanced()` function */
export type FetchAdvancedOpts = RequestInit & Partial<{
/** Timeout in milliseconds after which the fetch call will be canceled with an AbortController signal */
timeout: number;
}>;
export type FetchAdvancedOpts = Omit<
RequestInit & Partial<{
/** Timeout in milliseconds after which the fetch call will be canceled with an AbortController signal */
timeout: number;
}>,
"signal"
>;

/** Calls the fetch API with special options like a timeout */
export async function fetchAdvanced(url: string, options: FetchAdvancedOpts = {}) {
export async function fetchAdvanced(input: RequestInfo | URL, options: FetchAdvancedOpts = {}) {
const { timeout = 10000 } = options;

const controller = new AbortController();
const id = setTimeout(() => controller.abort(), timeout);
let signalOpts: Partial<RequestInit> = {},
id: NodeJS.Timeout | undefined = undefined;

const res = await fetch(url, {
if(timeout >= 0) {
const controller = new AbortController();
id = setTimeout(() => controller.abort(), timeout);
signalOpts = { signal: controller.signal };
}

const res = await fetch(input, {
...options,
signal: controller.signal,
...signalOpts,
});

clearTimeout(id);
Expand Down

0 comments on commit 5038967

Please sign in to comment.