diff --git a/frontend/src/mixins/getCommunityInfo.js b/frontend/src/mixins/getCommunityInfo.js new file mode 100644 index 000000000..f8fda6e45 --- /dev/null +++ b/frontend/src/mixins/getCommunityInfo.js @@ -0,0 +1,24 @@ +import { communityInfo } from '../graphql/queries' + +export const getCommunityInfoMixin = { + methods: { + getCommunityInfo() { + if (this.$store.state.community.name === '') { + this.$apollo + .query({ + query: communityInfo, + }) + .then((result) => { + this.$store.commit('community', result.data.getCommunityInfo) + return result.data.getCommunityInfo + }) + .catch((error) => { + this.$toasted.error(error.message) + }) + } + }, + }, + created() { + this.getCommunityInfo() + }, +} diff --git a/frontend/src/store/store.js b/frontend/src/store/store.js index 9f87f0398..6a229c161 100644 --- a/frontend/src/store/store.js +++ b/frontend/src/store/store.js @@ -89,7 +89,10 @@ export const store = new Vuex.Store({ token: null, coinanimation: true, newsletterState: null, - community: null, + community: { + name: '', + description: '', + }, hasElopage: false, publisherId: null, }, diff --git a/frontend/src/views/Pages/Login.spec.js b/frontend/src/views/Pages/Login.spec.js index 13d12df85..53bb9446f 100644 --- a/frontend/src/views/Pages/Login.spec.js +++ b/frontend/src/views/Pages/Login.spec.js @@ -1,4 +1,4 @@ -import { mount, RouterLinkStub } from '@vue/test-utils' +import { RouterLinkStub, mount } from '@vue/test-utils' import flushPromises from 'flush-promises' import Login from './Login' @@ -39,10 +39,8 @@ describe('Login', () => { commit: mockStoreCommit, state: { community: { - name: 'Gradido Entwicklung', - url: 'http://localhost/vue/', - registerUrl: 'http://localhost/vue/register', - description: 'Die lokale Entwicklungsumgebung von Gradido.', + name: '', + description: '', }, publisherId: 12345, }, @@ -74,10 +72,6 @@ describe('Login', () => { wrapper = Wrapper() }) - it('renders the Login form', () => { - expect(wrapper.find('div.login-form').exists()).toBeTruthy() - }) - it('commits the community info to the store', () => { expect(mockStoreCommit).toBeCalledWith('community', { name: 'test12', @@ -87,6 +81,10 @@ describe('Login', () => { }) }) + it('renders the Login form', () => { + expect(wrapper.find('div.login-form').exists()).toBeTruthy() + }) + describe('communities gives back error', () => { beforeEach(() => { apolloQueryMock.mockRejectedValue({ @@ -106,7 +104,18 @@ describe('Login', () => { }) }) - describe('Community Data', () => { + describe('Community data already loaded', () => { + 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('.test-communitydata b').text()).toBe('Gradido Entwicklung') }) @@ -116,6 +125,10 @@ describe('Login', () => { 'Die lokale Entwicklungsumgebung von Gradido.', ) }) + + it('does not call community data update', () => { + expect(apolloQueryMock).not.toBeCalled() + }) }) describe('links', () => { diff --git a/frontend/src/views/Pages/Login.vue b/frontend/src/views/Pages/Login.vue index 0cdbeb942..de1ae993a 100755 --- a/frontend/src/views/Pages/Login.vue +++ b/frontend/src/views/Pages/Login.vue @@ -62,7 +62,8 @@ diff --git a/frontend/src/views/Pages/Register.spec.js b/frontend/src/views/Pages/Register.spec.js index 903c5f42d..c63de66cf 100644 --- a/frontend/src/views/Pages/Register.spec.js +++ b/frontend/src/views/Pages/Register.spec.js @@ -5,6 +5,19 @@ import Register from './Register' const localVue = global.localVue +const apolloQueryMock = jest.fn().mockResolvedValue({ + data: { + getCommunityInfo: { + name: 'test12', + description: 'test community 12', + url: 'http://test12.test12/', + registerUrl: 'http://test12.test12/vue/register', + }, + }, +}) + +const toastErrorMock = jest.fn() +const mockStoreCommit = jest.fn() const registerUserMutationMock = jest.fn() const routerPushMock = jest.fn() @@ -21,20 +34,23 @@ describe('Register', () => { }, $apollo: { mutate: registerUserMutationMock, + query: apolloQueryMock, }, $store: { + commit: mockStoreCommit, state: { email: 'peter@lustig.de', language: 'en', community: { - name: 'Gradido Entwicklung', - url: 'http://localhost/vue/', - registerUrl: 'http://localhost/vue/register', - description: 'Die lokale Entwicklungsumgebung von Gradido.', + name: '', + description: '', }, publisherId: 12345, }, }, + $toasted: { + error: toastErrorMock, + }, } const stubs = { @@ -50,6 +66,15 @@ describe('Register', () => { 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 Register form', () => { expect(wrapper.find('div#registerform').exists()).toBeTruthy() }) @@ -60,16 +85,44 @@ describe('Register', () => { }) }) - describe('Community Data', () => { - it('has a Community name?', () => { + describe('communities gives back error', () => { + beforeEach(() => { + apolloQueryMock.mockRejectedValue({ + message: 'Failed to get communities', + }) + wrapper = Wrapper() + }) + + it('toasts an error message', () => { + expect(toastErrorMock).toBeCalledWith('Failed to get communities') + }) + }) + + describe('Community data already loaded', () => { + 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('.test-communitydata b').text()).toBe('Gradido Entwicklung') }) - it('has a Community description?', () => { + it('has a Community description', () => { expect(wrapper.find('.test-communitydata p').text()).toBe( 'Die lokale Entwicklungsumgebung von Gradido.', ) }) + + it('does not call community data update', () => { + expect(apolloQueryMock).not.toBeCalled() + }) }) describe('links', () => { diff --git a/frontend/src/views/Pages/Register.vue b/frontend/src/views/Pages/Register.vue index 5c31b08d9..00114eb04 100755 --- a/frontend/src/views/Pages/Register.vue +++ b/frontend/src/views/Pages/Register.vue @@ -161,10 +161,12 @@ import InputEmail from '../../components/Inputs/InputEmail.vue' import InputPasswordConfirmation from '../../components/Inputs/InputPasswordConfirmation.vue' import LanguageSwitchSelect from '../../components/LanguageSwitchSelect.vue' import { registerUser } from '../../graphql/mutations' +import { getCommunityInfoMixin } from '../../mixins/getCommunityInfo' export default { components: { InputPasswordConfirmation, InputEmail, LanguageSwitchSelect }, name: 'register', + mixins: [getCommunityInfoMixin], data() { return { form: { diff --git a/frontend/src/views/Pages/RegisterCommunity.spec.js b/frontend/src/views/Pages/RegisterCommunity.spec.js index 102db5891..63fd63276 100644 --- a/frontend/src/views/Pages/RegisterCommunity.spec.js +++ b/frontend/src/views/Pages/RegisterCommunity.spec.js @@ -3,6 +3,19 @@ import RegisterCommunity from './RegisterCommunity' const localVue = global.localVue +const apolloQueryMock = jest.fn().mockResolvedValue({ + data: { + getCommunityInfo: { + name: 'test12', + description: 'test community 12', + url: 'http://test12.test12/', + registerUrl: 'http://test12.test12/vue/register', + }, + }, +}) +const toastErrorMock = jest.fn() +const mockStoreCommit = jest.fn() + describe('RegisterCommunity', () => { let wrapper @@ -11,16 +24,21 @@ describe('RegisterCommunity', () => { locale: 'en', }, $t: jest.fn((t) => t), + $apollo: { + query: apolloQueryMock, + }, $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: '', }, }, }, + $toasted: { + error: toastErrorMock, + }, } const stubs = { @@ -36,23 +54,56 @@ describe('RegisterCommunity', () => { 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-community"', () => { expect(wrapper.find('div#register-community').exists()).toBeTruthy() }) - describe('Displaying the current community info', () => { - it('has a current community name', () => { - expect(wrapper.find('.header h1').text()).toBe('Gradido Entwicklung') + describe('communities gives back error', () => { + beforeEach(() => { + apolloQueryMock.mockRejectedValue({ + message: 'Failed to get communities', + }) + wrapper = Wrapper() }) - it('has a current community description', () => { - expect(wrapper.find('.header p').text()).toBe( + it('toasts an error message', () => { + expect(toastErrorMock).toBeCalledWith('Failed to get communities') + }) + }) + + describe('Community data already loaded', () => { + 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('.justify-content-center h1').text()).toBe('Gradido Entwicklung') + }) + + it('has a Community description', () => { + expect(wrapper.find('.justify-content-center p').text()).toBe( 'Die lokale Entwicklungsumgebung von Gradido.', ) }) - it('has a current community location', () => { - expect(wrapper.find('.header p.community-location').text()).toBe('http://localhost/vue/') + it('does not call community data update', () => { + expect(apolloQueryMock).not.toBeCalled() }) }) diff --git a/frontend/src/views/Pages/RegisterCommunity.vue b/frontend/src/views/Pages/RegisterCommunity.vue index 9512edd1a..594c69571 100644 --- a/frontend/src/views/Pages/RegisterCommunity.vue +++ b/frontend/src/views/Pages/RegisterCommunity.vue @@ -49,12 +49,11 @@ diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js index dbcd950b8..eba23cea4 100644 --- a/frontend/src/views/Pages/RegisterSelectCommunity.spec.js +++ b/frontend/src/views/Pages/RegisterSelectCommunity.spec.js @@ -1,4 +1,5 @@ import { mount, RouterLinkStub } from '@vue/test-utils' +import { communities, communityInfo } from '../../graphql/queries' 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: '', }, }, }, @@ -80,9 +93,23 @@ describe('RegisterSelectCommunity', () => { describe('mount', () => { beforeEach(() => { + jest.clearAllMocks() wrapper = Wrapper() }) + it('calls the API to get the community info data', () => { + expect(apolloQueryMock).toBeCalledWith({ + query: communityInfo, + }) + }) + + it('calls the API to get the communities data', () => { + expect(apolloQueryMock).toBeCalledWith({ + query: communities, + fetchPolicy: 'network-only', + }) + }) + it('renders the Div Element "#register-select-community"', () => { expect(wrapper.find('div#register-select-community').exists()).toBeTruthy() }) @@ -91,8 +118,72 @@ 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 already loaded', () => { + beforeEach(() => { + jest.clearAllMocks() + mocks.$store.state.community = { + name: 'Gradido Entwicklung', + description: 'Die lokale Entwicklungsumgebung von Gradido.', + url: 'http://localhost/vue/', + registerUrl: 'http://localhost/vue/register-community', + } + wrapper = Wrapper() + }) + + it('does not call community info data when already filled', () => { + expect(apolloQueryMock).not.toBeCalledWith({ + query: communityInfo, + }) + }) + + 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', () => { + beforeEach(async () => { + wrapper = Wrapper() + await wrapper.setData({ + communities: [ + { + 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', + }, + ], + }) + }) + it('calls the API to get the data', () => { expect(apolloQueryMock).toBeCalled() }) diff --git a/frontend/src/views/Pages/RegisterSelectCommunity.vue b/frontend/src/views/Pages/RegisterSelectCommunity.vue index 0d3c25220..f6914f1f2 100644 --- a/frontend/src/views/Pages/RegisterSelectCommunity.vue +++ b/frontend/src/views/Pages/RegisterSelectCommunity.vue @@ -7,7 +7,7 @@ {{ $store.state.community.name }} - {{ $store.state.community.description }} + {{ $store.state.community.description }} @@ -24,7 +24,7 @@ {{ community.name }} - {{ community.description }} + {{ community.description }} @@ -49,6 +49,7 @@
{{ $store.state.community.description }}
{{ community.description }}