mirror of
https://github.com/IT4Change/gradido.git
synced 2026-02-06 09:56:05 +00:00
* fix(frontend): post migration fixes * fix(frontend): align with stylelint * fix(frontend): fix tests and dashboard layout * feat(frontend): add link to transactions * feat(frontend): remove unused code * feat(frontend): let dynamic keys in translations * feat(frontend): fix stylelint * feat(frontend): add missing styles for breadcrumb --------- Co-authored-by: einhornimmond <dario.rekowski@gmx.de>
480 lines
15 KiB
JavaScript
480 lines
15 KiB
JavaScript
// import { mount } from '@vue/test-utils'
|
|
// import Transaction from './Transaction'
|
|
// import Vue from 'vue'
|
|
// import flushPromises from 'flush-promises'
|
|
//
|
|
// const localVue = global.localVue
|
|
//
|
|
// const consoleErrorMock = jest.fn()
|
|
//
|
|
// describe('Transaction', () => {
|
|
// let wrapper
|
|
//
|
|
// const mocks = {
|
|
// $i18n: {
|
|
// locale: 'en',
|
|
// },
|
|
// $t: jest.fn((t) => t),
|
|
// $n: jest.fn((n) => n),
|
|
// $d: jest.fn((d) => d),
|
|
// }
|
|
//
|
|
// const Wrapper = () => {
|
|
// return mount(Transaction, { localVue, mocks })
|
|
// }
|
|
//
|
|
// describe('mount', () => {
|
|
// beforeEach(() => {
|
|
// wrapper = Wrapper()
|
|
// })
|
|
//
|
|
// it('renders the component', () => {
|
|
// expect(wrapper.find('div.gdt-transaction-list').exists()).toBeTruthy()
|
|
// })
|
|
//
|
|
// it('has a collapse icon bi-arrow-down-circle', () => {
|
|
// expect(wrapper.find('div.gdt-transaction-list').findAll('svg').at(1).classes()).toEqual([
|
|
// 'bi-arrow-down-circle',
|
|
// 'h1',
|
|
// 'b-icon',
|
|
// 'bi',
|
|
// 'text-muted',
|
|
// ])
|
|
// })
|
|
//
|
|
// describe('no valid GDT entry type', () => {
|
|
// beforeEach(async () => {
|
|
// // disable throwing Errors on warnings to catch the warning
|
|
// Vue.config.warnHandler = (w) => {}
|
|
// // eslint-disable-next-line no-console
|
|
// console.error = consoleErrorMock
|
|
// await wrapper.setProps({ gdtEntryType: 'NOT_VALID' })
|
|
// })
|
|
//
|
|
// it('throws an error', () => {
|
|
// expect(consoleErrorMock).toBeCalledWith(
|
|
// expect.objectContaining({ message: 'no lines for this type: NOT_VALID' }),
|
|
// )
|
|
// })
|
|
// })
|
|
//
|
|
// describe('default entry type FORM', () => {
|
|
// beforeEach(async () => {
|
|
// await wrapper.setProps({
|
|
// amount: 100,
|
|
// date: '2021-05-02T17:20:11+00:00',
|
|
// comment: 'This is a comment',
|
|
// factor: 17,
|
|
// gdt: 1700,
|
|
// id: 42,
|
|
// })
|
|
// })
|
|
//
|
|
// it('has the heart icon', () => {
|
|
// expect(wrapper.find('svg.bi-heart').exists()).toBeTruthy()
|
|
// })
|
|
//
|
|
// it('has the description gdt.contribution', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.contribution')
|
|
// })
|
|
//
|
|
// it('renders the amount of euros', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('100 €')
|
|
// })
|
|
//
|
|
// it('renders the amount of GDT', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('1700 GDT')
|
|
// })
|
|
//
|
|
// it.skip('renders the comment message', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('This is a comment')
|
|
// })
|
|
//
|
|
// it.skip('renders the date', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('Sun May 02 2021')
|
|
// })
|
|
//
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBeFalsy()
|
|
// })
|
|
//
|
|
// describe('without comment', () => {
|
|
// it('does not render the message row', async () => {
|
|
// await wrapper.setProps({ comment: undefined })
|
|
// expect(wrapper.findAll('div.row').at(1).text()).toContain('gdt.calculation')
|
|
// })
|
|
// })
|
|
// // how to open the collapse ?????
|
|
// describe.skip('collapse is open', () => {
|
|
// beforeEach(async () => {
|
|
// await wrapper.find('div#gdt-collapse-42').trigger('click')
|
|
// await wrapper.vm.$nextTick()
|
|
// await flushPromises()
|
|
// await wrapper.vm.$nextTick()
|
|
// await flushPromises()
|
|
// })
|
|
//
|
|
// it('shows the collapse', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBeTruthy()
|
|
// })
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.CVS', () => {
|
|
// it('behaves as default FORM', async () => {
|
|
// await wrapper.setProps({ gdtEntryType: 'CVS' })
|
|
// expect(wrapper.find('svg.bi-heart').exists()).toBeTruthy()
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.ELOPAGE', () => {
|
|
// it('behaves as default FORM', async () => {
|
|
// await wrapper.setProps({ gdtEntryType: 'ELOPAGE' })
|
|
// expect(wrapper.find('svg.bi-heart').exists()).toBeTruthy()
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.DIGISTORE', () => {
|
|
// it('behaves as default FORM', async () => {
|
|
// await wrapper.setProps({ gdtEntryType: 'DIGISTORE' })
|
|
// expect(wrapper.find('svg.bi-heart').exists()).toBeTruthy()
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.CVS2', () => {
|
|
// it('behaves as default FORM', async () => {
|
|
// await wrapper.setProps({ gdtEntryType: 'CVS2' })
|
|
// expect(wrapper.find('svg.bi-heart').exists()).toBeTruthy()
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.ELOPAGE_PUBLISHER', () => {
|
|
// beforeEach(async () => {
|
|
// await wrapper.setProps({
|
|
// amount: 365.67,
|
|
// date: '2020-04-10T13:28:00+00:00',
|
|
// comment: 'This is a comment',
|
|
// gdtEntryType: 'ELOPAGE_PUBLISHER',
|
|
// factor: 22,
|
|
// gdt: 967.65,
|
|
// id: 42,
|
|
// })
|
|
// })
|
|
//
|
|
// it('has the person-check icon', () => {
|
|
// expect(wrapper.find('svg.bi-person-check').exists()).toBeTruthy()
|
|
// })
|
|
//
|
|
// it('has the description gdt.recruited-member', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.recruited-member')
|
|
// })
|
|
//
|
|
// it('renders the percentage', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('5%')
|
|
// })
|
|
//
|
|
// it('renders the amount of GDT', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('365.67 GDT')
|
|
// })
|
|
//
|
|
// it('renders the gdt.publisher', () => {
|
|
// expect(wrapper.findAll('div.row').at(1).text()).toContain('gdt.publisher')
|
|
// })
|
|
//
|
|
// it.skip('renders the date', () => {
|
|
// expect(wrapper.findAll('div.row').at(2).text()).toContain('Fri Apr 10 2020')
|
|
// })
|
|
//
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBeFalsy()
|
|
// })
|
|
//
|
|
// describe.skip('without comment', () => {
|
|
// it('does not render the message row', async () => {
|
|
// await wrapper.setProps({ comment: undefined })
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('form.date')
|
|
// })
|
|
// })
|
|
// })
|
|
//
|
|
// describe('GdtEntryType.GLOBAL_MODIFICATOR', () => {
|
|
// beforeEach(async () => {
|
|
// await wrapper.setProps({
|
|
// amount: 123.45,
|
|
// date: '2020-03-12T13:28:00+00:00',
|
|
// comment: 'This is a comment',
|
|
// gdtEntryType: 'GLOBAL_MODIFICATOR',
|
|
// factor: 19,
|
|
// gdt: 61.23,
|
|
// id: 42,
|
|
// })
|
|
// })
|
|
//
|
|
// it('has the gift icon', () => {
|
|
// expect(wrapper.find('svg.bi-gift').exists()).toBeTruthy()
|
|
// })
|
|
//
|
|
// it('has the description gdt.gdt-received', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.gdt-received')
|
|
// })
|
|
//
|
|
// it('renders the comment', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('This is a comment')
|
|
// })
|
|
//
|
|
// it('renders the amount of GDT', () => {
|
|
// expect(wrapper.findAll('div.row').at(0).text()).toContain('61.23 GDT')
|
|
// })
|
|
//
|
|
// it('renders the gdt.conversion-gdt-euro', () => {
|
|
// expect(wrapper.findAll('div.row').at(1).text()).toContain('gdt.conversion-gdt-euro')
|
|
// })
|
|
//
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBeFalsy()
|
|
// })
|
|
// })
|
|
// })
|
|
// })
|
|
|
|
import { mount } from '@vue/test-utils'
|
|
import { describe, it, expect, beforeEach, vi } from 'vitest'
|
|
import Transaction from './Transaction'
|
|
import { nextTick } from 'vue'
|
|
import { BAvatar, BCol, BCollapse, BRow } from 'bootstrap-vue-next'
|
|
import TransactionCollapse from '@/components/TransactionCollapse.vue'
|
|
import { GdtEntryType } from '@/graphql/enums'
|
|
import VariantIcon from '@/components/VariantIcon.vue'
|
|
import { createStore } from 'vuex'
|
|
|
|
const mockToastError = vi.fn()
|
|
vi.mock('@/composables/useToast', () => ({
|
|
useAppToast: vi.fn(() => ({
|
|
toastError: mockToastError,
|
|
})),
|
|
}))
|
|
|
|
// Mock useI18n
|
|
vi.mock('vue-i18n', () => ({
|
|
useI18n: () => ({
|
|
t: (key) => key,
|
|
n: (value) => value?.toString() ?? '',
|
|
d: (value) => value?.toString() ?? '',
|
|
}),
|
|
}))
|
|
|
|
describe('Transaction', () => {
|
|
let wrapper
|
|
|
|
const Wrapper = () => {
|
|
return mount(Transaction, {
|
|
global: {
|
|
plugins: [
|
|
createStore({
|
|
state: {
|
|
transactionToHighlightId: '',
|
|
},
|
|
}),
|
|
],
|
|
mocks: {
|
|
$d: (value) => value?.toString() ?? '',
|
|
$n: (value) => value?.toString() ?? '',
|
|
$t: (value) => value?.toString() ?? '',
|
|
},
|
|
stubs: {
|
|
BRow,
|
|
BCol,
|
|
BAvatar,
|
|
BCollapse,
|
|
VariantIcon,
|
|
},
|
|
},
|
|
})
|
|
}
|
|
|
|
describe('mount', () => {
|
|
beforeEach(() => {
|
|
wrapper = Wrapper()
|
|
})
|
|
|
|
it('renders the component', () => {
|
|
expect(wrapper.find('div.gdt-transaction-list').exists()).toBe(true)
|
|
})
|
|
|
|
it('has a collapse icon bi-arrow-down-circle', () => {
|
|
expect(wrapper.find('ibiarrowdowncircle').exists()).toBe(true)
|
|
})
|
|
|
|
describe('no valid GDT entry type', () => {
|
|
it('throws an error for invalid gdtEntryType', async () => {
|
|
const wrapper = mount(TransactionCollapse, {
|
|
props: {
|
|
amount: 100,
|
|
gdt: 110,
|
|
factor: 22,
|
|
gdtEntryType: GdtEntryType.FORM,
|
|
},
|
|
global: {
|
|
mocks: {
|
|
$t: (msg) => msg,
|
|
$n: (n) => n,
|
|
},
|
|
},
|
|
})
|
|
|
|
await expect(async () => {
|
|
await wrapper.setProps({ gdtEntryType: 'NOT_VALID' })
|
|
}).rejects.toThrow('no additional transaction info for this type: NOT_VALID')
|
|
})
|
|
})
|
|
|
|
describe('default entry type FORM', () => {
|
|
beforeEach(async () => {
|
|
await wrapper.setProps({
|
|
amount: 100,
|
|
date: '2021-05-02T17:20:11+00:00',
|
|
comment: 'This is a comment',
|
|
factor: 17,
|
|
gdt: 1700,
|
|
id: 42,
|
|
})
|
|
})
|
|
|
|
it('has the heart icon', () => {
|
|
expect(wrapper.find('ibiheart').exists()).toBe(true)
|
|
})
|
|
|
|
it('has the description gdt.contribution', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.contribution')
|
|
})
|
|
|
|
it('renders the amount of euros', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('100 €')
|
|
})
|
|
|
|
it('renders the amount of GDT', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('1700 GDT')
|
|
})
|
|
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBe(false)
|
|
// })
|
|
|
|
describe('without comment', () => {
|
|
it('does not render the message row', async () => {
|
|
await wrapper.setProps({ comment: undefined })
|
|
expect(wrapper.findAll('div.row').at(1).text()).toContain('gdt.calculation')
|
|
})
|
|
})
|
|
|
|
describe('collapse is open', () => {
|
|
beforeEach(async () => {
|
|
await wrapper.find('.list-group').trigger('click')
|
|
await nextTick()
|
|
})
|
|
|
|
it('shows the collapse', () => {
|
|
expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBe(true)
|
|
})
|
|
})
|
|
})
|
|
|
|
describe('GdtEntryType.CVS', () => {
|
|
it('behaves as default FORM', async () => {
|
|
await wrapper.setProps({ gdtEntryType: 'CVS' })
|
|
expect(wrapper.find('ibiheart').exists()).toBe(true)
|
|
})
|
|
})
|
|
|
|
describe('GdtEntryType.ELOPAGE', () => {
|
|
it('behaves as default FORM', async () => {
|
|
await wrapper.setProps({ gdtEntryType: 'ELOPAGE' })
|
|
expect(wrapper.find('ibiheart').exists()).toBe(true)
|
|
})
|
|
})
|
|
|
|
describe('GdtEntryType.DIGISTORE', () => {
|
|
it('behaves as default FORM', async () => {
|
|
await wrapper.setProps({ gdtEntryType: 'DIGISTORE' })
|
|
expect(wrapper.find('ibiheart').exists()).toBe(true)
|
|
})
|
|
})
|
|
|
|
describe('GdtEntryType.CVS2', () => {
|
|
it('behaves as default FORM', async () => {
|
|
await wrapper.setProps({ gdtEntryType: 'CVS2' })
|
|
expect(wrapper.find('ibiheart').exists()).toBe(true)
|
|
})
|
|
})
|
|
|
|
describe('GdtEntryType.ELOPAGE_PUBLISHER', () => {
|
|
beforeEach(async () => {
|
|
await wrapper.setProps({
|
|
amount: 365.67,
|
|
date: '2020-04-10T13:28:00+00:00',
|
|
comment: 'This is a comment',
|
|
gdtEntryType: 'ELOPAGE_PUBLISHER',
|
|
factor: 22,
|
|
gdt: 967.65,
|
|
id: 42,
|
|
})
|
|
})
|
|
|
|
it('has the person-check icon', () => {
|
|
expect(wrapper.find('ibipersoncheck').exists()).toBe(true)
|
|
})
|
|
|
|
it('has the description gdt.recruited-member', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.recruited-member')
|
|
})
|
|
|
|
it('renders the percentage', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('5%')
|
|
})
|
|
|
|
it('renders the amount of GDT', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('365.67 GDT')
|
|
})
|
|
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBe(false)
|
|
// })
|
|
})
|
|
|
|
describe('GdtEntryType.GLOBAL_MODIFICATOR', () => {
|
|
beforeEach(async () => {
|
|
await wrapper.setProps({
|
|
amount: 123.45,
|
|
date: '2020-03-12T13:28:00+00:00',
|
|
comment: 'This is a comment',
|
|
gdtEntryType: 'GLOBAL_MODIFICATOR',
|
|
factor: 19,
|
|
gdt: 61.23,
|
|
id: 42,
|
|
})
|
|
wrapper.attachTo = document.body
|
|
})
|
|
|
|
it('has the gift icon', () => {
|
|
expect(wrapper.find('ibigift').exists()).toBe(true)
|
|
})
|
|
|
|
it('has the description gdt.gdt-received', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('gdt.gdt-received')
|
|
})
|
|
|
|
it('renders the comment', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('This is a comment')
|
|
})
|
|
|
|
it('renders the amount of GDT', () => {
|
|
expect(wrapper.findAll('div.row').at(0).text()).toContain('61.23 GDT')
|
|
})
|
|
|
|
// it('does not show the collapse by default', () => {
|
|
// expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBe(false)
|
|
// })
|
|
})
|
|
})
|
|
})
|