Add jsonContentType to fetchBaseQuery options (#2403)

* Add `jsonContentType` to `fetchBaseQuery` options * Add a test
reduxjs · Jun 11, 2022 · b0f59fc · b0f59fc
1 parent cdc55e7
commit b0f59fc
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 6 deletions.
diff --git a/packages/toolkit/src/query/fetchBaseQuery.ts b/packages/toolkit/src/query/fetchBaseQuery.ts
@@ -132,6 +132,10 @@ export type FetchBaseQueryArgs = {
    * ```
    */
   isJsonContentType?: (headers: Headers) => boolean
+  /**
+   * Defaults to `application/json`;
+   */
+  jsonContentType?: string
 } & RequestInit
 
 export type FetchBaseQueryMeta = { request: Request; response?: Response }
@@ -171,17 +175,19 @@ export type FetchBaseQueryMeta = { request: Request; response?: Response }
  *
  * @param {(params: Record<string, unknown>) => string} paramsSerializer
  * An optional function that can be used to stringify querystring parameters.
- * 
+ *
  * @param {(headers: Headers) => boolean} isJsonContentType
  * An optional predicate function to determine if `JSON.stringify()` should be called on the `body` arg of `FetchArgs`
- 
+ *
+ * @param {string} jsonContentType Defaults to `application/json`. Used when automatically setting the content-type header for a request with a jsonifiable body that does not have an explicit content-type header.
  */
 export function fetchBaseQuery({
   baseUrl,
   prepareHeaders = (x) => x,
   fetchFn = defaultFetchFn,
   paramsSerializer,
   isJsonContentType = defaultIsJsonContentType,
+  jsonContentType = 'application/json',
   ...baseFetchOptions
 }: FetchBaseQueryArgs = {}): BaseQueryFn<
   string | FetchArgs,
@@ -229,7 +235,7 @@ export function fetchBaseQuery({
         typeof body.toJSON === 'function')
 
     if (!config.headers.has('content-type') && isJsonifiable(body)) {
-      config.headers.set('content-type', 'application/json')
+      config.headers.set('content-type', jsonContentType)
     }
 
     if (body && isJsonContentType(config.headers)) {

diff --git a/packages/toolkit/src/query/tests/fetchBaseQuery.test.tsx b/packages/toolkit/src/query/tests/fetchBaseQuery.test.tsx
@@ -292,6 +292,27 @@ describe('fetchBaseQuery', () => {
       expect(request.headers['content-type']).toBe('text/html')
       expect(request.body).toEqual(data.join(','))
     })
+
+    it('supports a custom jsonContentType', async () => {
+      const baseQuery = fetchBaseQuery({
+        baseUrl,
+        fetchFn: fetchFn as any,
+        jsonContentType: 'application/vnd.api+json',
+      })
+
+      let request: any
+      ;({ data: request } = await baseQuery(
+        {
+          url: '/echo',
+          body: {},
+          method: 'POST',
+        },
+        commonBaseQueryApi,
+        {}
+      ))
+
+      expect(request.headers['content-type']).toBe('application/vnd.api+json')
+    })
   })
 
   describe('arg.params', () => {
@@ -408,9 +429,11 @@ describe('fetchBaseQuery', () => {
         baseUrl,
         fetchFn: fetchFn as any,
         isJsonContentType: (headers) =>
-          ['application/vnd.api+json', 'application/json', 'application/vnd.hal+json'].includes(
-            headers.get('content-type') ?? ''
-          ),
+          [
+            'application/vnd.api+json',
+            'application/json',
+            'application/vnd.hal+json',
+          ].includes(headers.get('content-type') ?? ''),
       })
 
       let request: any