From 7fe101ba9bcb42e335eda3a9f7238d467b207bdd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=81ngel=20Paredes?= <angel.p.barato@gmail.com>
Date: Mon, 11 Mar 2019 22:20:38 +0000
Subject: [PATCH] Fetch JS snippet (#1343)

* Add test for fetch snippet

* Add fetch snippet

* Fix jQuery doc comment
---
 .../src/targets/javascript/fetch.js           | 84 +++++++++++++++++++
 .../src/targets/javascript/index.js           |  1 +
 .../src/targets/javascript/jquery.js          |  2 +-
 .../test/fixtures/available-targets.json      | 12 ++-
 .../fetch/application-form-encoded.js         | 15 ++++
 .../javascript/fetch/application-json.js      | 13 +++
 .../output/javascript/fetch/cookies.js        | 11 +++
 .../output/javascript/fetch/custom-method.js  |  9 ++
 .../fixtures/output/javascript/fetch/full.js  | 16 ++++
 .../output/javascript/fetch/headers.js        | 12 +++
 .../fixtures/output/javascript/fetch/https.js |  9 ++
 .../output/javascript/fetch/multipart-data.js | 12 +++
 .../output/javascript/fetch/multipart-file.js | 12 +++
 .../javascript/fetch/multipart-form-data.js   | 12 +++
 .../fixtures/output/javascript/fetch/query.js |  9 ++
 .../fixtures/output/javascript/fetch/short.js |  9 ++
 .../output/javascript/fetch/text-plain.js     | 12 +++
 .../test/targets/javascript/fetch.js          |  3 +
 18 files changed, 249 insertions(+), 4 deletions(-)
 create mode 100644 packages/insomnia-httpsnippet/src/targets/javascript/fetch.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-form-encoded.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-json.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/cookies.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/custom-method.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/full.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/headers.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/https.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-data.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-file.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-form-data.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/query.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/short.js
 create mode 100755 packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/text-plain.js
 create mode 100644 packages/insomnia-httpsnippet/test/targets/javascript/fetch.js

diff --git a/packages/insomnia-httpsnippet/src/targets/javascript/fetch.js b/packages/insomnia-httpsnippet/src/targets/javascript/fetch.js
new file mode 100644
index 0000000000..102f4bc279
--- /dev/null
+++ b/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',
+};
diff --git a/packages/insomnia-httpsnippet/src/targets/javascript/index.js b/packages/insomnia-httpsnippet/src/targets/javascript/index.js
index 7a97d4c0a1..5a8993b904 100755
--- a/packages/insomnia-httpsnippet/src/targets/javascript/index.js
+++ b/packages/insomnia-httpsnippet/src/targets/javascript/index.js
@@ -9,5 +9,6 @@ module.exports = {
   },
 
   jquery: require('./jquery'),
+  fetch: require('./fetch'),
   xhr: require('./xhr'),
 };
diff --git a/packages/insomnia-httpsnippet/src/targets/javascript/jquery.js b/packages/insomnia-httpsnippet/src/targets/javascript/jquery.js
index 9a4a8b1891..e49978c16c 100755
--- a/packages/insomnia-httpsnippet/src/targets/javascript/jquery.js
+++ b/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
diff --git a/packages/insomnia-httpsnippet/test/fixtures/available-targets.json b/packages/insomnia-httpsnippet/test/fixtures/available-targets.json
index 5d78841dca..0c308b3ec3 100755
--- a/packages/insomnia-httpsnippet/test/fixtures/available-targets.json
+++ b/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",
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-form-encoded.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-form-encoded.js
new file mode 100755
index 0000000000..b8b3f635b9
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-json.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/application-json.js
new file mode 100755
index 0000000000..2e424a3492
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/cookies.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/cookies.js
new file mode 100755
index 0000000000..c04b978ba0
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/custom-method.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/custom-method.js
new file mode 100755
index 0000000000..125d8a76aa
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/full.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/full.js
new file mode 100755
index 0000000000..c3f74c5395
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/headers.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/headers.js
new file mode 100755
index 0000000000..f1bff07205
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/https.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/https.js
new file mode 100755
index 0000000000..f57434fb87
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-data.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-data.js
new file mode 100755
index 0000000000..279dc005d1
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-file.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-file.js
new file mode 100755
index 0000000000..e422f22482
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-form-data.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/multipart-form-data.js
new file mode 100755
index 0000000000..30c4ae687d
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/query.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/query.js
new file mode 100755
index 0000000000..1bb16af44b
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/short.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/short.js
new file mode 100755
index 0000000000..a2bfda4927
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/text-plain.js b/packages/insomnia-httpsnippet/test/fixtures/output/javascript/fetch/text-plain.js
new file mode 100755
index 0000000000..700d947170
--- /dev/null
+++ b/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));
diff --git a/packages/insomnia-httpsnippet/test/targets/javascript/fetch.js b/packages/insomnia-httpsnippet/test/targets/javascript/fetch.js
new file mode 100644
index 0000000000..3dc1cbe56d
--- /dev/null
+++ b/packages/insomnia-httpsnippet/test/targets/javascript/fetch.js
@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = function(snippet, fixtures) {};