diff --git a/webapp/components/ContentMenu.vue b/webapp/components/ContentMenu.vue
index 5de2820da..29473d6b2 100644
--- a/webapp/components/ContentMenu.vue
+++ b/webapp/components/ContentMenu.vue
@@ -77,6 +77,13 @@ export default {
}).href,
icon: 'edit'
})
+ routes.push({
+ name: this.$t(`post.delete.title`),
+ callback: () => {
+ this.openModal('delete')
+ },
+ icon: 'trash'
+ })
}
if (this.isOwner && this.resourceType === 'comment') {
routes.push({
diff --git a/webapp/components/Modal.vue b/webapp/components/Modal.vue
index 0507e5439..2ea482190 100644
--- a/webapp/components/Modal.vue
+++ b/webapp/components/Modal.vue
@@ -14,19 +14,28 @@
:name="name"
@close="close"
/>
+
+
+
diff --git a/webapp/components/User/index.vue b/webapp/components/User/index.vue
index 857f4f302..240c9dd6d 100644
--- a/webapp/components/User/index.vue
+++ b/webapp/components/User/index.vue
@@ -5,7 +5,7 @@
>
@@ -40,7 +40,7 @@
:image="user.avatar"
:name="userName"
style="display: inline-block; vertical-align: middle;"
- size="32px"
+ size="small"
/>
diff --git a/webapp/components/comments/CommentForm/index.vue b/webapp/components/comments/CommentForm/index.vue
index d59314e07..fedd8a884 100644
--- a/webapp/components/comments/CommentForm/index.vue
+++ b/webapp/components/comments/CommentForm/index.vue
@@ -97,8 +97,8 @@ export default {
})
.then(res => {
this.loading = false
- this.$root.$emit('refetchPostComments', res.data.CreateComment)
- this.$refs.editor.clear()
+ this.$root.$emit('refetchPostComments')
+ this.clear()
this.$toast.success(this.$t('post.comment.submitted'))
this.disabled = false
})
diff --git a/webapp/components/comments/CommentForm/spec.js b/webapp/components/comments/CommentForm/spec.js
new file mode 100644
index 000000000..511f76c1d
--- /dev/null
+++ b/webapp/components/comments/CommentForm/spec.js
@@ -0,0 +1,92 @@
+import { config, mount, createLocalVue, createWrapper } from '@vue/test-utils'
+import CommentForm from './index.vue'
+import Vue from 'vue'
+import Styleguide from '@human-connection/styleguide'
+
+const localVue = createLocalVue()
+
+localVue.use(Styleguide)
+
+config.stubs['no-ssr'] = ''
+
+describe('CommentForm.vue', () => {
+ let mocks
+ let wrapper
+ let propsData
+ let cancelBtn
+ let cancelMethodSpy
+
+ beforeEach(() => {
+ ;(mocks = {
+ $t: jest.fn(),
+ $apollo: {
+ mutate: jest
+ .fn()
+ .mockResolvedValueOnce({
+ data: { CreateComment: { contentExcerpt: 'this is a comment' } }
+ })
+ .mockRejectedValue({ message: 'Ouch!' })
+ },
+ $toast: {
+ error: jest.fn(),
+ success: jest.fn()
+ }
+ }),
+ (propsData = {
+ post: { id: 1 }
+ })
+ })
+
+ describe('mount', () => {
+ const Wrapper = () => {
+ return mount(CommentForm, { mocks, localVue, propsData })
+ }
+
+ beforeEach(() => {
+ wrapper = Wrapper()
+ cancelMethodSpy = jest.spyOn(wrapper.vm, 'clear')
+ })
+
+ it('calls the apollo mutation when form is submitted', async () => {
+ wrapper.vm.updateEditorContent('this is a comment')
+ await wrapper.find('form').trigger('submit')
+ expect(mocks.$apollo.mutate).toHaveBeenCalledTimes(1)
+ })
+
+ it('calls clear method when the cancel button is clicked', () => {
+ wrapper.vm.updateEditorContent('ok')
+ cancelBtn = wrapper.find('.cancelBtn')
+ cancelBtn.trigger('click')
+ expect(cancelMethodSpy).toHaveBeenCalledTimes(1)
+ })
+
+ describe('mutation resolves', () => {
+ beforeEach(async () => {
+ wrapper.vm.updateEditorContent('this is a comment')
+ wrapper.find('form').trigger('submit')
+ })
+
+ it('shows a success toaster', async () => {
+ await mocks.$apollo.mutate
+ expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
+ })
+
+ it('clears the editor', () => {
+ expect(cancelMethodSpy).toHaveBeenCalledTimes(1)
+ })
+
+ it('emits a method call with the returned comment', () => {
+ const rootWrapper = createWrapper(wrapper.vm.$root)
+ expect(rootWrapper.emitted().refetchPostComments.length).toEqual(1)
+ })
+
+ describe('mutation fails', () => {
+ it('shows the error toaster', async () => {
+ await wrapper.find('form').trigger('submit')
+ await mocks.$apollo.mutate
+ expect(mocks.$toast.error).toHaveBeenCalledTimes(1)
+ })
+ })
+ })
+ })
+})
diff --git a/webapp/layouts/default.vue b/webapp/layouts/default.vue
index 64ec4d375..f34b02899 100644
--- a/webapp/layouts/default.vue
+++ b/webapp/layouts/default.vue
@@ -48,7 +48,7 @@
{name}\"?"
+ },
"comment": {
"submit": "Comment",
"submitted": "Comment Submitted"
diff --git a/webapp/locales/es.json b/webapp/locales/es.json
index ba46f9ec1..5beab2eef 100644
--- a/webapp/locales/es.json
+++ b/webapp/locales/es.json
@@ -88,6 +88,14 @@
},
"takeAction": {
"name": "Tomar acción"
+ },
+ "delete": {
+ "submit": "Borrar",
+ "cancel": "Cancelar",
+ "success": "Mensaje borrado satisfactoriamente",
+ "title": "Borrar mensaje",
+ "type": "Mensaje",
+ "message": "¿Realmente quieres borrar el mensaje \"{name}\"?"
}
},
"quotes": {