fix edit contribution formular, remove unused methods

This commit is contained in:
Moriz Wahl 2023-03-10 14:08:08 +01:00
parent e07da27414
commit edd42f02ed
5 changed files with 76 additions and 85 deletions

View File

@ -1,19 +1,18 @@
import { mount } from '@vue/test-utils' import { mount } from '@vue/test-utils'
import EditCreationFormular from './EditCreationFormular' import EditCreationFormular from './EditCreationFormular'
import { toastErrorSpy, toastSuccessSpy } from '../../test/testSetup' import { toastErrorSpy, toastSuccessSpy } from '../../test/testSetup'
import VueApollo from 'vue-apollo'
import { createMockClient } from 'mock-apollo-client'
import { adminOpenCreations } from '../graphql/adminOpenCreations'
import { adminUpdateContribution } from '../graphql/adminUpdateContribution'
const mockClient = createMockClient()
const apolloProvider = new VueApollo({
defaultClient: mockClient,
})
const localVue = global.localVue const localVue = global.localVue
localVue.use(VueApollo)
const apolloMutateMock = jest.fn().mockResolvedValue({
data: {
adminUpdateContribution: {
creation: [0, 0, 0],
amount: 500,
date: new Date(),
memo: 'Test Schöpfung 2',
},
},
})
const stateCommitMock = jest.fn() const stateCommitMock = jest.fn()
@ -23,22 +22,18 @@ const mocks = {
const date = new Date(d) const date = new Date(d)
return date.toISOString().split('T')[0] return date.toISOString().split('T')[0]
}), }),
$apollo: {
mutate: apolloMutateMock,
},
$store: { $store: {
commit: stateCommitMock, commit: stateCommitMock,
}, },
} }
const now = new Date(Date.now()) const now = new Date()
const getCreationDate = (sub) => { const getCreationDate = (sub) => {
const date = sub === 0 ? now : new Date(now.getFullYear(), now.getMonth() - sub, 1, 0) const date = sub === 0 ? now : new Date(now.getFullYear(), now.getMonth() - sub, 1, 0)
return date.toISOString().split('T')[0] return date.toISOString().split('T')[0]
} }
const propsData = { const propsData = {
creation: [200, 400, 600],
creationUserData: { creationUserData: {
memo: 'Test schöpfung 1', memo: 'Test schöpfung 1',
amount: 100, amount: 100,
@ -46,20 +41,65 @@ const propsData = {
}, },
item: { item: {
id: 0, id: 0,
email: 'bob@baumeister.de', amount: '300',
contributionDate: `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate()}`,
}, },
} }
const data = () => {
return { creation: ['1000', '1000', '400'] }
}
describe('EditCreationFormular', () => { describe('EditCreationFormular', () => {
let wrapper let wrapper
const adminUpdateContributionMock = jest.fn()
const adminOpenCreationsMock = jest.fn()
mockClient.setRequestHandler(
adminOpenCreations,
adminOpenCreationsMock.mockResolvedValue({
data: {
adminOpenCreations: [
{
month: new Date(now.getFullYear(), now.getMonth() - 2).getMonth(),
year: new Date(now.getFullYear(), now.getMonth() - 2).getFullYear(),
amount: '1000',
},
{
month: new Date(now.getFullYear(), now.getMonth() - 1).getMonth(),
year: new Date(now.getFullYear(), now.getMonth() - 1).getFullYear(),
amount: '1000',
},
{
month: now.getMonth(),
year: now.getFullYear(),
amount: '400',
},
],
},
}),
)
mockClient.setRequestHandler(
adminUpdateContribution,
adminUpdateContributionMock.mockResolvedValue({
data: {
adminUpdateContribution: {
amount: '600',
date: new Date(),
memo: 'This is my memo',
},
},
}),
)
const Wrapper = () => { const Wrapper = () => {
return mount(EditCreationFormular, { localVue, mocks, propsData }) return mount(EditCreationFormular, { localVue, mocks, propsData, data, apolloProvider })
} }
describe('mount', () => { describe('mount', () => {
beforeEach(() => { beforeEach(async () => {
wrapper = Wrapper() wrapper = Wrapper()
await wrapper.vm.$nextTick()
}) })
it('has a DIV element with the class.component-edit-creation-formular', () => { it('has a DIV element with the class.component-edit-creation-formular', () => {
@ -89,42 +129,16 @@ describe('EditCreationFormular', () => {
}) })
it('calls the API', () => { it('calls the API', () => {
expect(apolloMutateMock).toBeCalledWith( expect(adminUpdateContributionMock).toBeCalledWith({
expect.objectContaining({
variables: {
id: 0, id: 0,
email: 'bob@baumeister.de',
creationDate: getCreationDate(0), creationDate: getCreationDate(0),
amount: 500, amount: 500,
memo: 'Test Schöpfung 2', memo: 'Test Schöpfung 2',
},
}),
)
}) })
it('emits update-user-data', () => {
expect(wrapper.emitted('update-user-data')).toEqual([
[
{
id: 0,
email: 'bob@baumeister.de',
},
[0, 0, 0],
],
])
}) })
it('emits update-creation-data', () => { it('emits update-creation-data', () => {
expect(wrapper.emitted('update-creation-data')).toEqual([ expect(wrapper.emitted('update-creation-data')).toBeTruthy()
[
{
amount: 500,
date: expect.any(Date),
memo: 'Test Schöpfung 2',
row: expect.any(Object),
},
],
])
}) })
it('toasts a success message', () => { it('toasts a success message', () => {
@ -134,7 +148,7 @@ describe('EditCreationFormular', () => {
describe('change and save memo and value with error', () => { describe('change and save memo and value with error', () => {
beforeEach(async () => { beforeEach(async () => {
apolloMutateMock.mockRejectedValue({ message: 'Oh no!' }) adminUpdateContributionMock.mockRejectedValue({ message: 'Oh no!' })
await wrapper.find('input[type="number"]').setValue(500) await wrapper.find('input[type="number"]').setValue(500)
await wrapper.find('textarea').setValue('Test Schöpfung 2') await wrapper.find('textarea').setValue('Test Schöpfung 2')
await wrapper.find('.test-submit').trigger('click') await wrapper.find('.test-submit').trigger('click')

View File

@ -108,6 +108,7 @@ export default {
}, },
methods: { methods: {
submitCreation() { submitCreation() {
// console.log('submitCreation', this.selected)
this.$apollo this.$apollo
.mutate({ .mutate({
mutation: adminUpdateContribution, mutation: adminUpdateContribution,
@ -119,12 +120,7 @@ export default {
}, },
}) })
.then((result) => { .then((result) => {
this.$emit('update-creation-data', { this.$emit('update-creation-data')
amount: Number(result.data.adminUpdateContribution.amount),
date: result.data.adminUpdateContribution.date,
memo: result.data.adminUpdateContribution.memo,
row: this.row,
})
this.toastSuccess( this.toastSuccess(
this.$t('creation_form.toasted_update', { this.$t('creation_form.toasted_update', {
value: this.value, value: this.value,
@ -151,7 +147,9 @@ export default {
computed: { computed: {
creationIndex() { creationIndex() {
const month = this.$d(new Date(this.item.contributionDate), 'month') const month = this.$d(new Date(this.item.contributionDate), 'month')
return this.radioOptions.findIndex((obj) => obj.item.short === month) return this.radioOptions.findIndex((obj) => {
return obj.item.short === month
})
}, },
selectedComputed() { selectedComputed() {
return this.radioOptions[this.creationIndex].item return this.radioOptions[this.creationIndex].item

View File

@ -17,7 +17,7 @@ const propsData = {
amount: 300, amount: 300,
memo: 'Aktives Grundeinkommen für Januar 2022', memo: 'Aktives Grundeinkommen für Januar 2022',
date: '2022-01-01T00:00:00.000Z', date: '2022-01-01T00:00:00.000Z',
moderator: 1, moderatorId: 1,
creation: [700, 1000, 1000], creation: [700, 1000, 1000],
__typename: 'PendingCreation', __typename: 'PendingCreation',
}, },
@ -29,7 +29,7 @@ const propsData = {
amount: 210, amount: 210,
memo: 'Aktives Grundeinkommen für Januar 2022', memo: 'Aktives Grundeinkommen für Januar 2022',
date: '2022-01-01T00:00:00.000Z', date: '2022-01-01T00:00:00.000Z',
moderator: null, moderatorId: null,
creation: [790, 1000, 1000], creation: [790, 1000, 1000],
__typename: 'PendingCreation', __typename: 'PendingCreation',
}, },
@ -41,7 +41,7 @@ const propsData = {
amount: 330, amount: 330,
memo: 'Aktives Grundeinkommen für Januar 2022', memo: 'Aktives Grundeinkommen für Januar 2022',
date: '2022-01-01T00:00:00.000Z', date: '2022-01-01T00:00:00.000Z',
moderator: 1, moderatorId: 1,
creation: [670, 1000, 1000], creation: [670, 1000, 1000],
__typename: 'PendingCreation', __typename: 'PendingCreation',
}, },

View File

@ -96,7 +96,7 @@
:item="row.item" :item="row.item"
:row="row" :row="row"
:creationUserData="creationUserData" :creationUserData="creationUserData"
@update-creation-data="updateCreationData" @update-creation-data="$emit('update-contributions')"
/> />
</div> </div>
<div v-else> <div v-else>
@ -145,16 +145,6 @@ export default {
required: true, required: true,
}, },
}, },
data() {
return {
creationUserData: {
amount: null,
date: null,
memo: null,
moderator: null,
},
}
},
methods: { methods: {
myself(item) { myself(item) {
return ( return (
@ -173,16 +163,6 @@ export default {
if (item.state === 'IN_PROGRESS') return 'table-primary' if (item.state === 'IN_PROGRESS') return 'table-primary'
if (item.state === 'PENDING') return 'table-primary' if (item.state === 'PENDING') return 'table-primary'
}, },
updateCreationData(data) {
const row = data.row
this.$emit('update-contributions', data)
delete data.row
this.creationUserData = { ...this.creationUserData, ...data }
row.toggleDetails()
},
updateUserData(rowItem, newCreation) {
rowItem.creation = newCreation
},
updateState(id) { updateState(id) {
this.$emit('update-state', id) this.$emit('update-state', id)
}, },

View File

@ -6,7 +6,6 @@ export const adminUpdateContribution = gql`
amount amount
date date
memo memo
creation
} }
} }
` `