Merge pull request core-api#29 from manosim/multipart-form

lovelydinosaur · web-flow · commit 2086ef4dc715 · 2017-01-18T14:04:02.000Z
Support Multipart Form (Browser only)
diff --git a/lib/transports/http.js b/lib/transports/http.js
@@ -18,6 +18,7 @@ class HTTPTransport {
     this.schemes = ['http', 'https']
     this.csrf = options.csrf
     this.fetch = options.fetch || fetch
+    this.FormData = options.FormData || window.FormData
   }
 
   action (link, decoders, params = {}) {
@@ -71,12 +72,17 @@ class HTTPTransport {
           'Content-Type': 'application/json'
         }
       } else if (link.encoding === 'multipart/form-data') {
-        // FIXME!
+        let form = new this.FormData()
+
+        for (let paramKey in formParams) {
+          form.append(paramKey, formParams[paramKey])
+        }
+        options.body = form
       } else if (link.encoding === 'application/x-www-form-urlencoded') {
-        var formBody = []
-        for (var paramKey in formParams) {
-          var encodedKey = encodeURIComponent(paramKey)
-          var encodedValue = encodeURIComponent(formParams[paramKey])
+        let formBody = []
+        for (let paramKey in formParams) {
+          const encodedKey = encodeURIComponent(paramKey)
+          const encodedValue = encodeURIComponent(formParams[paramKey])
           formBody.push(encodedKey + '=' + encodedValue)
         }
         formBody = formBody.join('&')
diff --git a/tests/__helpers__/utils.js b/tests/__helpers__/utils.js
@@ -1,3 +1,13 @@
+class MockedFormData {
+  constructor () {
+    this.params = []
+  }
+
+  append (key, value) {
+    this.params.push([key, value])
+  }
+}
+
 const mockedFetch = function (responseBody, contentType, statusCode = 200) {
   return (url) => {
     return new Promise((resolve, reject) => {
@@ -36,7 +46,9 @@ const echo = function (url, options = {}) {
     const textPromise = () => {
       return new Promise((resolve, reject) => {
         let result
-        if (body) {
+        if (body instanceof MockedFormData) {
+          result = JSON.stringify({url: url, method: method, headers: headers, form: body.params})
+        } else if (body) {
           result = JSON.stringify({url: url, method: method, headers: headers, body: body})
         } else {
           result = JSON.stringify({url: url, method: method, headers: headers})
@@ -65,6 +77,7 @@ const echo = function (url, options = {}) {
 }
 
 module.exports = {
+  MockedFormData: MockedFormData,
   mockedFetch: mockedFetch,
   echo: echo
 }
diff --git a/tests/transports/http.js b/tests/transports/http.js
@@ -31,13 +31,26 @@ describe('Test the HTTPTransport', function () {
       .then(res => expect(res).toEqual({text: 'Hello, world'}))
   })
 
-  xit('should check the action function of an HTTP transport (multipart/form-data)', function () {
+  it('should check the action function of an HTTP transport (multipart/form-data)', function () {
     const url = 'http://www.example.com/'
-    const link = new document.Link(url, 'get', 'multipart/form-data')
-    const transport = new transports.HTTPTransport(testUtils.mockedFetch('{"text": "Hello, world"}', 'application/json'))
+    const fields = [new document.Field('firstField', true, 'form'), new document.Field('secondField', true, 'form')]
+    const link = new document.Link(url, 'post', 'multipart/form-data', fields)
+    const transport = new transports.HTTPTransport({
+      fetch: testUtils.echo,
+      FormData: testUtils.MockedFormData
+    })
+    const params = {
+      firstField: 'hello',
+      secondField: 'world'
+    }
 
-    return transport.action(link, decoders)
-      .then(res => expect(res).toEqual({text: 'Hello, world'}))
+    return transport.action(link, decoders, params)
+      .then(res => expect(res).toEqual({
+        url: 'http://www.example.com/',
+        method: 'POST',
+        headers: {},
+        form: [['firstField', 'hello'], ['secondField', 'world']]
+      }))
   })
 
   it('should check the action function of an HTTP transport (application/x-www-form-urlencoded)', function () {
