Fetch JS snippet (#1343)

* Add test for fetch snippet

* Add fetch snippet

* Fix jQuery doc comment

packages/insomnia-httpsnippet/src/targets/javascript/fetch.js

@@ -0,0 +1,84 @@
+/**
+ * @description
+ * HTTP code snippet generator for the browser Fetch API
+ *
+ * @author
+ * @peoplenarthax
+ *
+ * for any questions or issues regarding the generated code snippet, please open an issue mentioning the author.
+ */
+
+'use strict';
+
+var util = require('util');
+var CodeBuilder = require('../../helpers/code-builder');
+
+module.exports = function(source, options) {
+  var opts = util._extend(
+    {
+      indent: '  ',
+    },
+    options,
+  );
+
+  var code = new CodeBuilder(opts.indent);
+
+  var url = source.fullUrl;
+  var fetchOptions = {
+    mode: 'cors',
+    method: source.method,
+    headers: source.allHeaders,
+  };
+
+  switch (source.postData.mimeType) {
+    case 'application/x-www-form-urlencoded':
+      fetchOptions.body = source.postData.paramsObj
+        ? source.postData.paramsObj
+        : source.postData.text;
+      break;
+
+    case 'application/json':
+      fetchOptions.body = source.postData.text;
+      break;
+
+    case 'multipart/form-data':
+      code.push('let form = new FormData();');
+
+      source.postData.params.forEach(function(param) {
+        code.push(
+          'form.append(%s, %s);',
+          JSON.stringify(param.name),
+          JSON.stringify(param.value || param.fileName || ''),
+        );
+      });
+      delete fetchOptions.headers;
+      fetchOptions.body = '[form]';
+
+      code.blank();
+      break;
+
+    default:
+      if (source.postData.text) {
+        fetchOptions.data = source.postData.text;
+      }
+  }
+
+  code
+    .push(
+      'const fetchOptions = ' +
+        JSON.stringify(fetchOptions, null, opts.indent).replace('"[form]"', 'form'),
+    )
+    .blank()
+    .push('fetch("' + url + '", fetchOptions)')
+    .push(1, '.then(response => response.json())')
+    .push(1, '.then(data => console.log(data));');
+
+  return code.join();
+};
+
+module.exports.info = {
+  key: 'fetch',
+  title: 'Fetch API',
+  link: 'https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API',
+  description: 'Browser API that offers a simple interface for fetching resources',
+};

packages/insomnia-httpsnippet/src/targets/javascript/index.js

@@ -9,5 +9,6 @@ module.exports = {
   },
 
   jquery: require('./jquery'),
+  fetch: require('./fetch'),
   xhr: require('./xhr'),
 };

packages/insomnia-httpsnippet/src/targets/javascript/jquery.js

@@ -1,6 +1,6 @@
 /**
  * @description
- * HTTP code snippet generator for native XMLHttpRequest
+ * HTTP code snippet generator for jQuery
  *
  * @author
  * @AhmadNassri

packages/insomnia-httpsnippet/test/fixtures/available-targets.json

@@ -63,6 +63,12 @@
         "link": "http://api.jquery.com/jquery.ajax/",
         "description": "Perform an asynchronous HTTP (Ajax) requests with jQuery"
       },
+      {
+        "key": "fetch",
+        "title": "Fetch API",
+        "link": "https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API",
+        "description": "Browser API that offers a simple interface for fetching resources"
+      },
       {
         "key": "xhr",
         "title": "XMLHttpRequest",
@@ -137,7 +143,7 @@
     "extname": ".m",
     "default": "nsurlsession",
     "clients": [
-       {
+      {
         "key": "nsurlsession",
         "title": "NSURLSession",
         "link": "https://developer.apple.com/library/mac/documentation/Foundation/Reference/NSURLSession_class/index.html",
@@ -151,7 +157,7 @@
     "extname": ".swift",
     "default": "nsurlsession",
     "clients": [
-       {
+      {
         "key": "nsurlsession",
         "title": "NSURLSession",
         "link": "https://developer.apple.com/library/mac/documentation/Foundation/Reference/NSURLSession_class/index.html",
@@ -165,7 +171,7 @@
     "extname": ".go",
     "default": "native",
     "clients": [
-       {
+      {
         "key": "native",
         "title": "NewRequest",
         "link": "http://golang.org/pkg/net/http/#NewRequest",

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

@@ -0,0 +1,15 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  headers: {
+    'content-type': 'application/x-www-form-urlencoded',
+  },
+  body: {
+    foo: 'bar',
+    hello: 'world',
+  },
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-json.js

@@ -0,0 +1,13 @@
+const fetchOptions = {
+  mode: 'cors',
+  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', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/cookies.js

@@ -0,0 +1,11 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  headers: {
+    cookie: 'foo=bar; bar=baz',
+  },
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/custom-method.js

@@ -0,0 +1,9 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'PROPFIND',
+  headers: {},
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/full.js

@@ -0,0 +1,16 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  headers: {
+    cookie: 'foo=bar; bar=baz',
+    accept: 'application/json',
+    'content-type': 'application/x-www-form-urlencoded',
+  },
+  body: {
+    foo: 'bar',
+  },
+};
+
+fetch('http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/headers.js

@@ -0,0 +1,12 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'GET',
+  headers: {
+    accept: 'application/json',
+    'x-foo': 'Bar',
+  },
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/https.js

@@ -0,0 +1,9 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'GET',
+  headers: {},
+};
+
+fetch('https://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-data.js

@@ -0,0 +1,12 @@
+let form = new FormData();
+form.append('foo', 'Hello World');
+
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  body: form,
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-file.js

@@ -0,0 +1,12 @@
+let form = new FormData();
+form.append('foo', 'test/fixtures/files/hello.txt');
+
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  body: form,
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

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

@@ -0,0 +1,12 @@
+let form = new FormData();
+form.append('foo', 'bar');
+
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  body: form,
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/query.js

@@ -0,0 +1,9 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'GET',
+  headers: {},
+};
+
+fetch('http://mockbin.com/har?foo=bar&foo=baz&baz=abc&key=value', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/short.js

@@ -0,0 +1,9 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'GET',
+  headers: {},
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/text-plain.js

@@ -0,0 +1,12 @@
+const fetchOptions = {
+  mode: 'cors',
+  method: 'POST',
+  headers: {
+    'content-type': 'text/plain',
+  },
+  data: 'Hello World',
+};
+
+fetch('http://mockbin.com/har', fetchOptions)
+  .then(response => response.json())
+  .then(data => console.log(data));

packages/insomnia-httpsnippet/test/targets/javascript/fetch.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = function(snippet, fixtures) {};