fix: bug where formData in the js fetch target wasn't applied

src/targets/javascript/fetch.js

@@ -10,6 +10,7 @@
 
 'use strict'
 
+var stringifyObject = require('stringify-object')
 var CodeBuilder = require('../../helpers/code-builder')
 
 module.exports = function (source, options) {
@@ -24,8 +25,11 @@ module.exports = function (source, options) {
   var code = new CodeBuilder(opts.indent)
 
   options = {
-    method: source.method,
-    headers: source.allHeaders
+    method: source.method
+  }
+
+  if (Object.keys(source.allHeaders).length) {
+    options.headers = source.allHeaders
   }
 
   if (opts.credentials !== null) {
@@ -63,14 +67,17 @@ module.exports = function (source, options) {
       }
   }
 
-  code
-    .push(`fetch("${source.fullUrl}", ${JSON.stringify(options, null, opts.indent)})`)
-    .push('.then(response => {')
-    .push(1, 'console.log(response);')
-    .push('})')
-    .push('.catch(err => {')
-    .push(1, 'console.error(err);')
-    .push('});')
+  code.push('const options = %s;', stringifyObject(options, {indent: opts.indent, inlineCharacterLimit: 80}))
+    .blank()
+
+  if (source.postData.mimeType === 'multipart/form-data') {
+    code.push('options.body = form;')
+      .blank()
+  }
+
+  code.push("fetch('%s', options)", source.fullUrl)
+    .push(1, '.then(response => console.log(response))')
+    .push(1, '.catch(err => console.error(err));')
 
   return code.join()
 }

test/fixtures/output/javascript/fetch/application-form-encoded.js

@@ -1,16 +1,9 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "application/x-www-form-urlencoded"
-  },
-  "body": {
-    "foo": "bar",
-    "hello": "world"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'application/x-www-form-urlencoded'},
+  body: {foo: 'bar', hello: 'world'}
+};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/application-json.js

@@ -1,13 +1,9 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "application/json"
-  },
-  "body": "{\"number\":1,\"string\":\"f\\\"oo\",\"arr\":[1,2,3],\"nested\":{\"a\":\"b\"},\"arr_mix\":[1,\"a\",{\"arr_mix_nested\":{}}],\"boolean\":false}"
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'application/json'},
+  body: '{"number":1,"string":"f\"oo","arr":[1,2,3],"nested":{"a":"b"},"arr_mix":[1,"a",{"arr_mix_nested":{}}],"boolean":false}'
+};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/cookies.js

@@ -1,12 +1,5 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "cookie": "foo=bar; bar=baz"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'POST', headers: {cookie: 'foo=bar; bar=baz'}};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/custom-method.js

@@ -1,10 +1,5 @@
-fetch("http://mockbin.com/har", {
-  "method": "PROPFIND",
-  "headers": {}
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'PROPFIND'};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/full.js

@@ -1,17 +1,13 @@
-fetch("http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value", {
-  "method": "POST",
-  "headers": {
-    "cookie": "foo=bar; bar=baz",
-    "accept": "application/json",
-    "content-type": "application/x-www-form-urlencoded"
+const options = {
+  method: 'POST',
+  headers: {
+    cookie: 'foo=bar; bar=baz',
+    accept: 'application/json',
+    'content-type': 'application/x-www-form-urlencoded'
   },
-  "body": {
-    "foo": "bar"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+  body: {foo: 'bar'}
+};
+
+fetch('http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/headers.js

@@ -1,13 +1,5 @@
-fetch("http://mockbin.com/har", {
-  "method": "GET",
-  "headers": {
-    "accept": "application/json",
-    "x-foo": "Bar"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'GET', headers: {accept: 'application/json', 'x-foo': 'Bar'}};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/https.js

@@ -1,10 +1,5 @@
-fetch("https://mockbin.com/har", {
-  "method": "GET",
-  "headers": {}
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'GET'};
+
+fetch('https://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/jsonObj-multiline.js

@@ -1,13 +1,9 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "application/json"
-  },
-  "body": "{\"foo\":\"bar\"}"
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'application/json'},
+  body: '{"foo":"bar"}'
+};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/jsonObj-null-value.js

@@ -1,13 +1,9 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "application/json"
-  },
-  "body": "{\"foo\":null}"
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'application/json'},
+  body: '{"foo":null}'
+};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

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

@@ -1,15 +1,13 @@
 const form = new FormData();
 form.append("foo", "Hello World");
 
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "multipart/form-data; boundary=---011000010111000001101001"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
+};
+
+options.body = form;
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

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

@@ -1,15 +1,13 @@
 const form = new FormData();
 form.append("foo", "test/fixtures/files/hello.txt");
 
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "multipart/form-data; boundary=---011000010111000001101001"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'content-type': 'multipart/form-data; boundary=---011000010111000001101001'}
+};
+
+options.body = form;
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

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

@@ -1,15 +1,13 @@
 const form = new FormData();
 form.append("foo", "bar");
 
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "Content-Type": "multipart/form-data; boundary=---011000010111000001101001"
-  }
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {
+  method: 'POST',
+  headers: {'Content-Type': 'multipart/form-data; boundary=---011000010111000001101001'}
+};
+
+options.body = form;
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/query.js

@@ -1,10 +1,5 @@
-fetch("http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value", {
-  "method": "GET",
-  "headers": {}
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'GET'};
+
+fetch('http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/short.js

@@ -1,10 +1,5 @@
-fetch("http://mockbin.com/har", {
-  "method": "GET",
-  "headers": {}
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'GET'};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));

test/fixtures/output/javascript/fetch/text-plain.js

@@ -1,13 +1,5 @@
-fetch("http://mockbin.com/har", {
-  "method": "POST",
-  "headers": {
-    "content-type": "text/plain"
-  },
-  "body": "Hello World"
-})
-.then(response => {
-  console.log(response);
-})
-.catch(err => {
-  console.error(err);
-});
+const options = {method: 'POST', headers: {'content-type': 'text/plain'}, body: 'Hello World'};
+
+fetch('http://mockbin.com/har', options)
+  .then(response => console.log(response))
+  .catch(err => console.error(err));