mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
100% coverage of GddTransactionList
This commit is contained in:
Moriz Wahl
parent
8457bcec78
commit
96fb245821
@ -8,9 +8,6 @@ describe('GddSend', () => {
|
||||
|
||||
const mocks = {
|
||||
$t: jest.fn((t) => t),
|
||||
$moment: jest.fn((m) => ({
|
||||
format: () => m,
|
||||
})),
|
||||
$i18n: {
|
||||
locale: jest.fn(() => 'en'),
|
||||
},
|
||||
|
||||
@ -3,13 +3,17 @@ import GddTransactionList from './GddTransactionList'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
const errorHandler = jest.fn()
|
||||
|
||||
localVue.config.errorHandler = errorHandler
|
||||
|
||||
describe('GddTransactionList', () => {
|
||||
let wrapper
|
||||
|
||||
const mocks = {
|
||||
$n: jest.fn((n) => n),
|
||||
$t: jest.fn((t) => t),
|
||||
$moment: jest.fn((m) => m),
|
||||
$d: jest.fn((d) => d),
|
||||
}
|
||||
|
||||
const Wrapper = () => {
|
||||
@ -38,7 +42,7 @@ describe('GddTransactionList', () => {
|
||||
})
|
||||
})
|
||||
|
||||
describe('with transacrions', () => {
|
||||
describe('with transactions', () => {
|
||||
beforeEach(async () => {
|
||||
await wrapper.setProps({
|
||||
transactions: [
|
||||
@ -76,8 +80,164 @@ describe('GddTransactionList', () => {
|
||||
})
|
||||
|
||||
it('renders 4 transactions', () => {
|
||||
console.log(wrapper.html())
|
||||
expect(true).toBeThruthy()
|
||||
expect(wrapper.findAll('div.gdd-transaction-list-item')).toHaveLength(4)
|
||||
})
|
||||
|
||||
describe('send transactions', () => {
|
||||
let transaction
|
||||
beforeEach(() => {
|
||||
transaction = wrapper.findAll('div.gdd-transaction-list-item').at(0)
|
||||
})
|
||||
|
||||
it('has a bi-arrow-left-circle icon', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('bi-arrow-left-circle')
|
||||
})
|
||||
|
||||
it('has text-danger color', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('text-danger')
|
||||
})
|
||||
|
||||
it('shows the amount of transaction', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('19.93')
|
||||
})
|
||||
|
||||
it('has a minus operator', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('-')
|
||||
})
|
||||
|
||||
it('shows the name of the receiver', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain('Bob der Baumeister')
|
||||
})
|
||||
|
||||
it('shows the date of the transaction', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain(
|
||||
'Tue May 25 2021 19:38:13 GMT+0200',
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
describe('creation transactions', () => {
|
||||
let transaction
|
||||
beforeEach(() => {
|
||||
transaction = wrapper.findAll('div.gdd-transaction-list-item').at(1)
|
||||
})
|
||||
|
||||
it('has a bi-gift icon', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('bi-gift')
|
||||
})
|
||||
|
||||
it('has gradido-global-color-accent color', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('gradido-global-color-accent')
|
||||
})
|
||||
|
||||
it('shows the amount of transaction', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('1000')
|
||||
})
|
||||
|
||||
it('has a plus operator', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('+')
|
||||
})
|
||||
|
||||
it('shows the name of the receiver', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain('Gradido Akademie')
|
||||
})
|
||||
|
||||
it('shows the date of the transaction', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain(
|
||||
'Thu Apr 29 2021 17:34:49 GMT+0200',
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
describe('receive transactions', () => {
|
||||
let transaction
|
||||
beforeEach(() => {
|
||||
transaction = wrapper.findAll('div.gdd-transaction-list-item').at(2)
|
||||
})
|
||||
|
||||
it('has a bi-arrow-right-circle icon', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('bi-arrow-right-circle')
|
||||
})
|
||||
|
||||
it('has gradido-global-color-accent color', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('gradido-global-color-accent')
|
||||
})
|
||||
|
||||
it('shows the amount of transaction', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('314.98')
|
||||
})
|
||||
|
||||
it('has a plus operator', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('+')
|
||||
})
|
||||
|
||||
it('shows the name of the receiver', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain('Jan Ulrich')
|
||||
})
|
||||
|
||||
it('shows the date of the transaction', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toContain(
|
||||
'Thu Apr 29 2021 19:26:40 GMT+0200',
|
||||
)
|
||||
})
|
||||
})
|
||||
|
||||
describe('decay transactions', () => {
|
||||
let transaction
|
||||
beforeEach(() => {
|
||||
transaction = wrapper.findAll('div.gdd-transaction-list-item').at(3)
|
||||
})
|
||||
|
||||
it('has a bi-droplet-half icon', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('bi-droplet-half')
|
||||
})
|
||||
|
||||
it('has gradido-global-color-gray color', () => {
|
||||
expect(transaction.find('svg').classes()).toContain('gradido-global-color-gray')
|
||||
})
|
||||
|
||||
it('shows the amount of transaction', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('1.07')
|
||||
})
|
||||
|
||||
it('has a minus operator', () => {
|
||||
expect(transaction.findAll('div').at(2).text()).toContain('-')
|
||||
})
|
||||
|
||||
it('shows the name of the receiver', () => {
|
||||
expect(transaction.findAll('div').at(3).text()).toBe('decay')
|
||||
})
|
||||
})
|
||||
|
||||
describe('max property set to 2', () => {
|
||||
beforeEach(async () => {
|
||||
await wrapper.setProps({ max: 2 })
|
||||
})
|
||||
|
||||
it('shows only 2 transactions', () => {
|
||||
expect(wrapper.findAll('div.gdd-transaction-list-item')).toHaveLength(2)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('with invalid transaction type', () => {
|
||||
beforeEach(async () => {
|
||||
await wrapper.setProps({
|
||||
transactions: [
|
||||
{
|
||||
balance: '19.93',
|
||||
date: '2021-05-25T17:38:13+00:00',
|
||||
memo: 'Alles Gute zum Geburtstag',
|
||||
name: 'Bob der Baumeister',
|
||||
transaction_id: 29,
|
||||
type: 'invalid',
|
||||
},
|
||||
],
|
||||
})
|
||||
})
|
||||
|
||||
it('throws an error', () => {
|
||||
expect(errorHandler).toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@ -6,17 +6,16 @@
|
||||
:key="item.id"
|
||||
style="background-color: #ebebeba3 !important"
|
||||
>
|
||||
<div class="d-flex" v-b-toggle="'a' + item.date + ''">
|
||||
<div class="d-flex gdd-transaction-list-item" v-b-toggle="'a' + item.date + ''">
|
||||
<div style="width: 8%">
|
||||
<b-icon :icon="getIcon(item)" :class="getClass(item)" />
|
||||
<b-icon :icon="getProperties(item).icon" :class="getProperties(item).class" />
|
||||
</div>
|
||||
<div class="font1_2em pr-2 text-right" style="width: 32%">
|
||||
<span>{{ getOperator(item) }}</span>
|
||||
<span>{{ getProperties(item).operator }}</span>
|
||||
{{ $n(item.balance, 'decimal') }}
|
||||
</div>
|
||||
<div class="font1_2em text-left pl-2" style="width: 55%">
|
||||
{{ item.name }}
|
||||
<small>{{ item.name ? '' : $t('decay') }}</small>
|
||||
{{ item.name ? item.name : $t('decay') }}
|
||||
<div v-if="item.date" class="text-sm">{{ $d($moment(item.date), 'long') }}</div>
|
||||
</div>
|
||||
<div class="text-right" style="width: 5%">
|
||||
@ -100,21 +99,16 @@ export default {
|
||||
updateTransactions() {
|
||||
this.$emit('update-transactions')
|
||||
},
|
||||
getIcon(item) {
|
||||
const icon = iconsByType[item.type]
|
||||
if (icon) return icon.icon
|
||||
getProperties(item) {
|
||||
const type = iconsByType[item.type]
|
||||
if (type)
|
||||
return {
|
||||
icon: type.icon,
|
||||
class: type.classes + ' m-mb-1 font2em',
|
||||
operator: type.operator,
|
||||
}
|
||||
this.throwError('no icon to given type')
|
||||
},
|
||||
getClass(item) {
|
||||
const icon = iconsByType[item.type]
|
||||
if (icon) return icon.classes + ' m-mb-1 font2em'
|
||||
this.throwError('no class to given type')
|
||||
},
|
||||
getOperator(item) {
|
||||
const icon = iconsByType[item.type]
|
||||
if (icon) return icon.operator
|
||||
this.throwError('no operator to given type')
|
||||
},
|
||||
throwError(msg) {
|
||||
throw new Error(msg)
|
||||
},
|
||||
|
||||
@ -17,6 +17,8 @@ import VueQrcode from 'vue-qrcode'
|
||||
import BaseHeader from '@/components/BaseHeader'
|
||||
import StatsCard from '@/components/Cards/StatsCard.vue'
|
||||
|
||||
import VueMoment from 'vue-moment'
|
||||
|
||||
import clickOutside from '@/directives/click-ouside.js'
|
||||
|
||||
global.localVue = createLocalVue()
|
||||
@ -37,6 +39,7 @@ global.localVue.use(Notifications)
|
||||
global.localVue.use(SideBar)
|
||||
global.localVue.use(VueRouter)
|
||||
global.localVue.use(VueQrcode)
|
||||
global.localVue.use(VueMoment)
|
||||
global.localVue.component(BaseInput.name, BaseInput)
|
||||
global.localVue.component('validation-provider', ValidationProvider)
|
||||
global.localVue.component('validation-observer', ValidationObserver)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user