+
+
+
+
+
+
diff --git a/webapp/components/Upload/spec.js b/webapp/components/Upload/spec.js
new file mode 100644
index 000000000..85215ea59
--- /dev/null
+++ b/webapp/components/Upload/spec.js
@@ -0,0 +1,71 @@
+import { shallowMount, createLocalVue } from '@vue/test-utils'
+import Upload from '.'
+import Vuex from 'vuex'
+import Styleguide from '@human-connection/styleguide'
+
+const localVue = createLocalVue()
+
+localVue.use(Vuex)
+localVue.use(Styleguide)
+
+describe('Upload', () => {
+ let wrapper
+
+ const mocks = {
+ $apollo: {
+ mutate: jest
+ .fn()
+ .mockResolvedValueOnce({
+ data: { UpdateUser: { id: 'upload1', avatar: '/upload/avatar.jpg' } },
+ })
+ .mockRejectedValue({
+ message: 'File upload unsuccessful! Whatcha gonna do?',
+ }),
+ },
+ $toast: {
+ success: jest.fn(),
+ error: jest.fn(),
+ },
+ }
+
+ const propsData = {
+ user: {
+ avatar: '/api/generic.jpg',
+ },
+ }
+
+ const file = {
+ filename: 'avatar.jpg',
+ previewElement: {
+ classList: {
+ remove: jest.fn(),
+ add: jest.fn(),
+ },
+ querySelectorAll: jest.fn().mockReturnValue([
+ {
+ alt: '',
+ style: {
+ 'background-image': '/api/generic.jpg',
+ },
+ },
+ ]),
+ },
+ }
+
+ const dataUrl = 'avatar.jpg'
+
+ beforeEach(() => {
+ jest.useFakeTimers()
+ wrapper = shallowMount(Upload, { localVue, propsData, mocks })
+ })
+
+ 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)
+ })
+})
diff --git a/webapp/components/User/index.vue b/webapp/components/User/index.vue
index 82a08c5e1..fd435d0c5 100644
--- a/webapp/components/User/index.vue
+++ b/webapp/components/User/index.vue
@@ -3,10 +3,7 @@
-
+
-
@@ -143,6 +137,7 @@ import { mapGetters } from 'vuex'
import HcRelativeDateTime from '~/components/RelativeDateTime'
import HcFollowButton from '~/components/FollowButton'
import HcBadges from '~/components/Badges'
+import HcAvatar from '~/components/Avatar/Avatar.vue'
import Dropdown from '~/components/Dropdown'
export default {
@@ -150,6 +145,7 @@ export default {
components: {
HcRelativeDateTime,
HcFollowButton,
+ HcAvatar,
HcBadges,
Dropdown,
},
@@ -183,12 +179,6 @@ export default {