feat(target) add browser fetch api target (#128)

Fixes #90

Author: darrenjennings

src/targets/javascript/fetch.js

@@ -0,0 +1,83 @@
+/**
+ * @description
+ * HTTP code snippet generator for fetch
+ *
+ * @author
+ * @pmdroid
+ *
+ * for any questions or issues regarding the generated code snippet, please open an issue mentioning the author.
+ */
+
+'use strict'
+
+var CodeBuilder = require('../../helpers/code-builder')
+
+module.exports = function (source, options) {
+  var opts = Object.assign(
+    {
+      indent: '  ',
+      credentials: null
+    },
+    options
+  )
+
+  var code = new CodeBuilder(opts.indent)
+
+  options = {
+    method: source.method,
+    headers: source.allHeaders
+  }
+
+  if (opts.credentials !== null) {
+    options.credentials = opts.credentials
+  }
+
+  switch (source.postData.mimeType) {
+    case 'application/x-www-form-urlencoded':
+      options.body = source.postData.paramsObj
+        ? source.postData.paramsObj
+        : source.postData.text
+      break
+
+    case 'application/json':
+      options.body = source.postData.jsonObj
+      break
+
+    case 'multipart/form-data':
+      code.push('var 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 || '')
+        )
+      })
+
+      code.blank()
+      break
+
+    default:
+      if (source.postData.text) {
+        options.body = source.postData.text
+      }
+  }
+
+  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.log(err);')
+    .push('});')
+
+  return code.join()
+}
+
+module.exports.info = {
+  key: 'fetch',
+  title: 'fetch',
+  link: 'https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch',
+  description: 'Perform asynchronous HTTP requests with the Fetch API'
+}

src/targets/javascript/index.js

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

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",
+        "link": "https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch",
+        "description": "Perform asynchronous HTTP requests with the Fetch API"
+      },
       {
         "key": "xhr",
         "title": "XMLHttpRequest",

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

@@ -0,0 +1,16 @@
+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.log(err);
+});

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

@@ -0,0 +1,32 @@
+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.log(err);
+});

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

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

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

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

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

@@ -0,0 +1,17 @@
+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"
+  },
+  "body": {
+    "foo": "bar"
+  }
+})
+.then(response => {
+  console.log(response);
+})
+.catch(err => {
+  console.log(err);
+});

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

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

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

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