diff --git a/webapp/components/Comment/Comment.spec.js b/webapp/components/Comment/Comment.spec.js
index b307700d9..ea04d7c5b 100644
--- a/webapp/components/Comment/Comment.spec.js
+++ b/webapp/components/Comment/Comment.spec.js
@@ -1,4 +1,4 @@
-import { config, shallowMount } from '@vue/test-utils'
+import { config, mount } from '@vue/test-utils'
import Comment from './Comment.vue'
import Vuex from 'vuex'
@@ -47,14 +47,14 @@ describe('Comment.vue', () => {
}
})
- describe('shallowMount', () => {
+ describe('mount', () => {
beforeEach(jest.useFakeTimers)
Wrapper = () => {
const store = new Vuex.Store({
getters,
})
- return shallowMount(Comment, {
+ return mount(Comment, {
store,
propsData,
mocks,
@@ -68,6 +68,7 @@ describe('Comment.vue', () => {
id: '2',
contentExcerpt: 'Hello I am a comment content',
content: 'Hello I am comment content',
+ author: { id: 'commentAuthorId', slug: 'ogerly'}
}
})
@@ -199,6 +200,24 @@ describe('Comment.vue', () => {
})
})
})
+
+ describe('click reply button', () => {
+
+ beforeEach(async () => {
+ wrapper = Wrapper()
+ await wrapper.find('.reply-button').trigger('click')
+ })
+ it('emits "reply"', () => {
+ expect(wrapper.emitted('reply')).toEqual([
+ [
+ {
+ id: 'commentAuthorId',
+ slug: 'ogerly'
+ },
+ ],
+ ])
+ })
+ })
})
})
})
diff --git a/webapp/components/Comment/Comment.vue b/webapp/components/Comment/Comment.vue
index b31414449..da205aaee 100644
--- a/webapp/components/Comment/Comment.vue
+++ b/webapp/components/Comment/Comment.vue
@@ -55,11 +55,11 @@
@@ -76,6 +76,7 @@ import HcCommentForm from '~/components/CommentForm/CommentForm'
import CommentMutations from '~/graphql/CommentMutations'
import scrollToAnchor from '~/mixins/scrollToAnchor.js'
+
export default {
mixins: [scrollToAnchor],
data() {
@@ -148,7 +149,7 @@ export default {
},
},
methods: {
- reply(comment) {
+ reply() {
const message = { slug: this.comment.author.slug, id: this.comment.author.id }
this.$emit('reply', message)
},
@@ -204,11 +205,11 @@ export default {
float: right;
}
-.answerbutton {
+.reply-button {
float: right;
top: 0px;
}
-.answerbutton:after {
+.reply-button:after {
clear: both;
}
diff --git a/webapp/components/CommentList/CommentList.spec.js b/webapp/components/CommentList/CommentList.spec.js
index 0c037d2ff..0b4a667a7 100644
--- a/webapp/components/CommentList/CommentList.spec.js
+++ b/webapp/components/CommentList/CommentList.spec.js
@@ -103,4 +103,22 @@ describe('CommentList.vue', () => {
})
})
})
+
+ describe('Comment', () => {
+ beforeEach(() => {
+ wrapper = Wrapper()
+ })
+
+ it('Comment emitted reply()', () => {
+ wrapper.find('.comment-tag').vm.$emit('reply')
+ expect(wrapper.emitted('reply')).toEqual([
+ [
+ {
+ id: 'commentAuthorId',
+ slug: 'ogerly'
+ },
+ ],
+ ])
+ })
+ })
})
diff --git a/webapp/components/CommentList/CommentList.vue b/webapp/components/CommentList/CommentList.vue
index d21f2b407..061210176 100644
--- a/webapp/components/CommentList/CommentList.vue
+++ b/webapp/components/CommentList/CommentList.vue
@@ -17,6 +17,7 @@
@deleteComment="updateCommentList"
@updateComment="updateCommentList"
@toggleNewCommentForm="toggleNewCommentForm"
+ class="comment-tag"
/>
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index a394424cb..de9797596 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -270,7 +270,7 @@
"submit": "Kommentiere",
"submitted": "Kommentar Gesendet",
"updated": "Änderungen gespeichert",
- "answer": "Antworten"
+ "reply": "Antworten"
},
"edited": "bearbeitet"
},
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index e6e3426a7..9226793c1 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -424,7 +424,7 @@
"submit": "Comment",
"submitted": "Comment Submitted",
"updated": "Changes Saved",
- "answer": "Answer"
+ "reply": "Reply"
},
"edited": "edited"
},
diff --git a/webapp/pages/post/_id/_slug/index.spec.js b/webapp/pages/post/_id/_slug/index.spec.js
index db960bb67..d7c234c4c 100644
--- a/webapp/pages/post/_id/_slug/index.spec.js
+++ b/webapp/pages/post/_id/_slug/index.spec.js
@@ -1,16 +1,16 @@
import { config, shallowMount } from '@vue/test-utils'
import PostSlug from './index.vue'
import Vuex from 'vuex'
+import CommentList from '~/components/CommentList/CommentList'
const localVue = global.localVue
-config.stubs['client-only'] = ''
-
describe('PostSlug', () => {
let wrapper
let Wrapper
let store
let mocks
+ let propsData
beforeEach(() => {
store = new Vuex.Store({
@@ -20,6 +20,7 @@ describe('PostSlug', () => {
},
},
})
+ propsData = {}
mocks = {
$t: jest.fn(),
$filters: {
@@ -44,12 +45,14 @@ describe('PostSlug', () => {
}
})
+
describe('shallowMount', () => {
Wrapper = () => {
return shallowMount(PostSlug, {
store,
mocks,
localVue,
+ propsData,
})
}
@@ -92,4 +95,16 @@ describe('PostSlug', () => {
})
})
})
+
+ describe('given a comment', () => {
+ wrapper = Wrapper()
+ const bar = wrapper.find(CommentList)
+ it('hc-comment-list', () => {
+ expect(bar).toBe({"selector": "Component"})
+ })
+
+
+
+ })
})
+