mirror of
https://github.com/IT4Change/gradido.git
synced 2026-02-06 09:56:05 +00:00
fix(frontend): updated tests (#3406)
* feat(frontend): add feedback fixes + map feature fixes * feat(frontend): fetch contribution data networkOnly * feat(frontend): test files updated
This commit is contained in:
MateuszMichalowski
GitHub
parent
b14e84043f
commit
924e0f25df
@ -1,13 +1,24 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest'
|
||||
import CollapseLinksList from './CollapseLinksList'
|
||||
import CollapseLinksList from './CollapseLinksList.vue'
|
||||
import { createStore } from 'vuex'
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import { BButton } from 'bootstrap-vue-next'
|
||||
|
||||
// Mock vue-i18n
|
||||
const mockT = vi.fn((key, value) => `${key} ${value}`)
|
||||
// Mock translations
|
||||
const mockT = vi.fn((key, params) => {
|
||||
switch (key) {
|
||||
case 'link-load':
|
||||
if (params === 0) return '1 more link'
|
||||
return `${params.n} more links`
|
||||
case 'link-load-more':
|
||||
return `Load ${params.n} more links`
|
||||
default:
|
||||
return key
|
||||
}
|
||||
})
|
||||
|
||||
// Mock vue-i18n
|
||||
vi.mock('vue-i18n', () => ({
|
||||
createI18n: vi.fn(() => ({
|
||||
global: {
|
||||
@ -64,6 +75,7 @@ describe('CollapseLinksList', () => {
|
||||
},
|
||||
},
|
||||
props: {
|
||||
modelValue: 1,
|
||||
transactionLinks: [
|
||||
{
|
||||
amount: '5',
|
||||
@ -89,7 +101,6 @@ describe('CollapseLinksList', () => {
|
||||
},
|
||||
],
|
||||
transactionLinkCount: 3,
|
||||
value: 1,
|
||||
pending: false,
|
||||
pageSize: 5,
|
||||
...props,
|
||||
@ -111,8 +122,8 @@ describe('CollapseLinksList', () => {
|
||||
await wrapper.find('.test-button-load-more').trigger('click')
|
||||
})
|
||||
|
||||
it('emits input', () => {
|
||||
expect(wrapper.emitted('input')).toEqual([[2]])
|
||||
it('emits update:modelValue', () => {
|
||||
expect(wrapper.emitted('update:modelValue')).toEqual([[2]])
|
||||
})
|
||||
})
|
||||
|
||||
@ -123,8 +134,8 @@ describe('CollapseLinksList', () => {
|
||||
.vm.$emit('reset-transaction-link-list')
|
||||
})
|
||||
|
||||
it('emits input ', () => {
|
||||
expect(wrapper.emitted('input')).toEqual([[0]])
|
||||
it('emits update:modelValue', () => {
|
||||
expect(wrapper.emitted('update:modelValue')).toEqual([[0]])
|
||||
})
|
||||
})
|
||||
|
||||
@ -138,7 +149,7 @@ describe('CollapseLinksList', () => {
|
||||
})
|
||||
|
||||
it('renders text in singular', () => {
|
||||
expect(mockT).toHaveBeenCalledWith('link-load', 0)
|
||||
expect(wrapper.find('.test-button-load-more').text()).toBe('1 more link')
|
||||
})
|
||||
})
|
||||
|
||||
@ -151,7 +162,7 @@ describe('CollapseLinksList', () => {
|
||||
})
|
||||
|
||||
it('renders text in plural and shows the correct count of links', () => {
|
||||
expect(mockT).toHaveBeenCalledWith('link-load', 0)
|
||||
expect(wrapper.find('.test-button-load-more').text()).toBe('4 more links')
|
||||
})
|
||||
})
|
||||
|
||||
@ -162,11 +173,10 @@ describe('CollapseLinksList', () => {
|
||||
transactionLinks: [{ id: 1 }, { id: 2 }],
|
||||
pageSize: 5,
|
||||
})
|
||||
await wrapper.vm.$nextTick()
|
||||
})
|
||||
|
||||
it('renders text with pageSize as number of links to load', () => {
|
||||
expect(mockT).toHaveBeenCalledWith('link-load-more', { n: 5 })
|
||||
expect(wrapper.find('.test-button-load-more').text()).toBe('Load 5 more links')
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@ -69,12 +69,6 @@ describe('InputUsername', () => {
|
||||
expect(input.props('placeholder')).toBe('Username')
|
||||
})
|
||||
|
||||
it('emits set-is-edit event when button is clicked', async () => {
|
||||
const button = wrapper.findComponent({ name: 'BButton' })
|
||||
await button.trigger('click')
|
||||
expect(wrapper.emitted('set-is-edit')).toBeTruthy()
|
||||
})
|
||||
|
||||
it('shows all errors when showAllErrors prop is true', async () => {
|
||||
const errors = ['Error 1', 'Error 2']
|
||||
vi.mocked(useField).mockReturnValue({
|
||||
|
||||
@ -1,242 +1,3 @@
|
||||
// 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'
|
||||
@ -266,8 +27,11 @@ vi.mock('vue-i18n', () => ({
|
||||
describe('Transaction', () => {
|
||||
let wrapper
|
||||
|
||||
const Wrapper = () => {
|
||||
const createWrapper = (props = {}, options = {}) => {
|
||||
return mount(Transaction, {
|
||||
props: {
|
||||
...props,
|
||||
},
|
||||
global: {
|
||||
plugins: [
|
||||
createStore({
|
||||
@ -285,8 +49,21 @@ describe('Transaction', () => {
|
||||
BRow,
|
||||
BCol,
|
||||
BAvatar,
|
||||
BCollapse,
|
||||
BCollapse: {
|
||||
template: `
|
||||
<div
|
||||
:id="id"
|
||||
class="collapse"
|
||||
:class="{ show: modelValue }"
|
||||
data-test="collapse"
|
||||
>
|
||||
<slot/>
|
||||
</div>
|
||||
`,
|
||||
props: ['id', 'modelValue'],
|
||||
},
|
||||
VariantIcon,
|
||||
...options.stubs,
|
||||
},
|
||||
},
|
||||
})
|
||||
@ -294,7 +71,7 @@ describe('Transaction', () => {
|
||||
|
||||
describe('mount', () => {
|
||||
beforeEach(() => {
|
||||
wrapper = Wrapper()
|
||||
wrapper = createWrapper()
|
||||
})
|
||||
|
||||
it('renders the component', () => {
|
||||
@ -330,7 +107,7 @@ describe('Transaction', () => {
|
||||
|
||||
describe('default entry type FORM', () => {
|
||||
beforeEach(async () => {
|
||||
await wrapper.setProps({
|
||||
wrapper = createWrapper({
|
||||
amount: 100,
|
||||
date: '2021-05-02T17:20:11+00:00',
|
||||
comment: 'This is a comment',
|
||||
@ -356,10 +133,6 @@ describe('Transaction', () => {
|
||||
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 })
|
||||
@ -374,7 +147,10 @@ describe('Transaction', () => {
|
||||
})
|
||||
|
||||
it('shows the collapse', () => {
|
||||
expect(wrapper.find('div#gdt-collapse-42').isVisible()).toBe(true)
|
||||
const collapse = wrapper.find('div#gdt-collapse-42')
|
||||
expect(collapse.exists()).toBe(true)
|
||||
expect(collapse.attributes('data-test')).toBe('collapse')
|
||||
expect(wrapper.find('[data-test="collapse"]').classes()).toContain('show')
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -409,7 +185,7 @@ describe('Transaction', () => {
|
||||
|
||||
describe('GdtEntryType.ELOPAGE_PUBLISHER', () => {
|
||||
beforeEach(async () => {
|
||||
await wrapper.setProps({
|
||||
wrapper = createWrapper({
|
||||
amount: 365.67,
|
||||
date: '2020-04-10T13:28:00+00:00',
|
||||
comment: 'This is a comment',
|
||||
@ -435,15 +211,11 @@ describe('Transaction', () => {
|
||||
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({
|
||||
wrapper = createWrapper({
|
||||
amount: 123.45,
|
||||
date: '2020-03-12T13:28:00+00:00',
|
||||
comment: 'This is a comment',
|
||||
@ -452,7 +224,6 @@ describe('Transaction', () => {
|
||||
gdt: 61.23,
|
||||
id: 42,
|
||||
})
|
||||
wrapper.attachTo = document.body
|
||||
})
|
||||
|
||||
it('has the gift icon', () => {
|
||||
@ -470,10 +241,6 @@ describe('Transaction', () => {
|
||||
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)
|
||||
// })
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest'
|
||||
import { ref } from 'vue'
|
||||
import UserName from './UserName.vue'
|
||||
import { createStore } from 'vuex'
|
||||
import { createI18n } from 'vue-i18n'
|
||||
@ -60,20 +61,22 @@ vi.mock('@/composables/useToast', () => ({
|
||||
}),
|
||||
}))
|
||||
|
||||
const valuesMock = {}
|
||||
const errorsMock = {}
|
||||
// Updated to use Vue's reactivity
|
||||
const valuesMock = ref({ username: '' })
|
||||
const errorsMock = ref({})
|
||||
const setFieldValueMock = vi.fn((field, value) => {
|
||||
valuesMock[field] = value
|
||||
valuesMock.value[field] = value
|
||||
})
|
||||
const handleSubmitMock = vi.fn((callback) => {
|
||||
return () => callback(valuesMock)
|
||||
return () => callback(valuesMock.value)
|
||||
})
|
||||
|
||||
vi.mock('vee-validate', () => ({
|
||||
useForm: () => ({
|
||||
handleSubmit: handleSubmitMock,
|
||||
setFieldValue: setFieldValueMock,
|
||||
values: valuesMock,
|
||||
errors: errorsMock,
|
||||
values: valuesMock.value,
|
||||
errors: errorsMock.value,
|
||||
}),
|
||||
}))
|
||||
|
||||
@ -94,7 +97,7 @@ describe('UserName Form', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks()
|
||||
valuesMock.username = ''
|
||||
valuesMock.value.username = ''
|
||||
wrapper = mountComponent()
|
||||
})
|
||||
|
||||
@ -132,8 +135,13 @@ describe('UserName Form', () => {
|
||||
})
|
||||
|
||||
it('enables submit button when a new username is entered', async () => {
|
||||
setFieldValueMock('username', 'newUser')
|
||||
valuesMock.value.username = 'newUser' // Directly set the reactive value
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
// Trigger input change to ensure reactivity
|
||||
await wrapper.find('[data-test="component-input-username"]').trigger('input')
|
||||
await wrapper.vm.$nextTick()
|
||||
|
||||
expect(wrapper.find('[data-test="submit-username-button"]').exists()).toBe(true)
|
||||
expect(
|
||||
wrapper.find('[data-test="submit-username-button"]').attributes('disabled'),
|
||||
@ -143,7 +151,8 @@ describe('UserName Form', () => {
|
||||
it('submits the form and updates the store on success', async () => {
|
||||
mutationMock.mockResolvedValue({ data: { updateUserInfos: { validValues: 3 } } })
|
||||
|
||||
setFieldValueMock('username', 'newUser')
|
||||
valuesMock.value.username = 'newUser'
|
||||
await wrapper.vm.$nextTick()
|
||||
await wrapper.find('form').trigger('submit')
|
||||
|
||||
expect(mutationMock).toHaveBeenCalledWith({ alias: 'newUser' })
|
||||
@ -154,7 +163,8 @@ describe('UserName Form', () => {
|
||||
it('shows an error toast on submission failure', async () => {
|
||||
mutationMock.mockRejectedValue(new Error('API Error'))
|
||||
|
||||
setFieldValueMock('username', 'newUser')
|
||||
valuesMock.value.username = 'newUser'
|
||||
await wrapper.vm.$nextTick()
|
||||
await wrapper.find('form').trigger('submit')
|
||||
|
||||
expect(mutationMock).toHaveBeenCalledWith({ alias: 'newUser' })
|
||||
|
||||
@ -130,18 +130,32 @@ describe('Register', () => {
|
||||
})
|
||||
|
||||
it('displays a message that firstname is required', async () => {
|
||||
// First set some value to make the field dirty
|
||||
await wrapper.find('#registerFirstname').setValue('test')
|
||||
await wrapper.find('#registerFirstname').trigger('blur')
|
||||
|
||||
// Then clear it to trigger validation
|
||||
await wrapper.find('#registerFirstname').setValue('')
|
||||
await wrapper.find('#registerFirstname').trigger('blur')
|
||||
await flushPromises()
|
||||
|
||||
expect(wrapper.find('#registerFirstnameLiveFeedback').exists()).toBe(true)
|
||||
expect(wrapper.find('#registerFirstnameLiveFeedback').text()).toBe(
|
||||
'The field firstname is invalid',
|
||||
)
|
||||
})
|
||||
|
||||
it('displays a message that lastname is required', async () => {
|
||||
// First set some value to make the field dirty
|
||||
await wrapper.find('#registerLastname').setValue('test')
|
||||
await wrapper.find('#registerLastname').trigger('blur')
|
||||
|
||||
// Then clear it to trigger validation
|
||||
await wrapper.find('#registerLastname').setValue('')
|
||||
await wrapper.find('#registerLastname').trigger('blur')
|
||||
await flushPromises()
|
||||
|
||||
expect(wrapper.find('#registerLastnameLiveFeedback').exists()).toBe(true)
|
||||
expect(wrapper.find('#registerLastnameLiveFeedback').text()).toBe(
|
||||
'The field lastname is invalid',
|
||||
)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user