IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2026-04-06 01:25:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

query donations data in donation info component

Browse Source
This commit is contained in:
Alina Beck 2019-11-12 14:24:32 +03:00
parent 71bcf814db
commit 982a02fc4f
2 changed files with 49 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
webapp/components/DonationInfo/DonationInfo.spec.js
View File

@ -9,7 +9,8 @@ const mockDate = new Date(2019, 11, 6)
global.Date = jest.fn(() => mockDate) global.Date = jest.fn(() => mockDate)
describe('DonationInfo.vue', () => { describe('DonationInfo.vue', () => {
let mocks, propsData let mocks, wrapper
beforeEach(() => { beforeEach(() => {
mocks = { mocks = {
$t: jest.fn(string => string), $t: jest.fn(string => string),
@ -17,13 +18,9 @@ describe('DonationInfo.vue', () => {
locale: () => 'de', locale: () => 'de',
}, },
} }
propsData = {
goal: 50000,
progress: 10000,
}
}) })
const Wrapper = () => mount(DonationInfo, { propsData, mocks, localVue }) const Wrapper = () => mount(DonationInfo, { mocks, localVue })
it('includes a link to the Human Connection donations website', () => { it('includes a link to the Human Connection donations website', () => {
expect( expect(
@ -46,25 +43,37 @@ describe('DonationInfo.vue', () => {
expect(Wrapper().vm.title).toBe('Spenden für Dezember') expect(Wrapper().vm.title).toBe('Spenden für Dezember')
}) })
describe('given german locale', () => { describe('mount with data', () => {
it('creates a label from the given amounts and a translation string', () => { beforeEach(() => {
Wrapper() wrapper = Wrapper()
expect(mocks.$t.mock.calls[1][0]).toBe('donations.amount-of-total') wrapper.setData({ goal: 50000, progress: 10000 })
expect(mocks.$t.mock.calls[1][1]).toStrictEqual({ })
amount: '10.000',
total: '50.000', describe('given german locale', () => {
it('creates a label from the given amounts and a translation string', () => {
expect(mocks.$t).toBeCalledWith(
'donations.amount-of-total',
expect.objectContaining({
amount: '10.000',
total: '50.000',
}),
)
}) })
}) })
})
describe('given english locale', () => { describe('given english locale', () => {
it('creates a label from the given amounts and a translation string', () => { beforeEach(() => {
mocks.$i18n.locale = () => 'en' mocks.$i18n.locale = () => 'en'
Wrapper() })
expect(mocks.$t.mock.calls[1][0]).toBe('donations.amount-of-total')
expect(mocks.$t.mock.calls[1][1]).toStrictEqual({ it('creates a label from the given amounts and a translation string', () => {
amount: '10,000', expect(mocks.$t).toBeCalledWith(
total: '50,000', 'donations.amount-of-total',
expect.objectContaining({
amount: '10,000',
total: '50,000',
}),
)
}) })
}) })
}) })

28
webapp/components/DonationInfo/DonationInfo.vue
View File

@ -8,22 +8,18 @@
</template> </template>
<script> <script>
import { DonationsQuery } from '~/graphql/Donations'
import ProgressBar from '~/components/ProgressBar/ProgressBar.vue' import ProgressBar from '~/components/ProgressBar/ProgressBar.vue'
export default { export default {
components: { components: {
ProgressBar, ProgressBar,
}, },
// TODO: get values from state / database? --> should not be props and not have defaults data() {
props: { return {
goal: { goal: 0,
type: Number, progress: 0,
default: 15000, }
},
progress: {
type: Number,
default: 500,
},
}, },
computed: { computed: {
title() { title() {
@ -38,6 +34,18 @@ export default {
}) })
}, },
}, },
apollo: {
Donations: {
query() {
return DonationsQuery()
},
result({ data: { Donations } }) {
const { goal, progress } = Donations[0]
this.goal = goal
this.progress = progress
},
},
},
} }
</script> </script>