fix: only serialize JSON bodies

src/fetch.ts

@@ -105,16 +105,23 @@ export function createFetch (globalOptions: CreateFetchOptions): $Fetch {
         ctx.request = withQuery(ctx.request, ctx.options.params)
       }
       if (ctx.options.body && isPayloadMethod(ctx.options.method)) {
+        ctx.options.headers = new Headers(ctx.options.headers)
+
+        // Default to application/json for content-type and accept,
+        // when not explicitly set, and the body is JSON serializable.
         if (isJSONSerializable(ctx.options.body)) {
-          ctx.options.body = JSON.stringify(ctx.options.body)
-          ctx.options.headers = new Headers(ctx.options.headers)
           if (!ctx.options.headers.has('content-type')) {
             ctx.options.headers.set('content-type', 'application/json')
           }
           if (!ctx.options.headers.has('accept')) {
             ctx.options.headers.set('accept', 'application/json')
           }
         }
+
+        // Automatically stringify JSON bodies, if not already stringified.
+        if (ctx.options.headers.get('content-type') === 'application/json' && typeof ctx.options.body !== 'string') {
+          ctx.options.body = JSON.stringify(ctx.options.body)
+        }
       }
     }
 

test/index.test.ts

@@ -1,6 +1,6 @@
 import { listen } from 'listhen'
 import { getQuery, joinURL } from 'ufo'
-import { createApp, useBody } from 'h3'
+import { createApp, useBody, useRawBody } from 'h3'
 import { Blob } from 'fetch-blob'
 import { FormData } from 'formdata-polyfill/esm.min.js'
 import { describe, beforeEach, afterEach, it, expect } from 'vitest'
@@ -20,6 +20,7 @@ describe('ohmyfetch', () => {
         res.setHeader('Content-Type', 'application/octet-stream')
         return new Blob(['binary'])
       })
+      .use('/echo', async req => ({ body: await useRawBody(req) }))
     listener = await listen(app)
   })
 
@@ -73,6 +74,12 @@ describe('ohmyfetch', () => {
     }
   })
 
+  it('does not stringify body when content type != application/json', async () => {
+    const msg = '"Hallo von Pascal"'
+    const { body } = await $fetch(getURL('echo'), { method: 'POST', body: msg, headers: { 'Content-Type': 'text/plain' } })
+    expect(body).to.deep.eq(msg)
+  })
+
   it('Bypass FormData body', async () => {
     const data = new FormData()
     data.append('foo', 'bar')