fix transaction form test

This commit is contained in:
Moriz Wahl 2023-05-16 06:46:38 +02:00
parent 5493cb06ff
commit eda6e686f3
4 changed files with 39 additions and 33 deletions

View File

@ -71,9 +71,9 @@ describe('TransactionForm', () => {
}) })
describe('with balance <= 0.00 GDD the form is disabled', () => { describe('with balance <= 0.00 GDD the form is disabled', () => {
it('has a disabled input field of type email', () => { it('has a disabled input field of type text', () => {
expect( expect(
wrapper.find('div[data-test="input-email"]').find('input').attributes('disabled'), wrapper.find('div[data-test="input-identifier"]').find('input').attributes('disabled'),
).toBe('disabled') ).toBe('disabled')
}) })
@ -116,51 +116,54 @@ describe('TransactionForm', () => {
expect(wrapper.vm.radioSelected).toBe(SEND_TYPES.send) expect(wrapper.vm.radioSelected).toBe(SEND_TYPES.send)
}) })
describe('email field', () => { describe('identifier field', () => {
it('has an input field of type email', () => { it('has an input field of type text', () => {
expect( expect(
wrapper.find('div[data-test="input-email"]').find('input').attributes('type'), wrapper.find('div[data-test="input-identifier"]').find('input').attributes('type'),
).toBe('email') ).toBe('text')
}) })
it('has a label form.receiver', () => { it('has a label form.receiver', () => {
expect(wrapper.find('div[data-test="input-email"]').find('label').text()).toBe( expect(wrapper.find('div[data-test="input-identifier"]').find('label').text()).toBe(
'form.recipient', 'form.recipient',
) )
}) })
it('has a placeholder "E-Mail"', () => { it('has a placeholder for identifier', () => {
expect( expect(
wrapper.find('div[data-test="input-email"]').find('input').attributes('placeholder'), wrapper
).toBe('form.email') .find('div[data-test="input-identifier"]')
.find('input')
.attributes('placeholder'),
).toBe('form.identifier')
}) })
it('flushes an error message when no valid email is given', async () => { it('flushes an error message when no valid identifier is given', async () => {
await wrapper.find('div[data-test="input-email"]').find('input').setValue('a') await wrapper.find('div[data-test="input-identifier"]').find('input').setValue('a')
await flushPromises() await flushPromises()
expect( expect(
wrapper.find('div[data-test="input-email"]').find('.invalid-feedback').text(), wrapper.find('div[data-test="input-identifier"]').find('.invalid-feedback').text(),
).toBe('validations.messages.email') ).toBe('form.validation.valid-identifier')
}) })
// TODO:SKIPPED there is no check that the email being sent to is the same as the user's email. // TODO:SKIPPED there is no check that the email being sent to is the same as the user's email.
it.skip('flushes an error message when email is the email of logged in user', async () => { it.skip('flushes an error message when email is the email of logged in user', async () => {
await wrapper await wrapper
.find('div[data-test="input-email"]') .find('div[data-test="input-identifier"]')
.find('input') .find('input')
.setValue('user@example.org') .setValue('user@example.org')
await flushPromises() await flushPromises()
expect( expect(
wrapper.find('div[data-test="input-email"]').find('.invalid-feedback').text(), wrapper.find('div[data-test="input-identifier"]').find('.invalid-feedback').text(),
).toBe('form.validation.is-not') ).toBe('form.validation.is-not')
}) })
it('trims the email after blur', async () => { it('trims the identifier after blur', async () => {
await wrapper await wrapper
.find('div[data-test="input-email"]') .find('div[data-test="input-identifier"]')
.find('input') .find('input')
.setValue(' valid@email.com ') .setValue(' valid@email.com ')
await wrapper.find('div[data-test="input-email"]').find('input').trigger('blur') await wrapper.find('div[data-test="input-identifier"]').find('input').trigger('blur')
await flushPromises() await flushPromises()
expect(wrapper.vm.form.identifier).toBe('valid@email.com') expect(wrapper.vm.form.identifier).toBe('valid@email.com')
}) })
@ -304,7 +307,7 @@ Die ganze Welt bezwingen.“`)
it('clears all fields on click', async () => { it('clears all fields on click', async () => {
await wrapper await wrapper
.find('div[data-test="input-email"]') .find('div[data-test="input-identifier"]')
.find('input') .find('input')
.setValue('someone@watches.tv') .setValue('someone@watches.tv')
await wrapper.find('div[data-test="input-amount"]').find('input').setValue('87.23') await wrapper.find('div[data-test="input-amount"]').find('input').setValue('87.23')
@ -327,7 +330,7 @@ Die ganze Welt bezwingen.“`)
describe('submit', () => { describe('submit', () => {
beforeEach(async () => { beforeEach(async () => {
await wrapper await wrapper
.find('div[data-test="input-email"]') .find('div[data-test="input-identifier"]')
.find('input') .find('input')
.setValue('someone@watches.tv') .setValue('someone@watches.tv')
await wrapper.find('div[data-test="input-amount"]').find('input').setValue('87.23') await wrapper.find('div[data-test="input-amount"]').find('input').setValue('87.23')
@ -380,8 +383,8 @@ Die ganze Welt bezwingen.“`)
}) })
describe('query for username with success', () => { describe('query for username with success', () => {
it('has no email input field', () => { it('has no identifier input field', () => {
expect(wrapper.find('div[data-test="input-email"]').exists()).toBe(false) expect(wrapper.find('div[data-test="input-identifier"]').exists()).toBe(false)
}) })
it('queries the username', () => { it('queries the username', () => {

View File

@ -7,9 +7,8 @@
:name="name" :name="name"
v-slot="{ errors, valid, validated, ariaInput, ariaMsg }" v-slot="{ errors, valid, validated, ariaInput, ariaMsg }"
> >
<b-form-group :label="label" :label-for="labelFor"> <b-form-group :label="label" :label-for="labelFor" data-test="input-amount">
<b-form-input <b-form-input
data-test="input-amount"
v-model="currentValue" v-model="currentValue"
v-bind="ariaInput" v-bind="ariaInput"
:id="labelFor" :id="labelFor"

View File

@ -5,11 +5,10 @@
:name="name" :name="name"
v-slot="{ errors, valid, validated, ariaInput, ariaMsg }" v-slot="{ errors, valid, validated, ariaInput, ariaMsg }"
> >
<b-form-group :label="label" :label-for="labelFor" data-test="input-email"> <b-form-group :label="label" :label-for="labelFor" data-test="input-identifier">
<b-form-input <b-form-input
v-model="currentValue" v-model="currentValue"
v-bind="ariaInput" v-bind="ariaInput"
data-test="input-identifier"
:id="labelFor" :id="labelFor"
:name="name" :name="name"
:placeholder="placeholder" :placeholder="placeholder"

View File

@ -66,8 +66,11 @@ describe('Send', () => {
beforeEach(async () => { beforeEach(async () => {
const transactionForm = wrapper.findComponent({ name: 'TransactionForm' }) const transactionForm = wrapper.findComponent({ name: 'TransactionForm' })
await transactionForm.findAll('input[type="radio"]').at(0).setChecked() await transactionForm.findAll('input[type="radio"]').at(0).setChecked()
await transactionForm.find('[data-test="input-identifier"]').setValue('user@example.org') await transactionForm
await transactionForm.find('[data-test="input-amount"]').setValue('23.45') .find('[data-test="input-identifier"]')
.find('input')
.setValue('user@example.org')
await transactionForm.find('[data-test="input-amount"]').find('input').setValue('23.45')
await transactionForm.find('textarea').setValue('Make the best of it!') await transactionForm.find('textarea').setValue('Make the best of it!')
await transactionForm.find('form').trigger('submit') await transactionForm.find('form').trigger('submit')
await flushPromises() await flushPromises()
@ -91,10 +94,12 @@ describe('Send', () => {
}) })
it('restores the previous data in the formular', () => { it('restores the previous data in the formular', () => {
expect(wrapper.find('[data-test="input-identifier"]').vm.$el.value).toBe( expect(wrapper.find('[data-test="input-identifier"]').find('input').vm.$el.value).toBe(
'user@example.org', 'user@example.org',
) )
expect(wrapper.find('[data-test="input-amount"]').vm.$el.value).toBe('23.45') expect(wrapper.find('[data-test="input-amount"]').find('input').vm.$el.value).toBe(
'23.45',
)
expect(wrapper.find('textarea').vm.$el.value).toBe('Make the best of it!') expect(wrapper.find('textarea').vm.$el.value).toBe('Make the best of it!')
}) })
}) })
@ -188,7 +193,7 @@ describe('Send', () => {
beforeEach(async () => { beforeEach(async () => {
jest.clearAllMocks() jest.clearAllMocks()
const transactionForm = wrapper.findComponent({ name: 'TransactionForm' }) const transactionForm = wrapper.findComponent({ name: 'TransactionForm' })
await transactionForm.find('[data-test="input-amount"]').setValue('34.56') await transactionForm.find('[data-test="input-amount"]').find('input').setValue('34.56')
await transactionForm.find('textarea').setValue('Make the best of it!') await transactionForm.find('textarea').setValue('Make the best of it!')
await transactionForm.find('form').trigger('submit') await transactionForm.find('form').trigger('submit')
await flushPromises() await flushPromises()
@ -248,7 +253,7 @@ describe('Send', () => {
}) })
const transactionForm = wrapper.findComponent({ name: 'TransactionForm' }) const transactionForm = wrapper.findComponent({ name: 'TransactionForm' })
await transactionForm.findAll('input[type="radio"]').at(1).setChecked() await transactionForm.findAll('input[type="radio"]').at(1).setChecked()
await transactionForm.find('[data-test="input-amount"]').setValue('56.78') await transactionForm.find('[data-test="input-amount"]').find('input').setValue('56.78')
await transactionForm.find('textarea').setValue('Make the best of the link!') await transactionForm.find('textarea').setValue('Make the best of the link!')
await transactionForm.find('form').trigger('submit') await transactionForm.find('form').trigger('submit')
await flushPromises() await flushPromises()