diff --git a/webapp/components/Upload/index.vue b/webapp/components/Upload/index.vue
index adeb79857..a1ea4ab55 100644
--- a/webapp/components/Upload/index.vue
+++ b/webapp/components/Upload/index.vue
@@ -8,7 +8,7 @@
:include-styling="false"
:style="backgroundImage"
@vdropzone-thumbnail="thumbnail"
- @vdropzone-drop="vddrop"
+ @vdropzone-error="verror"
/>
@@ -27,10 +27,11 @@ export default {
return {
dropzoneOptions: {
url: this.vddrop,
- maxFilesize: 0.5,
+ maxFilesize: 5.0,
previewTemplate: this.template(),
dictDefaultMessage: '',
},
+ error: false,
}
},
computed: {
@@ -44,6 +45,14 @@ export default {
}
},
},
+ watch: {
+ error() {
+ let that = this
+ setTimeout(function() {
+ that.error = false
+ }, 2000)
+ },
+ },
methods: {
template() {
return `
@@ -89,6 +98,12 @@ export default {
})
.catch(error => this.$toast.error(error.message))
},
+ verror(file, message) {
+ if (file.status === 'error') {
+ this.error = true
+ this.$toast.error(file.status, message)
+ }
+ },
},
}
diff --git a/webapp/components/Upload/spec.js b/webapp/components/Upload/spec.js
index 85215ea59..b81babb6e 100644
--- a/webapp/components/Upload/spec.js
+++ b/webapp/components/Upload/spec.js
@@ -26,6 +26,7 @@ describe('Upload', () => {
success: jest.fn(),
error: jest.fn(),
},
+ $t: jest.fn(),
}
const propsData = {
@@ -34,7 +35,7 @@ describe('Upload', () => {
},
}
- const file = {
+ const fileSuccess = {
filename: 'avatar.jpg',
previewElement: {
classList: {
@@ -59,13 +60,38 @@ describe('Upload', () => {
wrapper = shallowMount(Upload, { localVue, propsData, mocks })
})
+ afterEach(() => {
+ jest.clearAllMocks()
+ })
+
it('sends a the UpdateUser mutation when vddrop is called', () => {
wrapper.vm.vddrop([{ filename: 'avatar.jpg' }])
expect(mocks.$apollo.mutate).toHaveBeenCalledTimes(1)
})
it('thumbnail', () => {
- wrapper.vm.thumbnail(file, dataUrl)
- expect(file.previewElement.classList.add).toHaveBeenCalledTimes(1)
+ wrapper.vm.thumbnail(fileSuccess, dataUrl)
+ expect(fileSuccess.previewElement.classList.add).toHaveBeenCalledTimes(1)
+ })
+
+ describe('error handling', () => {
+ const message = 'File upload failed'
+ const fileError = { status: 'error' }
+
+ it('defaults to error false', () => {
+ expect(wrapper.vm.error).toEqual(false)
+ })
+
+ it('shows an error toaster when verror is called', () => {
+ wrapper.vm.verror(fileError, message)
+ expect(mocks.$toast.error).toHaveBeenCalledWith(fileError.status, message)
+ })
+
+ it('changes error status from false to true to false', () => {
+ wrapper.vm.verror(fileError, message)
+ expect(wrapper.vm.error).toEqual(true)
+ jest.runAllTimers()
+ expect(wrapper.vm.error).toEqual(false)
+ })
})
})