From 4dcfb0a876b80353d0c1f478b95496a35f634186 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 7 Oct 2021 15:05:28 +0200
Subject: [PATCH 1/5] refactor: Links in Frontend

---
 frontend/src/routes/router.test.js            | 14 ++++++++++++
 frontend/src/routes/routes.js                 |  2 +-
 frontend/src/views/Pages/Register.vue         | 21 +++++++++---------
 .../src/views/Pages/RegisterCommunity.vue     | 22 ++++++++++++-------
 .../views/Pages/RegisterSelectCommunity.vue   | 12 ++++++----
 5 files changed, 47 insertions(+), 24 deletions(-)

diff --git a/frontend/src/routes/router.test.js b/frontend/src/routes/router.test.js
index 8b6fbf3b9..5e2e16005 100644
--- a/frontend/src/routes/router.test.js
+++ b/frontend/src/routes/router.test.js
@@ -131,6 +131,20 @@ describe('router', () => {
         })
       })
 
+      describe('register-community', () => {
+        it('loads the "registerCommunity" component', async () => {
+          const component = await routes.find((r) => r.path === '/register-community').component()
+          expect(component.default.name).toBe('registerCommunity')
+        })
+      })
+
+      describe('select-community', () => {
+        it('loads the "registerSelectCommunity" component', async () => {
+          const component = await routes.find((r) => r.path === '/select-community').component()
+          expect(component.default.name).toBe('registerSelectCommunity')
+        })
+      })
+
       describe('reset', () => {
         it('loads the "ResetPassword" component', async () => {
           const component = await routes.find((r) => r.path === '/reset/:optin').component()
diff --git a/frontend/src/routes/routes.js b/frontend/src/routes/routes.js
index 6bd1ac75d..71315da9e 100755
--- a/frontend/src/routes/routes.js
+++ b/frontend/src/routes/routes.js
@@ -36,7 +36,7 @@ const routes = [
     path: '/thx/:comingFrom',
     component: () => import('../views/Pages/thx.vue'),
     beforeEnter: (to, from, next) => {
-      const validFrom = ['password', 'reset', 'register', 'community']
+      const validFrom = ['password', 'reset', 'register']
       if (!validFrom.includes(from.path.split('/')[1])) {
         next({ path: '/login' })
       } else {
diff --git a/frontend/src/views/Pages/Register.vue b/frontend/src/views/Pages/Register.vue
index 43885e1c6..9210970ec 100755
--- a/frontend/src/views/Pages/Register.vue
+++ b/frontend/src/views/Pages/Register.vue
@@ -124,10 +124,11 @@
 
                   <div class="text-center">
                     <div class="text-center">
-                      <b-button class="test-button-back" variant="outline-secondary" to="/login">
-                        {{ $t('back') }}
-                      </b-button>
-
+                      <router-link to="/login">
+                        <b-button class="test-button-back" variant="outline-secondary">
+                          {{ $t('back') }}
+                        </b-button>
+                      </router-link>
                       <b-button
                         :disabled="!(namesFilled && emailFilled && form.agree && !!language)"
                         type="submit"
@@ -145,13 +146,11 @@
       </b-row>
     </b-container>
     <div class="text-center pt-4">
-      <b-button
-        class="test-button-another-community"
-        variant="outline-secondary"
-        to="/select-community"
-      >
-        {{ $t('community.choose-another-community') }}
-      </b-button>
+      <router-link to="/select-community">
+        <b-button class="test-button-another-community" variant="outline-secondary">
+          {{ $t('community.choose-another-community') }}
+        </b-button>
+      </router-link>
     </div>
   </div>
 </template>
diff --git a/frontend/src/views/Pages/RegisterCommunity.vue b/frontend/src/views/Pages/RegisterCommunity.vue
index ca1305e87..9512edd1a 100644
--- a/frontend/src/views/Pages/RegisterCommunity.vue
+++ b/frontend/src/views/Pages/RegisterCommunity.vue
@@ -17,24 +17,30 @@
           </b-row>
           <b-row>
             <b-col class="text-center">
-              <b-button variant="outline-secondary" to="/register">
-                {{ $t('community.continue-to-registration') }}
-              </b-button>
+              <router-link to="/register">
+                <b-button variant="outline-secondary">
+                  {{ $t('community.continue-to-registration') }}
+                </b-button>
+              </router-link>
             </b-col>
           </b-row>
 
           <hr />
           <b-row>
             <b-col class="text-center">
-              <b-button variant="outline-secondary" to="/select-community">
-                {{ $t('community.choose-another-community') }}
-              </b-button>
+              <router-link to="/select-community">
+                <b-button variant="outline-secondary">
+                  {{ $t('community.choose-another-community') }}
+                </b-button>
+              </router-link>
             </b-col>
           </b-row>
           <hr />
           <b-row>
             <b-col class="text-center">
-              <b-button variant="outline-secondary" to="/login">{{ $t('back') }}</b-button>
+              <router-link to="/login">
+                <b-button variant="outline-secondary">{{ $t('back') }}</b-button>
+              </router-link>
             </b-col>
           </b-row>
         </div>
@@ -44,7 +50,7 @@
 </template>
 <script>
 export default {
-  name: 'registerSelectCommunity',
+  name: 'registerCommunity',
   data() {
     return {}
   },
diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.vue b/frontend/src/views/Pages/RegisterSelectCommunity.vue
index 1c4c5b990..078e05c9b 100644
--- a/frontend/src/views/Pages/RegisterSelectCommunity.vue
+++ b/frontend/src/views/Pages/RegisterSelectCommunity.vue
@@ -14,9 +14,11 @@
             <br />
             {{ $store.state.community.description }}
             <br />
-            <b-button variant="outline-secondary" to="/register">
-              {{ $t('community.continue-to-registration') }}
-            </b-button>
+            <router-link to="/register">
+              <b-button variant="outline-secondary">
+                {{ $t('community.continue-to-registration') }}
+              </b-button>
+            </router-link>
           </b-card>
         </div>
 
@@ -44,7 +46,9 @@
       </div>
 
       <div class="text-center py-lg-4">
-        <b-button variant="outline-secondary" to="/login">{{ $t('back') }}</b-button>
+        <router-link to="/login">
+          <b-button variant="outline-secondary">{{ $t('back') }}</b-button>
+        </router-link>
       </div>
     </b-container>
   </div>

From 9441ad0c788d5e98746c689a219f2ab733a17aa2 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 7 Oct 2021 15:13:40 +0200
Subject: [PATCH 2/5] adopt test for register.vue

---
 frontend/src/views/Pages/Register.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/views/Pages/Register.vue b/frontend/src/views/Pages/Register.vue
index 9210970ec..8e1a5d26d 100755
--- a/frontend/src/views/Pages/Register.vue
+++ b/frontend/src/views/Pages/Register.vue
@@ -124,8 +124,8 @@
 
                   <div class="text-center">
                     <div class="text-center">
-                      <router-link to="/login">
-                        <b-button class="test-button-back" variant="outline-secondary">
+                      <router-link class="test-button-back" to="/login">
+                        <b-button variant="outline-secondary">
                           {{ $t('back') }}
                         </b-button>
                       </router-link>
@@ -146,8 +146,8 @@
       </b-row>
     </b-container>
     <div class="text-center pt-4">
-      <router-link to="/select-community">
-        <b-button class="test-button-another-community" variant="outline-secondary">
+      <router-link class="test-button-another-community" to="/select-community">
+        <b-button variant="outline-secondary">
           {{ $t('community.choose-another-community') }}
         </b-button>
       </router-link>

From 4016e316b2d1460c534f396ca2664a89355914f9 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 7 Oct 2021 17:54:14 +0200
Subject: [PATCH 3/5] remove logic from template. Complete tests

---
 .../src/views/Pages/RegisterCommunity.spec.js |  8 ++-
 .../Pages/RegisterSelectCommunity.spec.js     | 68 ++++++++++++++++---
 .../views/Pages/RegisterSelectCommunity.vue   | 34 ++++------
 3 files changed, 78 insertions(+), 32 deletions(-)

diff --git a/frontend/src/views/Pages/RegisterCommunity.spec.js b/frontend/src/views/Pages/RegisterCommunity.spec.js
index 88a60f349..102db5891 100644
--- a/frontend/src/views/Pages/RegisterCommunity.spec.js
+++ b/frontend/src/views/Pages/RegisterCommunity.spec.js
@@ -1,4 +1,4 @@
-import { mount } from '@vue/test-utils'
+import { mount, RouterLinkStub } from '@vue/test-utils'
 import RegisterCommunity from './RegisterCommunity'
 
 const localVue = global.localVue
@@ -23,8 +23,12 @@ describe('RegisterCommunity', () => {
     },
   }
 
+  const stubs = {
+    RouterLink: RouterLinkStub,
+  }
+
   const Wrapper = () => {
-    return mount(RegisterCommunity, { localVue, mocks })
+    return mount(RegisterCommunity, { localVue, mocks, stubs })
   }
 
   describe('mount', () => {
diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
index 396eae59b..ba63ca295 100644
--- a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
+++ b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
@@ -1,26 +1,44 @@
-import { mount } from '@vue/test-utils'
+import { mount, RouterLinkStub } from '@vue/test-utils'
 import RegisterSelectCommunity from './RegisterSelectCommunity'
 
 const localVue = global.localVue
 
 const spinnerHideMock = jest.fn()
+
 const spinnerMock = jest.fn(() => {
   return {
     hide: spinnerHideMock,
   }
 })
+
 const apolloQueryMock = jest.fn().mockResolvedValue({
   data: {
     communities: [
       {
-        name: 'test1',
-        description: 'description 1',
-        url: 'http://test.test/vue',
+        id: 1,
+        name: 'Gradido Entwicklung',
+        description: 'Die lokale Entwicklungsumgebung von Gradido.',
+        url: 'http://localhost/vue/',
         registerUrl: 'http://localhost/vue/register-community',
       },
+      {
+        id: 2,
+        name: 'Gradido Staging',
+        description: 'Der Testserver der Gradido-Akademie.',
+        url: 'https://stage1.gradido.net/vue/',
+        registerUrl: 'https://stage1.gradido.net/vue/register-community',
+      },
+      {
+        id: 3,
+        name: 'Gradido-Akademie',
+        description: 'Freies Institut für Wirtschaftsbionik.',
+        url: 'https://gradido.net',
+        registerUrl: 'https://gdd1.gradido.com/vue/register-community',
+      },
     ],
   },
 })
+
 const toasterMock = jest.fn()
 
 describe('RegisterSelectCommunity', () => {
@@ -52,8 +70,12 @@ describe('RegisterSelectCommunity', () => {
     },
   }
 
+  const stubs = {
+    RouterLink: RouterLinkStub,
+  }
+
   const Wrapper = () => {
-    return mount(RegisterSelectCommunity, { localVue, mocks })
+    return mount(RegisterSelectCommunity, { localVue, mocks, stubs })
   }
 
   describe('mount', () => {
@@ -65,16 +87,40 @@ describe('RegisterSelectCommunity', () => {
       expect(wrapper.find('div#register-select-community').exists()).toBeTruthy()
     })
 
+    it('starts with a spinner', () => {
+      expect(spinnerMock).toBeCalled()
+    })
+
     describe('calls the apollo query', () => {
-      beforeEach(() => {
-        apolloQueryMock.mockRejectedValue({
-          message: 'Wrong thing',
+      describe('server returns data', () => {
+        it('calls the API to get the data', () => {
+          expect(apolloQueryMock).toBeCalled()
+        })
+
+        it('has two communities', () => {
+          expect(wrapper.vm.communities).toHaveLength(2)
+        })
+
+        it('hides the spinner', () => {
+          expect(spinnerHideMock).toBeCalled()
         })
-        wrapper = Wrapper()
       })
 
-      it('toast an error', () => {
-        expect(toasterMock).toBeCalledWith('Wrong thing')
+      describe('server response is error', () => {
+        beforeEach(() => {
+          apolloQueryMock.mockRejectedValue({
+            message: 'Wrong thing',
+          })
+          wrapper = Wrapper()
+        })
+
+        it('toast an error', () => {
+          expect(toasterMock).toBeCalledWith('Wrong thing')
+        })
+
+        it('hides the spinner', () => {
+          expect(spinnerHideMock).toBeCalled()
+        })
       })
     })
   })
diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.vue b/frontend/src/views/Pages/RegisterSelectCommunity.vue
index 078e05c9b..0d3c25220 100644
--- a/frontend/src/views/Pages/RegisterSelectCommunity.vue
+++ b/frontend/src/views/Pages/RegisterSelectCommunity.vue
@@ -4,30 +4,24 @@
       <div class="pb-3">{{ $t('community.current-community') }}</div>
 
       <div v-if="!pending">
-        <div v-for="community in communities" :key="community.name">
-          <b-card
-            v-if="community.name === $store.state.community.name"
-            class="border-0 mb-0"
-            bg-variant="primary"
-          >
-            <b>{{ community.name }}</b>
-            <br />
-            {{ $store.state.community.description }}
-            <br />
-            <router-link to="/register">
-              <b-button variant="outline-secondary">
-                {{ $t('community.continue-to-registration') }}
-              </b-button>
-            </router-link>
-          </b-card>
-        </div>
+        <b-card class="border-0 mb-0" bg-variant="primary">
+          <b>{{ $store.state.community.name }}</b>
+          <br />
+          {{ $store.state.community.description }}
+          <br />
+          <router-link to="/register">
+            <b-button variant="outline-secondary">
+              {{ $t('community.continue-to-registration') }}
+            </b-button>
+          </router-link>
+        </b-card>
 
         <hr />
 
         <div>{{ $t('community.other-communities') }}</div>
 
         <div v-for="community in communities" :key="community.id" class="pb-3">
-          <b-card v-if="community.name != $store.state.community.name" bg-variant="secondary">
+          <b-card bg-variant="secondary">
             <b>{{ community.name }}</b>
             <br />
             {{ community.description }}
@@ -75,7 +69,9 @@ export default {
           fetchPolicy: 'network-only',
         })
         .then((response) => {
-          this.communities = response.data.communities
+          this.communities = response.data.communities.filter(
+            (c) => c.name !== this.$store.state.community.name,
+          )
         })
         .catch((error) => {
           this.$toasted.error(error.message)

From 49f74ae3ab07d1997c0098eafd9cea08a0a60aaa Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 7 Oct 2021 17:58:19 +0200
Subject: [PATCH 4/5] check visible html instead of internal status

---
 frontend/src/views/Pages/RegisterSelectCommunity.spec.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
index ba63ca295..dbcd950b8 100644
--- a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
+++ b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js
@@ -97,8 +97,8 @@ describe('RegisterSelectCommunity', () => {
           expect(apolloQueryMock).toBeCalled()
         })
 
-        it('has two communities', () => {
-          expect(wrapper.vm.communities).toHaveLength(2)
+        it('shows two other communities', () => {
+          expect(wrapper.findAll('div.bg-secondary')).toHaveLength(2)
         })
 
         it('hides the spinner', () => {

From 3c409c9bfdd14f425dc025e653b5ec36e323f8f3 Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Thu, 7 Oct 2021 19:13:52 +0200
Subject: [PATCH 5/5] porper tests for the checkboxes

---
 .../Pages/UserProfile/UserCard_CoinAnimation.spec.js  |  9 +++++----
 .../Pages/UserProfile/UserCard_Newsletter.spec.js     | 11 ++++++-----
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/frontend/src/views/Pages/UserProfile/UserCard_CoinAnimation.spec.js b/frontend/src/views/Pages/UserProfile/UserCard_CoinAnimation.spec.js
index 8e95605a5..59d1f72e5 100644
--- a/frontend/src/views/Pages/UserProfile/UserCard_CoinAnimation.spec.js
+++ b/frontend/src/views/Pages/UserProfile/UserCard_CoinAnimation.spec.js
@@ -37,6 +37,7 @@ describe('UserCard_CoinAnimation', () => {
 
   describe('mount', () => {
     beforeEach(() => {
+      jest.clearAllMocks()
       wrapper = Wrapper()
     })
 
@@ -50,7 +51,7 @@ describe('UserCard_CoinAnimation', () => {
 
     describe('enable with success', () => {
       beforeEach(async () => {
-        mocks.$store.state.coinanimation = false
+        await wrapper.setData({ CoinAnimationStatus: false })
         mockAPIcall.mockResolvedValue({
           data: {
             updateUserInfos: {
@@ -58,7 +59,7 @@ describe('UserCard_CoinAnimation', () => {
             },
           },
         })
-        await wrapper.find('input').trigger('change')
+        await wrapper.find('input').setChecked()
       })
 
       it('calls the updateUserInfos mutation', () => {
@@ -81,7 +82,7 @@ describe('UserCard_CoinAnimation', () => {
 
     describe('disable with success', () => {
       beforeEach(async () => {
-        mocks.$store.state.coinanimation = true
+        await wrapper.setData({ CoinAnimationStatus: true })
         mockAPIcall.mockResolvedValue({
           data: {
             updateUserInfos: {
@@ -89,7 +90,7 @@ describe('UserCard_CoinAnimation', () => {
             },
           },
         })
-        wrapper.find('input').trigger('change')
+        await wrapper.find('input').setChecked(false)
       })
 
       it('calls the subscribe mutation', () => {
diff --git a/frontend/src/views/Pages/UserProfile/UserCard_Newsletter.spec.js b/frontend/src/views/Pages/UserProfile/UserCard_Newsletter.spec.js
index 37031769b..facde1f36 100644
--- a/frontend/src/views/Pages/UserProfile/UserCard_Newsletter.spec.js
+++ b/frontend/src/views/Pages/UserProfile/UserCard_Newsletter.spec.js
@@ -38,6 +38,7 @@ describe('UserCard_Newsletter', () => {
 
   describe('mount', () => {
     beforeEach(() => {
+      jest.clearAllMocks()
       wrapper = Wrapper()
     })
 
@@ -51,13 +52,13 @@ describe('UserCard_Newsletter', () => {
 
     describe('unsubscribe with success', () => {
       beforeEach(async () => {
-        await wrapper.setData({ newsletterState: false })
+        await wrapper.setData({ newsletterState: true })
         mockAPIcall.mockResolvedValue({
           data: {
             unsubscribeNewsletter: true,
           },
         })
-        await wrapper.find('input').trigger('change')
+        await wrapper.find('input').setChecked(false)
       })
 
       it('calls the unsubscribe mutation', () => {
@@ -80,13 +81,13 @@ describe('UserCard_Newsletter', () => {
 
     describe('subscribe with success', () => {
       beforeEach(async () => {
-        await wrapper.setData({ newsletterState: true })
+        await wrapper.setData({ newsletterState: false })
         mockAPIcall.mockResolvedValue({
           data: {
             subscribeNewsletter: true,
           },
         })
-        wrapper.find('input').trigger('change')
+        await wrapper.find('input').setChecked()
       })
 
       it('calls the subscribe mutation', () => {
@@ -104,7 +105,7 @@ describe('UserCard_Newsletter', () => {
       })
 
       it('toasts a success message', () => {
-        expect(toastSuccessMock).toBeCalledWith('settings.newsletter.newsletterFalse')
+        expect(toastSuccessMock).toBeCalledWith('settings.newsletter.newsletterTrue')
       })
     })