From f29d486da0627656f84ecc6ad18c04fcdf67f129 Mon Sep 17 00:00:00 2001
From: Alina Beck <alina.beck@mail.com>
Date: Mon, 3 Feb 2020 20:10:44 +0100
Subject: [PATCH] replace ds-card in CommentForm

---
 webapp/components/CommentCard/CommentCard.spec.js |  4 ++--
 webapp/components/CommentCard/CommentCard.vue     |  2 +-
 webapp/components/CommentForm/CommentForm.vue     | 10 ++++++----
 webapp/components/CommentList/CommentList.spec.js |  4 ++--
 webapp/pages/post/_id/_slug/index.vue             |  6 +-----
 5 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/webapp/components/CommentCard/CommentCard.spec.js b/webapp/components/CommentCard/CommentCard.spec.js
index 721120070..b18ab67c0 100644
--- a/webapp/components/CommentCard/CommentCard.spec.js
+++ b/webapp/components/CommentCard/CommentCard.spec.js
@@ -1,4 +1,4 @@
-import { config, shallowMount } from '@vue/test-utils'
+import { config, mount } from '@vue/test-utils'
 import CommentCard from './CommentCard.vue'
 import Vuex from 'vuex'
 
@@ -62,7 +62,7 @@ describe('CommentCard.vue', () => {
       const store = new Vuex.Store({
         getters,
       })
-      return shallowMount(CommentCard, {
+      return mount(CommentCard, {
         store,
         propsData,
         mocks,
diff --git a/webapp/components/CommentCard/CommentCard.vue b/webapp/components/CommentCard/CommentCard.vue
index e71ef29cc..573d1417b 100644
--- a/webapp/components/CommentCard/CommentCard.vue
+++ b/webapp/components/CommentCard/CommentCard.vue
@@ -46,7 +46,7 @@
       circle
       size="small"
       v-scroll-to="'.editor'"
-      @click.prevent="reply"
+      @click="reply"
     />
   </base-card>
 </template>
diff --git a/webapp/components/CommentForm/CommentForm.vue b/webapp/components/CommentForm/CommentForm.vue
index e0fe94b39..422530259 100644
--- a/webapp/components/CommentForm/CommentForm.vue
+++ b/webapp/components/CommentForm/CommentForm.vue
@@ -1,8 +1,7 @@
 <template>
   <ds-form v-model="form" @submit="handleSubmit" class="comment-form">
     <template slot-scope="{ errors }">
-      <ds-card>
-        <!-- with client-only the content is not shown -->
+      <base-card>
         <hc-editor ref="editor" :users="users" :value="form.content" @input="updateEditorContent" />
         <div class="buttons">
           <base-button
@@ -17,7 +16,7 @@
             {{ $t('post.comment.submit') }}
           </base-button>
         </div>
-      </ds-card>
+      </base-card>
     </template>
   </ds-form>
 </template>
@@ -146,10 +145,13 @@ export default {
 
 <style lang="scss">
 .comment-form {
+  .editor {
+    margin-bottom: $space-small;
+  }
+
   .buttons {
     display: flex;
     justify-content: flex-end;
-    margin: $space-small 0;
 
     > .base-button {
       margin-left: $space-x-small;
diff --git a/webapp/components/CommentList/CommentList.spec.js b/webapp/components/CommentList/CommentList.spec.js
index c1c222d21..a3d7ca7b2 100644
--- a/webapp/components/CommentList/CommentList.spec.js
+++ b/webapp/components/CommentList/CommentList.spec.js
@@ -1,6 +1,6 @@
 import { config, mount } from '@vue/test-utils'
 import CommentList from './CommentList'
-import Comment from '~/components/Comment/Comment'
+import CommentCard from '~/components/CommentCard/CommentCard'
 import Vuex from 'vuex'
 import Vue from 'vue'
 
@@ -107,7 +107,7 @@ describe('CommentList.vue', () => {
       })
 
       it('Comment emitted reply()', () => {
-        wrapper.find(Comment).vm.$emit('reply', {
+        wrapper.find(CommentCard).vm.$emit('reply', {
           id: 'commentAuthorId',
           slug: 'ogerly',
         })
diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue
index 4d174fd97..d3ed9e1e1 100644
--- a/webapp/pages/post/_id/_slug/index.vue
+++ b/webapp/pages/post/_id/_slug/index.vue
@@ -84,11 +84,7 @@
       </ds-space>
       <!-- Comments -->
       <ds-section slot="footer">
-        <comment-list
-          :post="post"
-          @toggleNewCommentForm="toggleNewCommentForm"
-          @reply="reply"
-        />
+        <comment-list :post="post" @toggleNewCommentForm="toggleNewCommentForm" @reply="reply" />
         <ds-space margin-bottom="large" />
         <comment-form
           v-if="showNewCommentForm && !post.author.blocked"