diff --git a/frontend/src/components/ClipboardCopy.vue b/frontend/src/components/ClipboardCopy.vue index 239eddfb7..b952dbd8c 100644 --- a/frontend/src/components/ClipboardCopy.vue +++ b/frontend/src/components/ClipboardCopy.vue @@ -28,8 +28,8 @@ export default { .then(() => { this.toastSuccess(this.$t('gdd_per_link.link-copied')) }) - .catch((err) => { - this.toastError(this.$t('gdd_per_link.not-copied', { err })) + .catch(() => { + this.toastError(this.$t('gdd_per_link.not-copied')) }) }, }, diff --git a/frontend/src/components/GddSend/TransactionConfirmationLink.spec.js b/frontend/src/components/GddSend/TransactionConfirmationLink.spec.js index 9aa74b574..a28c2d185 100644 --- a/frontend/src/components/GddSend/TransactionConfirmationLink.spec.js +++ b/frontend/src/components/GddSend/TransactionConfirmationLink.spec.js @@ -11,7 +11,6 @@ describe('GddSend confirm', () => { $i18n: { locale: jest.fn(() => 'en'), }, - $n: jest.fn((n) => String(n)), } const propsData = { diff --git a/frontend/src/components/GddSend/TransactionConfirmationLink.vue b/frontend/src/components/GddSend/TransactionConfirmationLink.vue index f357ea654..b8bc2700a 100644 --- a/frontend/src/components/GddSend/TransactionConfirmationLink.vue +++ b/frontend/src/components/GddSend/TransactionConfirmationLink.vue @@ -4,7 +4,7 @@
{{ $t('gdd_per_link.header') }}
-

− {{ $n(amount, 'decimal') }} GDD

+

{{ (amount * -1) | GDD }}

{{ memo }} @@ -20,7 +20,7 @@ {{ $t('form.your_amount') }} - − {{ $n(amount, 'decimal') }} GDD + {{ (amount * -1) | GDD }} @@ -28,12 +28,12 @@ Vergänglichkeit für 14 Tage - ~ {{ $n(amount * 0.028, 'decimal') }} + ~ {{ (amount * 0.028 * -1) | GDD }} {{ $t('form.new_balance') }} - ~ {{ $n(balance - amount - amount * 0.028, 'decimal') }} + ~ {{ (balance - amount - amount * 0.028) | GDD }} diff --git a/frontend/src/components/GddSend/TransactionConfirmationSend.spec.js b/frontend/src/components/GddSend/TransactionConfirmationSend.spec.js index a0e334ae5..38dd82866 100644 --- a/frontend/src/components/GddSend/TransactionConfirmationSend.spec.js +++ b/frontend/src/components/GddSend/TransactionConfirmationSend.spec.js @@ -11,7 +11,6 @@ describe('GddSend confirm', () => { $i18n: { locale: jest.fn(() => 'en'), }, - $n: jest.fn((n) => String(n)), } const propsData = { diff --git a/frontend/src/components/GddSend/TransactionConfirmationSend.vue b/frontend/src/components/GddSend/TransactionConfirmationSend.vue index 0bfff3ddb..98cc3b4d8 100644 --- a/frontend/src/components/GddSend/TransactionConfirmationSend.vue +++ b/frontend/src/components/GddSend/TransactionConfirmationSend.vue @@ -18,7 +18,7 @@
GDD
-
− {{ $n(amount, 'decimal') }} GDD
+
{{ (amount * -1) | GDD }}

@@ -44,12 +44,12 @@ {{ $t('form.your_amount') }} - − {{ $n(amount, 'decimal') }} GDD + {{ (amount * -1) | GDD }} {{ $t('form.new_balance') }} - ~ {{ $n(balance - amount, 'decimal') }} + {{ (balance - amount) | GDD }} diff --git a/frontend/src/mixins/toaster.js b/frontend/src/mixins/toaster.js index 4464a2cc9..68fd78ff9 100644 --- a/frontend/src/mixins/toaster.js +++ b/frontend/src/mixins/toaster.js @@ -13,7 +13,7 @@ export const toasters = { }) }, toast(message, options) { - message = message.replace(/^GraphQL error: /, '') + if (message.replace) message = message.replace(/^GraphQL error: /, '') this.$bvToast.toast(message, { autoHideDelay: 5000, appendToast: true, diff --git a/frontend/src/pages/Send.spec.js b/frontend/src/pages/Send.spec.js index 24f29ee6b..f7d53a511 100644 --- a/frontend/src/pages/Send.spec.js +++ b/frontend/src/pages/Send.spec.js @@ -1,12 +1,16 @@ import { mount } from '@vue/test-utils' import Send from './Send' -import { toastErrorSpy } from '../../test/testSetup' +import { toastErrorSpy, toastSuccessSpy } from '@test/testSetup' +import { TRANSACTION_STEPS } from '@/components/GddSend.vue' +import { sendCoins, createTransactionLink } from '@/graphql/mutations.js' -const sendCoinsMock = jest.fn() -sendCoinsMock.mockResolvedValue('success') +const apolloMutationMock = jest.fn() +apolloMutationMock.mockResolvedValue('success') -const createTransactionLinkMock = jest.fn() -createTransactionLinkMock.mockResolvedValue('error') +const navigatorClipboardMock = jest.fn() + +// const createTransactionLinkMock = jest.fn() +// createTransactionLinkMock.mockRejectedValue({ message: 'OOPS' }) const localVue = global.localVue @@ -20,6 +24,7 @@ describe('Send', () => { GdtBalance: 1234.56, transactions: [{ balance: 0.1 }], pending: true, + currentTransactionStep: TRANSACTION_STEPS.transactionConfirmationSend, } const mocks = { @@ -31,7 +36,7 @@ describe('Send', () => { }, }, $apollo: { - mutate: sendCoinsMock, + mutate: apolloMutationMock, }, } @@ -49,7 +54,7 @@ describe('Send', () => { }) /* SEND */ - describe('transaction form', () => { + describe('transaction form send', () => { beforeEach(async () => { wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', { email: 'user@example.org', @@ -66,7 +71,7 @@ describe('Send', () => { describe('confirm transaction if selected:send', () => { beforeEach(() => { wrapper.setData({ - currentTransactionStep: 1, + currentTransactionStep: TRANSACTION_STEPS.transactionConfirmationSend, transactionData: { email: 'user@example.org', amount: 23.45, @@ -96,8 +101,9 @@ describe('Send', () => { }) it('calls the API when send-transaction is emitted', async () => { - expect(sendCoinsMock).toBeCalledWith( + expect(apolloMutationMock).toBeCalledWith( expect.objectContaining({ + mutation: sendCoins, variables: { email: 'user@example.org', amount: 23.45, @@ -113,7 +119,7 @@ describe('Send', () => { expect(wrapper.emitted('update-balance')).toEqual([[23.45]]) }) - it('shows the succes page', () => { + it('shows the success page', () => { expect(wrapper.find('div.card-body').text()).toContain('form.send_transaction_success') }) }) @@ -121,7 +127,7 @@ describe('Send', () => { describe('transaction is confirmed and server response is error', () => { beforeEach(async () => { jest.clearAllMocks() - sendCoinsMock.mockRejectedValue({ message: 'recipient not known' }) + apolloMutationMock.mockRejectedValue({ message: 'recipient not known' }) await wrapper .findComponent({ name: 'TransactionConfirmationSend' }) .vm.$emit('send-transaction') @@ -142,51 +148,111 @@ describe('Send', () => { }) /* LINK */ - describe('transaction form', () => { + + describe('transaction form link', () => { beforeEach(async () => { - wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', { - amount: 23.45, - memo: 'Make the best of it!', + apolloMutationMock.mockResolvedValue({ + data: { createTransactionLink: { code: '0123456789' } }, + }) + await wrapper.findComponent({ name: 'TransactionForm' }).vm.$emit('set-transaction', { + amount: 56.78, + memo: 'Make the best of it link!', selected: 'link', }) }) it('steps forward in the dialog', () => { expect(wrapper.findComponent({ name: 'TransactionConfirmationLink' }).exists()).toBe(true) }) - }) - describe('send apollo if transaction link with error', () => { - beforeEach(() => { - createTransactionLinkMock.mockRejectedValue({ message: 'OUCH!' }) - wrapper = Wrapper() - wrapper.find('button.btn-success').trigger('click') - }) + describe('transaction is confirmed and server response is success', () => { + beforeEach(async () => { + jest.clearAllMocks() + await wrapper + .findComponent({ name: 'TransactionConfirmationLink' }) + .vm.$emit('send-transaction') + }) - it('toasts an error message', () => { - expect(toastErrorSpy).toBeCalledWith('unregister_mail.error') - }) - }) + it('calls the API when send-transaction is emitted', async () => { + expect(apolloMutationMock).toBeCalledWith( + expect.objectContaining({ + mutation: createTransactionLink, + variables: { + amount: 56.78, + memo: 'Make the best of it link!', + }, + }), + ) + }) - describe('confirm transaction if selected:link', () => { - beforeEach(() => { - wrapper.setData({ - currentTransactionStep: 1, - transactionData: { - amount: 23.45, - memo: 'Make the best of it!', - selected: 'link', - }, + it.skip('emits update-balance', () => { + expect(wrapper.emitted('update-balance')).toBeTruthy() + expect(wrapper.emitted('update-balance')).toEqual([[56.78]]) + }) + + it('find components ClipBoard', () => { + expect(wrapper.findComponent({ name: 'ClipboardCopy' }).exists()).toBe(true) + }) + + it('shows the success message', () => { + expect(wrapper.find('div.card-body').text()).toContain('gdd_per_link.created') + }) + + it('shows the close button', () => { + expect(wrapper.find('div.card-body').text()).toContain('form.close') + }) + + describe('Copy link to Clipboard', () => { + const navigatorClipboard = navigator.clipboard + beforeAll(() => { + delete navigator.clipboard + navigator.clipboard = { writeText: navigatorClipboardMock } + }) + afterAll(() => { + navigator.clipboard = navigatorClipboard + }) + + describe('copy with success', () => { + beforeEach(async () => { + navigatorClipboardMock.mockResolvedValue() + await wrapper.findAll('button').at(0).trigger('click') + }) + + it('toasts success message', () => { + expect(toastSuccessSpy).toBeCalledWith('gdd_per_link.link-copied') + }) + }) + + describe('copy with error', () => { + beforeEach(async () => { + navigatorClipboardMock.mockRejectedValue() + await wrapper.findAll('button').at(0).trigger('click') + }) + + it('toasts error message', () => { + expect(toastErrorSpy).toBeCalledWith('gdd_per_link.not-copied') + }) + }) + }) + + describe('close button click', () => { + beforeEach(async () => { + await wrapper.findAll('button').at(1).trigger('click') + }) + + it('Shows the TransactionForm', () => { + expect(wrapper.findComponent({ name: 'TransactionForm' }).exists()).toBe(true) + }) }) }) - it('resets the transaction process when on-reset is emitted', async () => { - await wrapper.findComponent({ name: 'TransactionConfirmationSend' }).vm.$emit('on-reset') - expect(wrapper.findComponent({ name: 'TransactionForm' }).exists()).toBeTruthy() - expect(wrapper.vm.transactionData).toEqual({ - email: '', - amount: 23.45, - memo: 'Make the best of it!', - selected: 'link', + describe('send apollo if transaction link with error', () => { + beforeEach(() => { + apolloMutationMock.mockRejectedValue({ message: 'OUCH!' }) + wrapper.find('button.btn-success').trigger('click') + }) + + it('toasts an error message', () => { + expect(toastErrorSpy).toBeCalledWith({ message: 'OUCH!' }) }) }) })