Follow file naming convention

All components should consist of a folder with these three files:
```
README.d
index.vue
spec.js
```

When you import components, omit the `index.vue`. That helps to `git
grep` for component names.

webapp/components/ContributionForm.vue

@@ -49,7 +49,7 @@
 
 <script>
 import gql from 'graphql-tag'
-import HcEditor from '~/components/Editor/Editor.vue'
+import HcEditor from '~/components/Editor'
 
 export default {
   components: {

webapp/components/Editor/Editor.spec.js

@@ -1,14 +0,0 @@
-import { shallowMount } from '@vue/test-utils'
-import Editor from './Editor.vue'
-
-describe('Editor.vue', () => {
-  let wrapper
-
-  beforeEach(() => {
-    wrapper = shallowMount(Editor, {})
-  })
-
-  it('renders', () => {
-    expect(wrapper.is('div')).toBe(true)
-  })
-})

webapp/components/Editor/spec.js

@@ -0,0 +1,44 @@
+import { mount, createLocalVue } from '@vue/test-utils'
+import Editor from './'
+
+import Styleguide from '@human-connection/styleguide'
+
+const localVue = createLocalVue()
+localVue.use(Styleguide)
+
+describe('Editor.vue', () => {
+  let wrapper
+  let propsData
+
+  beforeEach(() => {
+    propsData = {}
+  })
+
+  describe('mount', () => {
+    let Wrapper = () => {
+      return (wrapper = mount(Editor, {
+        propsData,
+        localVue,
+        sync: false,
+        stubs: { transition: false }
+      }))
+    }
+
+    it('renders', () => {
+      expect(Wrapper().is('div')).toBe(true)
+    })
+
+    describe('given a piece of text', () => {
+      beforeEach(() => {
+        propsData.value = 'I am a piece of text'
+      })
+
+      it.skip('renders', () => {
+        wrapper = Wrapper()
+        expect(wrapper.find('.ProseMirror').text()).toContain(
+          'I am a piece of text'
+        )
+      })
+    })
+  })
+})