diff --git a/webapp/components/Badges.vue b/webapp/components/Badges.vue
index d0cb30e91..b28412abe 100644
--- a/webapp/components/Badges.vue
+++ b/webapp/components/Badges.vue
@@ -10,17 +10,21 @@
:key="badge.key"
class="hc-badge-container"
>
-
+ />
diff --git a/webapp/components/Image/spec.js b/webapp/components/Image/spec.js
new file mode 100644
index 000000000..cbc4d34cf
--- /dev/null
+++ b/webapp/components/Image/spec.js
@@ -0,0 +1,43 @@
+import { shallowMount } from '@vue/test-utils'
+import Image from '.'
+
+describe('Image', () => {
+ let propsData = { imageProps: { class: 'hc-badge', src: '' } }
+
+ const Wrapper = () => {
+ return shallowMount(Image, { propsData })
+ }
+
+ it('renders', () => {
+ expect(Wrapper().is('img')).toBe(true)
+ })
+
+ it('passes properties down to `img`', () => {
+ expect(Wrapper().classes()).toEqual(['hc-badge'])
+ })
+
+ describe('given a relative `src`', () => {
+ beforeEach(() => {
+ propsData.imageProps.src = '/img/badges/fundraisingbox_de_airship.svg'
+ })
+
+ it('adds a prefix to load the image from the backend', () => {
+ expect(Wrapper().attributes('src')).toBe(
+ '/api/img/badges/fundraisingbox_de_airship.svg'
+ )
+ })
+ })
+
+ describe('given an absolute `src`', () => {
+ beforeEach(() => {
+ propsData.imageProps.src = 'http://lorempixel.com/640/480/animals'
+ })
+
+ it('keeps the URL as is', () => {
+ // e.g. our seeds have absolute image URLs
+ expect(Wrapper().attributes('src')).toBe(
+ 'http://lorempixel.com/640/480/animals'
+ )
+ })
+ })
+})
diff --git a/webapp/components/RelativeDateTime/index.spec.js b/webapp/components/RelativeDateTime/spec.js
similarity index 97%
rename from webapp/components/RelativeDateTime/index.spec.js
rename to webapp/components/RelativeDateTime/spec.js
index 55ed90a7c..446a5a8a1 100644
--- a/webapp/components/RelativeDateTime/index.spec.js
+++ b/webapp/components/RelativeDateTime/spec.js
@@ -1,5 +1,5 @@
import { shallowMount, createLocalVue } from '@vue/test-utils'
-import RelativeDateTime from './index'
+import RelativeDateTime from './'
const localVue = createLocalVue()
diff --git a/webapp/components/Tag/index.spec.js b/webapp/components/Tag/spec.js
similarity index 95%
rename from webapp/components/Tag/index.spec.js
rename to webapp/components/Tag/spec.js
index 20267e375..fa49d4d95 100644
--- a/webapp/components/Tag/index.spec.js
+++ b/webapp/components/Tag/spec.js
@@ -1,6 +1,6 @@
import { shallowMount, createLocalVue } from '@vue/test-utils'
import Styleguide from '@human-connection/styleguide'
-import Tag from './index'
+import Tag from './'
const localVue = createLocalVue()
localVue.use(Styleguide)
diff --git a/webapp/components/User/index.spec.js b/webapp/components/User/spec.js
similarity index 100%
rename from webapp/components/User/index.spec.js
rename to webapp/components/User/spec.js
diff --git a/webapp/pages/login.vue b/webapp/pages/login.vue
index 92269143b..46c6e2d79 100644
--- a/webapp/pages/login.vue
+++ b/webapp/pages/login.vue
@@ -32,8 +32,8 @@
>
diff --git a/webapp/pages/logout.vue b/webapp/pages/logout.vue
index 008908360..1dc088c61 100644
--- a/webapp/pages/logout.vue
+++ b/webapp/pages/logout.vue
@@ -11,11 +11,11 @@
margin-bottom="xxx-small"
centered
>
-
+ />