IT4Change/gradido
3
0
Fork 0
mirror of https://github.com/IT4Change/gradido.git synced 2025-12-13 07:45:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'apollo-client' of https://github.com/gradido/gradido into apollo-client

Browse Source
This commit is contained in:
Hannes Heine 2021-08-10 13:35:51 +02:00
commit f3e815eb91
8 changed files with 170 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/workflows/test.yml vendored
View File

@ -261,7 +261,7 @@ jobs:
report_name: Coverage Frontend
type: lcov
result_path: ./coverage/lcov.info
min_coverage: 47
min_coverage: 50
token: ${{ github.token }}
##############################################################################

42
frontend/src/components/LanguageSwitch.spec.js
View File

@ -6,9 +6,7 @@ const localVue = global.localVue
const updateUserInfosQueryMock = jest.fn().mockResolvedValue({
data: {
updateUserInfos: {
sessionId: 1234,
email: 'he@ho.he',
locale: 'de',
validValues: 1,
},
},
})
@ -50,17 +48,22 @@ describe('LanguageSwitch', () => {
describe('with locales en and de', () => {
describe('empty store', () => {
it('shows English as default navigator langauge', () => {
expect(wrapper.find('button.dropdown-toggle').text()).toBe('English - en')
describe('navigator language is "en-US"', () => {
const languageGetter = jest.spyOn(navigator, 'language', 'get')
it('shows English as default navigator langauge', async () => {
languageGetter.mockReturnValue('en-US')
wrapper.vm.setCurrentLanguage()
await wrapper.vm.$nextTick()
expect(wrapper.find('button.dropdown-toggle').text()).toBe('English - en')
})
})
describe('navigator language is "de-DE"', () => {
const mockNavigator = jest.fn(() => {
return 'de'
})
const languageGetter = jest.spyOn(navigator, 'language', 'get')
it('shows Deutsch as language ', async () => {
wrapper.vm.getNavigatorLanguage = mockNavigator
languageGetter.mockReturnValue('de-DE')
wrapper.vm.setCurrentLanguage()
await wrapper.vm.$nextTick()
expect(wrapper.find('button.dropdown-toggle').text()).toBe('Deutsch - de')
@ -68,12 +71,21 @@ describe('LanguageSwitch', () => {
})
describe('navigator language is "es-ES" (not supported)', () => {
const mockNavigator = jest.fn(() => {
return 'es'
})
const languageGetter = jest.spyOn(navigator, 'language', 'get')
it('shows English as language ', async () => {
wrapper.vm.getNavigatorLanguage = mockNavigator
languageGetter.mockReturnValue('es-ES')
wrapper.vm.setCurrentLanguage()
await wrapper.vm.$nextTick()
expect(wrapper.find('button.dropdown-toggle').text()).toBe('English - en')
})
})
describe('no navigator langauge', () => {
const languageGetter = jest.spyOn(navigator, 'language', 'get')
it('shows English as language ', async () => {
languageGetter.mockReturnValue(null)
wrapper.vm.setCurrentLanguage()
await wrapper.vm.$nextTick()
expect(wrapper.find('button.dropdown-toggle').text()).toBe('English - en')
@ -107,7 +119,7 @@ describe('LanguageSwitch', () => {
describe('calls the API', () => {
it("with locale 'en'", () => {
wrapper.vm.saveLocale('en')
wrapper.findAll('li').at(0).find('a').trigger('click')
expect(updateUserInfosQueryMock).toBeCalledWith(
expect.objectContaining({
variables: {
@ -120,7 +132,7 @@ describe('LanguageSwitch', () => {
})
it("with locale 'de'", () => {
wrapper.vm.saveLocale('de')
wrapper.findAll('li').at(1).find('a').trigger('click')
expect(updateUserInfosQueryMock).toBeCalledWith(
expect.objectContaining({
variables: {

1
frontend/src/components/LanguageSwitch.vue
View File

@ -34,7 +34,6 @@ export default {
async saveLocale(locale) {
this.setLocale(locale)
if (this.$store.state.sessionId && this.$store.state.email) {
// eslint-disable-next-line no-console
this.$apollo
.query({
query: updateUserInfos,

6
frontend/src/graphql/queries.js
View File

@ -101,3 +101,9 @@ export const resgisterUserQuery = gql`
create(email: $email, firstName: $firstName, lastName: $lastName, password: $password)
}
`
export const sendCoins = gql`
query($sessionId: Float!, $email: String!, $amount: Float!, $memo: String!) {
sendCoins(sessionId: $sessionId, email: $email, amount: $amount, memo: $memo)
}
`

108
frontend/src/views/Layout/DashboardLayout_gdd.spec.js
View File

@ -6,16 +6,10 @@ jest.useFakeTimers()
const localVue = global.localVue
const transitionStub = () => ({
render(h) {
return this.$options._renderChildren
},
})
const storeDispatchMock = jest.fn()
const storeCommitMock = jest.fn()
const routerPushMock = jest.fn()
const logoutQueryMock = jest.fn().mockResolvedValue({
const apolloMock = jest.fn().mockResolvedValue({
data: {
logout: 'success',
},
@ -39,7 +33,7 @@ describe('DashboardLayoutGdd', () => {
push: routerPushMock,
},
$apollo: {
query: logoutQueryMock,
query: apolloMock,
},
$store: {
state: {
@ -53,8 +47,7 @@ describe('DashboardLayoutGdd', () => {
const stubs = {
RouterLink: RouterLinkStub,
FadeTransition: transitionStub(),
RouterView: transitionStub(),
RouterView: true,
}
const Wrapper = () => {
@ -136,7 +129,7 @@ describe('DashboardLayoutGdd', () => {
})
it('calls the API', async () => {
expect(logoutQueryMock).toBeCalledWith(
expect(apolloMock).toBeCalledWith(
expect.objectContaining({
variables: { sessionId: 1 },
}),
@ -150,6 +143,99 @@ describe('DashboardLayoutGdd', () => {
it('redirects to login page', () => {
expect(routerPushMock).toBeCalledWith('/login')
})
describe('logout fails', () => {
beforeEach(() => {
apolloMock.mockRejectedValue({
message: 'error',
})
})
it('dispatches logout to store', () => {
expect(storeDispatchMock).toBeCalledWith('logout')
})
it('redirects to login page', () => {
expect(routerPushMock).toBeCalledWith('/login')
})
})
})
describe('update balance', () => {
it('updates the amount correctelly', async () => {
await wrapper.findComponent({ ref: 'router-view' }).vm.$emit('update-balance', 5)
await flushPromises()
expect(wrapper.vm.balance).toBe(-5)
})
})
describe('update transactions', () => {
beforeEach(async () => {
apolloMock.mockResolvedValue({
data: {
transactionList: {
gdtSum: 100,
count: 4,
balance: 1450,
decay: 1250,
transactions: ['transaction', 'transaction', 'transaction', 'transaction'],
},
},
})
await wrapper
.findComponent({ ref: 'router-view' })
.vm.$emit('update-transactions', { firstPage: 2, items: 5 })
await flushPromises()
})
it('calls the API', () => {
expect(apolloMock).toBeCalledWith(
expect.objectContaining({
variables: {
sessionId: 1,
firstPage: 2,
items: 5,
},
}),
)
})
it('updates balance', () => {
expect(wrapper.vm.balance).toBe(1250)
})
it('updates transactions', () => {
expect(wrapper.vm.transactions).toEqual([
'transaction',
'transaction',
'transaction',
'transaction',
])
})
it('updates GDT balance', () => {
expect(wrapper.vm.GdtBalance).toBe(100)
})
it('updates transaction count', () => {
expect(wrapper.vm.transactionCount).toBe(4)
})
})
describe('update transactions returns error', () => {
beforeEach(async () => {
apolloMock.mockRejectedValue({
message: 'error',
})
await wrapper
.findComponent({ ref: 'router-view' })
.vm.$emit('update-transactions', { firstPage: 2, items: 5 })
await flushPromises()
})
it('sets pending to true', () => {
expect(wrapper.vm.pending).toBeTruthy()
})
})
})
})

8
frontend/src/views/Layout/DashboardLayout_gdd.vue
View File

@ -51,6 +51,7 @@
<fade-transition :duration="200" origin="center top" mode="out-in">
<!-- your content here -->
<router-view
ref="router-view"
:balance="balance"
:gdt-balance="GdtBalance"
:transactions="transactions"
@ -99,7 +100,11 @@ export default {
this.$store.dispatch('logout')
this.$router.push('/login')
})
// do we have to handle errors?
.catch(() => {
this.$sidebar.displaySidebar(false)
this.$store.dispatch('logout')
this.$router.push('/login')
})
},
async updateTransactions(pagination) {
this.pending = true
@ -111,6 +116,7 @@ export default {
firstPage: pagination.firstPage,
items: pagination.items,
},
fetchPolicy: 'network-only',
})
.then((result) => {
const {

27
frontend/src/views/Pages/AccountOverview.spec.js
View File

@ -1,13 +1,8 @@
import { mount } from '@vue/test-utils'
import AccountOverview from './AccountOverview'
import communityAPI from '../../apis/communityAPI.js'
jest.mock('../../apis/communityAPI.js')
const sendMock = jest.fn()
sendMock.mockReturnValue({ success: true })
communityAPI.send = sendMock
sendMock.mockResolvedValue('success')
const localVue = global.localVue
@ -27,6 +22,9 @@ describe('AccountOverview', () => {
},
},
$n: jest.fn((n) => String(n)),
$apollo: {
query: sendMock,
},
}
const Wrapper = () => {
@ -92,11 +90,16 @@ describe('AccountOverview', () => {
})
it('calls the API when send-transaction is emitted', async () => {
expect(sendMock).toBeCalledWith(1, {
email: 'user@example.org',
amount: 23.45,
memo: 'Make the best of it!',
})
expect(sendMock).toBeCalledWith(
expect.objectContaining({
variables: {
sessionId: 1,
email: 'user@example.org',
amount: 23.45,
memo: 'Make the best of it!',
},
}),
)
})
it('emits update-balance', () => {
@ -112,7 +115,7 @@ describe('AccountOverview', () => {
describe('transaction is confirmed and server response is error', () => {
beforeEach(async () => {
jest.clearAllMocks()
sendMock.mockReturnValue({ success: false, result: { message: 'receiver not found' } })
sendMock.mockRejectedValue({ message: 'receiver not found' })
await wrapper
.findComponent({ name: 'TransactionConfirmation' })
.vm.$emit('send-transaction')

26
frontend/src/views/Pages/AccountOverview.vue
View File

@ -51,7 +51,7 @@ import GddTransactionListFooter from './AccountOverview/GddTransactionListFooter
import TransactionForm from './AccountOverview/GddSend/TransactionForm.vue'
import TransactionConfirmation from './AccountOverview/GddSend/TransactionConfirmation.vue'
import TransactionResult from './AccountOverview/GddSend/TransactionResult.vue'
import communityAPI from '../../apis/communityAPI.js'
import { sendCoins } from '../../graphql/queries.js'
const EMPTY_TRANSACTION_DATA = {
email: '',
@ -104,14 +104,22 @@ export default {
},
async sendTransaction() {
this.loading = true
const result = await communityAPI.send(this.$store.state.sessionId, this.transactionData)
if (result.success) {
this.error = false
this.$emit('update-balance', this.transactionData.amount)
} else {
this.errorResult = result.result.message
this.error = true
}
this.$apollo
.query({
query: sendCoins,
variables: {
sessionId: this.$store.state.sessionId,
...this.transactionData,
},
})
.then(() => {
this.error = false
this.$emit('update-balance', this.transactionData.amount)
})
.catch((err) => {
this.errorResult = err.message
this.error = true
})
this.currentTransactionStep = 2
this.loading = false
},