fix: multipart/form-data header issues with node/js fetch targets

src/targets/javascript/fetch.js

@@ -10,7 +10,9 @@
 
 'use strict'
 
+const headerHelpers = require('../../helpers/headers')
 const CodeBuilder = require('../../helpers/code-builder')
+const stringifyObject = require('stringify-object')
 
 module.exports = function (source, options) {
   const opts = Object.assign(
@@ -21,30 +23,39 @@ module.exports = function (source, options) {
     options
   )
 
-  const stringifyObject = require('stringify-object')
   const code = new CodeBuilder(opts.indent)
 
-  options = {
+  const reqOpts = {
     method: source.method
   }
 
+  // The `form-data` library automatically adds a `Content-Type` header for `multipart/form-data` content and if we
+  // add our own here, data won't be correctly transferred.
+  if (source.postData.mimeType === 'multipart/form-data') {
+    const contentTypeHeader = headerHelpers.getHeaderName(source.allHeaders, 'content-type')
+    if (contentTypeHeader) {
+      // eslint-disable-next-line no-param-reassign
+      delete source.allHeaders[contentTypeHeader]
+    }
+  }
+
   if (Object.keys(source.allHeaders).length) {
-    options.headers = source.allHeaders
+    reqOpts.headers = source.allHeaders
   }
 
   if (opts.credentials !== null) {
-    options.credentials = opts.credentials
+    reqOpts.credentials = opts.credentials
   }
 
   switch (source.postData.mimeType) {
     case 'application/x-www-form-urlencoded':
-      options.body = source.postData.paramsObj
+      reqOpts.body = source.postData.paramsObj
         ? source.postData.paramsObj
         : source.postData.text
       break
 
     case 'application/json':
-      options.body = JSON.stringify(source.postData.jsonObj)
+      reqOpts.body = JSON.stringify(source.postData.jsonObj)
       break
 
     case 'multipart/form-data':
@@ -63,11 +74,11 @@ module.exports = function (source, options) {
 
     default:
       if (source.postData.text) {
-        options.body = source.postData.text
+        reqOpts.body = source.postData.text
       }
   }
 
-  code.push('const options = %s;', stringifyObject(options, {
+  code.push('const options = %s;', stringifyObject(reqOpts, {
     indent: opts.indent,
     inlineCharacterLimit: 80,
     transform: (object, property, originalResult) => {

src/targets/node/fetch.js

@@ -10,6 +10,7 @@
 
 'use strict'
 
+const headerHelpers = require('../../helpers/headers')
 const stringifyObject = require('stringify-object')
 const CodeBuilder = require('../../helpers/code-builder')
 
@@ -27,6 +28,16 @@ module.exports = function (source, options) {
     method: source.method
   }
 
+  // The `form-data` library automatically adds a `Content-Type` header for `multipart/form-data` content and if we
+  // add our own here, data won't be correctly transferred.
+  if (source.postData.mimeType === 'multipart/form-data') {
+    const contentTypeHeader = headerHelpers.getHeaderName(source.headersObj, 'content-type')
+    if (contentTypeHeader) {
+      // eslint-disable-next-line no-param-reassign
+      delete source.headersObj[contentTypeHeader]
+    }
+  }
+
   if (Object.keys(source.headersObj).length) {
     reqOpts.headers = source.headersObj
   }

test/fixtures/output/javascript/fetch/multipart-data.js

@@ -1,10 +1,7 @@
 const form = new FormData();
 form.append("foo", "Hello World");
 
-const options = {
-  method: 'POST',
-  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+const options = {method: 'POST'};
 
 options.body = form;
 

test/fixtures/output/javascript/fetch/multipart-file.js

@@ -1,10 +1,7 @@
 const form = new FormData();
 form.append("foo", "test/fixtures/files/hello.txt");
 
-const options = {
-  method: 'POST',
-  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+const options = {method: 'POST'};
 
 options.body = form;
 

test/fixtures/output/javascript/fetch/multipart-form-data.js

@@ -1,10 +1,7 @@
 const form = new FormData();
 form.append("foo", "bar");
 
-const options = {
-  method: 'POST',
-  headers: {'Content-Type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+const options = {method: 'POST'};
 
 options.body = form;
 

test/fixtures/output/node/fetch/multipart-data.js

@@ -7,10 +7,7 @@ formData.append('foo', fs.createReadStream('hello.txt'));
 
 let url = 'http://mockbin.com/har';
 
-let options = {
-  method: 'POST',
-  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+let options = {method: 'POST'};
 
 options.body = formData;
 

test/fixtures/output/node/fetch/multipart-file.js

@@ -7,10 +7,7 @@ formData.append('foo', fs.createReadStream('test/fixtures/files/hello.txt'));
 
 let url = 'http://mockbin.com/har';
 
-let options = {
-  method: 'POST',
-  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+let options = {method: 'POST'};
 
 options.body = formData;
 

test/fixtures/output/node/fetch/multipart-form-data.js

@@ -6,10 +6,7 @@ formData.append('foo', 'bar');
 
 let url = 'http://mockbin.com/har';
 
-let options = {
-  method: 'POST',
-  headers: {'Content-Type': 'multipart/form-data; boundary=---011000010111000001101001'}
-};
+let options = {method: 'POST'};
 
 options.body = formData;