Update the fetch options type to include object as a valid body value

Question

Update the fetch options type to include object as a valid body value

In the standard fetch() function, the BodyInit_ type restricts the assignment of objects to the body property.

I am looking to create a custom wrapper for fetch that maintains the same signature as fetch, but allows the second argument (options) to include a body value that can be an object.

How can I override this type restriction?

I have attempted the following:

type BodyInitType = RequestInit['body']
type WrappedRequestInit = Exclude<RequestInit, 'body'> & {
  body: object
}

type WrappedFetch = (url: string, options: WrappedRequestInit) => Promise<Response>

typescript

Answer 1

Answer №1

It's recommended to utilize Omit over Exclude

type ModifiedRequestInit = Omit<RequestInit, "body"> & {
    body:object
}

declare function sendRequest(input: RequestInfo, init: ModifiedRequestInit): Promise<Response>
declare function sendRequest(input: RequestInfo, init: RequestInit): Promise<Response>
declare function sendRequest(input: RequestInfo, init?: ModifiedRequestInit | RequestInit): Promise<Response>

const data = sendRequest('http://example.com', {
    body: {} // valid
})

Answer 2

It's recommended to utilize Omit over Exclude

type ModifiedRequestInit = Omit<RequestInit, "body"> & {
    body:object
}

declare function sendRequest(input: RequestInfo, init: ModifiedRequestInit): Promise<Response>
declare function sendRequest(input: RequestInfo, init: RequestInit): Promise<Response>
declare function sendRequest(input: RequestInfo, init?: ModifiedRequestInit | RequestInit): Promise<Response>

const data = sendRequest('http://example.com', {
    body: {} // valid
})

Update the fetch options type to include object as a valid body value

Answer №1

Similar questions

The program encountered an error with code TS2339, indicating that the property "name" cannot be found on the type "never"

`"Type is invalid" error occurring with component after importing it into a different project``

React, Storybook - Error TS2307: Button module not found or its type declarations. Can Storybook resolve this issue?

Tips for identifying unnecessary async statements in TypeScript code?

Error in NW.js file pattern: The package.json file was not found within the source directory file glob patterns

Determine the amount of time that can be allocated based on the attributes contained within the object

Combining multiple data types in an AJV array

The package import path varies between dynamic code generation and static code generation

Unit testing for Angular service involving a mock Http GET request is essential for ensuring the

The property 'label' is not found in the 'string' type in Typescript

The ordering of my styles and Material-UI styles is causing conflicts and overrides

Type Vue does not contain the specified property

Placing a blank object after every line within a TypeScript array

Developing a versatile table component for integration

Tips on updating the datepicker format to be dd/mm/yyyy in ngbdatepicker

Exploring the features of Typescript involving async/await, Promise, and the use of function

Is there a hashing algorithm that produces identical results in both Dart and TypeScript?

Mastering the art of calculating month differences on TypeScript dates in an Angular environment

Best practices for correctly parsing a date in UTC format using the date-fns library

The functionality of the String prototype is operational in web browsers, but it encounters issues