Change the register select community to test the community mixin.

frontend/src/views/Pages/RegisterSelectCommunity.spec.js

@@ -1,4 +1,5 @@
 import { mount, RouterLinkStub } from '@vue/test-utils'
+import flushPromises from 'flush-promises'
 import RegisterSelectCommunity from './RegisterSelectCommunity'
 
 const localVue = global.localVue
@@ -11,35 +12,48 @@ const spinnerMock = jest.fn(() => {
   }
 })
 
-const apolloQueryMock = jest.fn().mockResolvedValue({
-  data: {
-    communities: [
-      {
-        id: 1,
-        name: 'Gradido Entwicklung',
-        description: 'Die lokale Entwicklungsumgebung von Gradido.',
-        url: 'http://localhost/vue/',
-        registerUrl: 'http://localhost/vue/register-community',
+const apolloQueryMock = jest
+  .fn()
+  .mockResolvedValueOnce({
+    data: {
+      getCommunityInfo: {
+        name: 'test12',
+        description: 'test community 12',
+        url: 'http://test12.test12/',
+        registerUrl: 'http://test12.test12/vue/register',
       },
-      {
-        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',
-      },
-    ],
-  },
-})
+    },
+  })
+  .mockResolvedValue({
+    data: {
+      communities: [
+        {
+          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()
+const mockStoreCommit = jest.fn()
 
 describe('RegisterSelectCommunity', () => {
   let wrapper
@@ -50,12 +64,11 @@ describe('RegisterSelectCommunity', () => {
     },
     $t: jest.fn((t) => t),
     $store: {
+      commit: mockStoreCommit,
       state: {
         community: {
-          name: 'Gradido Entwicklung',
-          url: 'http://localhost/vue/',
-          registerUrl: 'http://localhost/vue/register',
-          description: 'Die lokale Entwicklungsumgebung von Gradido.',
+          name: '',
+          description: '',
         },
       },
     },
@@ -83,6 +96,15 @@ describe('RegisterSelectCommunity', () => {
       wrapper = Wrapper()
     })
 
+    it('commits the community info to the store', () => {
+      expect(mockStoreCommit).toBeCalledWith('community', {
+        name: 'test12',
+        description: 'test community 12',
+        url: 'http://test12.test12/',
+        registerUrl: 'http://test12.test12/vue/register',
+      })
+    })
+
     it('renders the Div Element "#register-select-community"', () => {
       expect(wrapper.find('div#register-select-community').exists()).toBeTruthy()
     })
@@ -91,6 +113,42 @@ describe('RegisterSelectCommunity', () => {
       expect(spinnerMock).toBeCalled()
     })
 
+    describe('communities gives back error', () => {
+      beforeEach(() => {
+        apolloQueryMock.mockRejectedValue({
+          message: 'Failed to get communities',
+        })
+        wrapper = Wrapper()
+      })
+
+      it('toasts an error message', () => {
+        expect(toasterMock).toBeCalledWith('Failed to get communities')
+      })
+    })
+
+    describe('Community Data', () => {
+      beforeEach(() => {
+        jest.clearAllMocks()
+        mocks.$store.state.community = {
+          name: 'Gradido Entwicklung',
+          url: 'http://localhost/vue/',
+          registerUrl: 'http://localhost/vue/register',
+          description: 'Die lokale Entwicklungsumgebung von Gradido.',
+        }
+        wrapper = Wrapper()
+      })
+
+      it('has a Community name', () => {
+        expect(wrapper.find('.card-body b').text()).toBe('Gradido Entwicklung')
+      })
+
+      it('has a Community description', () => {
+        expect(wrapper.find('.card-body p').text()).toBe(
+          'Die lokale Entwicklungsumgebung von Gradido.',
+        )
+      })
+    })
+
     describe('calls the apollo query', () => {
       describe('server returns data', () => {
         it('calls the API to get the data', () => {

frontend/src/views/Pages/RegisterSelectCommunity.vue

@@ -7,7 +7,7 @@
         <b-card class="border-0 mb-0" bg-variant="primary">
           <b>{{ $store.state.community.name }}</b>
           <br />
-          {{ $store.state.community.description }}
+          <p>{{ $store.state.community.description }}</p>
           <br />
           <router-link to="/register">
             <b-button variant="outline-secondary">
@@ -24,7 +24,7 @@
           <b-card bg-variant="secondary">
             <b>{{ community.name }}</b>
             <br />
-            {{ community.description }}
+            <p>{{ community.description }}</p>
             <br />
             <b>
               <small>