Merge pull request #237 from gianfurrer/fix/error-handling-ux

Fix/error handling ux

web/package.json

@@ -24,7 +24,7 @@
     "@vue/cli-plugin-eslint": "^4.0.0",
     "@vue/cli-plugin-unit-jest": "~4.2.0",
     "@vue/cli-service": "^4.0.0",
-    "@vue/test-utils": "1.0.0-beta.31",
+    "@vue/test-utils": "^1.3.0",
     "babel-eslint": "^10.0.3",
     "eslint": "^5.16.0",
     "eslint-plugin-vue": "^6.2.2",

web/src/pages/Upload.vue

@@ -23,7 +23,7 @@
 
       <md-field :class="getValidationClass('documentation')">
         <label >Documentation (zip file)</label>
-        <md-file id="documentation" @change="onFileUpload($event)" :disabled="sending" accept="zip,application/octet-stream,application/zip,application/x-zip,application/x-zip-compressed" />
+        <md-file ref="fileInput" id="documentation" @change="onFileUpload($event)" :disabled="sending" accept="zip,application/octet-stream,application/zip,application/x-zip,application/x-zip-compressed" />
         <span class="md-error">The documentation is required</span>
       </md-field>
 
@@ -112,6 +112,8 @@ export default {
       this.$v.$reset()
       this.form.project = null
       this.form.version = null
+      this.form.file = ''
+      this.$refs.fileInput.clearField()
     },
     validateUpload() {
       this.$v.$touch()

web/src/repositories/ProjectRepository.js

@@ -81,12 +81,17 @@ export default {
    * @param {string} body Data to upload
    */
   async upload(projectName, version, body) {
-    await fetch(`${this.baseURL}/api/${projectName}/${version}`,
+    const resp = await fetch(`${this.baseURL}/api/${projectName}/${version}`,
       {
         method: 'POST',
         body
       }
     )
+    const json = await resp.json()
+    if (!resp.ok) {
+      throw new Error(json.message)
+    }
+    return json
   },
 
   /**
@@ -109,12 +114,17 @@ export default {
    */
   async delete_doc(projectName, version, token) {
     const headers = { "Docat-Api-Key": token }
-    await fetch(`${this.baseURL}/api/${projectName}/${version}`,
+    const resp = await fetch(`${this.baseURL}/api/${projectName}/${version}`,
       {
         method: 'DELETE',
         headers: headers
       }
     )
+    const json = await resp.json()
+    if (!resp.ok) {
+      throw new Error(json.message)
+    }
+    return json
   },
 
   /**

web/tests/unit/project-repository.spec.js

@@ -5,10 +5,17 @@ ProjectRepository.baseURL = 'https://do.cat'
 
 const mockFetchData = (fetchData) => {
   global.fetch = jest.fn().mockImplementation(() => Promise.resolve({
+    ok: true,
     json: () => Promise.resolve(fetchData)
   }))
 }
 
+const mockFetchError = (error = "Error") => {
+  global.fetch = jest.fn().mockImplementation(() => Promise.resolve({
+    ok: false,
+    json: () => Promise.resolve({message: error})
+  }))
+}
 
 describe('ProjectRepository', () => {
 
@@ -78,6 +85,16 @@ describe('ProjectRepository', () => {
     )
   })
 
+  it('should throw error when uploading new documentation fails', async () => {
+    const errorMessage = "Failed to upload documentation"
+    mockFetchError(errorMessage)
+
+
+    expect(ProjectRepository.upload('existing-project', '4.0', { data: true })).rejects.toThrow(errorMessage)
+    expect(global.fetch).toHaveBeenCalledTimes(1)
+
+  })
+
   it('should delete an existing documentation', async () => {
     mockFetchData({})
 
@@ -92,6 +109,16 @@ describe('ProjectRepository', () => {
     )
   })
 
+  it('should throw error when deleting existing documentation fails', async () => {
+    const errorMessage = "Failed to delete documentation"
+    mockFetchError(errorMessage)
+
+
+    expect(ProjectRepository.delete_doc('existing-project', '4.0', { data: true })).rejects.toThrow(errorMessage)
+    expect(global.fetch).toHaveBeenCalledTimes(1)
+
+  })
+
   it('should sort doc versions as semantic versions', async () => {
     expect(ProjectRepository.compareVersions('0.0.0', '0.0.1')).toBeLessThan(0);
     expect(ProjectRepository.compareVersions('a', 'b')).toBeLessThan(0);

web/yarn.lock

@@ -1851,10 +1851,10 @@
   resolved "https://registry.yarnpkg.com/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz#ceb924b4ecb3b9c43871c7a429a02f8423e621ab"
   integrity sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ==
 
-"@vue/test-utils@1.0.0-beta.31":
-  version "1.0.0-beta.31"
-  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.31.tgz#580d6e45f07452e497d69807d80986e713949b73"
-  integrity sha512-IlhSx5hyEVnbvDZ3P98R1jNmy88QAd/y66Upn4EcvxSD5D4hwOutl3dIdfmSTSXs4b9DIMDnEVjX7t00cvOnvg==
+"@vue/test-utils@^1.3.0":
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.3.0.tgz#d563decdcd9c68a7bca151d4179a2bfd6d5c3e15"
+  integrity sha512-Xk2Xiyj2k5dFb8eYUKkcN9PzqZSppTlx7LaQWBbdA8tqh3jHr/KHX2/YLhNFc/xwDrgeLybqd+4ZCPJSGPIqeA==
   dependencies:
     dom-event-types "^1.0.0"
     lodash "^4.17.15"