Skip to content

Commit 15705d6

Browse files
committed
test: improve validation and submission handling tests for invalid form states
Signed-off-by: Pascal Küsgen <pascalkuesgen@gmail.com>
1 parent c8db95a commit 15705d6

File tree

1 file changed

+32
-48
lines changed

1 file changed

+32
-48
lines changed

packages/form-core/tests/FormApi.spec.ts

Lines changed: 32 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -3981,95 +3981,79 @@ it('should accept formId and return it', () => {
39813981
expect(form.formId).toEqual('age')
39823982
})
39833983

3984-
it('should call onSubmitInvalid with current error state when canSubmit is false', async () => {
3985-
const onInvalid = vi.fn()
3984+
it('should call onSubmitInvalid when submitted with onMount error', async () => {
3985+
const onInvalidSpy = vi.fn()
39863986

39873987
const form = new FormApi({
3988-
defaultValues: { name: '', email: '' },
3988+
defaultValues: { name: '' },
39893989
validators: {
3990-
onMount: ({ value }) => {
3991-
const errors: Record<string, string> = {}
3992-
if (!value.name) errors.name = 'Name is required'
3993-
if (!value.email) errors.email = 'Email is required'
3994-
return Object.keys(errors).length > 0 ? errors : undefined
3995-
},
3996-
},
3997-
onSubmitInvalid: ({ value, formApi }) => {
3998-
onInvalid(value, formApi.state.errors)
3990+
onMount: () => ({ name: 'Name is required' }),
39993991
},
3992+
onSubmitInvalid: () => onInvalidSpy(),
40003993
})
4001-
40023994
form.mount()
40033995

4004-
new FieldApi({ form, name: 'name' }).mount()
4005-
new FieldApi({ form, name: 'email' }).mount()
3996+
const field = new FieldApi({ form, name: 'name' })
3997+
field.mount()
40063998

40073999
expect(form.state.canSubmit).toBe(false)
40084000

40094001
await form.handleSubmit()
40104002

4011-
expect(onInvalid).toHaveBeenCalledTimes(1)
4012-
expect(onInvalid).toHaveBeenCalledWith(
4013-
{ name: '', email: '' },
4014-
expect.any(Object),
4015-
)
4003+
expect(onInvalidSpy).toHaveBeenCalledTimes(1)
40164004
})
40174005

40184006
it('should not run submit validation when canSubmit is false', async () => {
4019-
const onSubmitValidator = vi.fn()
4020-
const onInvalid = vi.fn()
4007+
const onSubmitValidatorSpy = vi
4008+
.fn()
4009+
.mockImplementation(() => 'Submit validation failed')
4010+
const onInvalidSpy = vi.fn()
40214011

40224012
const form = new FormApi({
40234013
defaultValues: { name: '' },
40244014
validators: {
4025-
onMount: ({ value }) => (!value.name ? 'Name required' : undefined),
4026-
onSubmit: ({ value }) => {
4027-
onSubmitValidator()
4028-
return !value.name ? 'Submit validation failed' : undefined
4029-
},
4030-
},
4031-
onSubmitInvalid: ({ value, formApi }) => {
4032-
onInvalid(value, formApi)
4015+
onMount: () => 'Name required',
4016+
onSubmit: () => onSubmitValidatorSpy,
40334017
},
4018+
onSubmitInvalid: () => onInvalidSpy(),
40344019
})
4035-
40364020
form.mount()
4037-
new FieldApi({ form, name: 'name' }).mount()
4021+
4022+
const field = new FieldApi({ form, name: 'name' })
4023+
field.mount()
40384024

40394025
expect(form.state.canSubmit).toBe(false)
40404026

40414027
await form.handleSubmit()
40424028

4043-
expect(onSubmitValidator).not.toHaveBeenCalled()
4044-
expect(onInvalid).toHaveBeenCalledTimes(1)
4029+
expect(onSubmitValidatorSpy).not.toHaveBeenCalled()
4030+
expect(onInvalidSpy).toHaveBeenCalledTimes(1)
40454031
})
40464032

40474033
it('should respect canSubmitWhenInvalid option and run validation even when canSubmit is false', async () => {
4048-
const onSubmitValidator = vi.fn()
4049-
const onInvalid = vi.fn()
4034+
const onSubmitValidatorSpy = vi
4035+
.fn()
4036+
.mockImplementation(() => 'Submit validation failed')
4037+
const onInvalidSpy = vi.fn()
40504038

40514039
const form = new FormApi({
40524040
defaultValues: { name: '' },
40534041
canSubmitWhenInvalid: true,
40544042
validators: {
4055-
onMount: ({ value }) => (!value.name ? 'Name required' : undefined),
4056-
onSubmit: ({ value }) => {
4057-
onSubmitValidator()
4058-
return !value.name ? 'Submit validation failed' : undefined
4059-
},
4060-
},
4061-
onSubmitInvalid: ({ value, formApi }) => {
4062-
onInvalid(value, formApi)
4043+
onMount: () => 'Name required',
4044+
onSubmit: () => onSubmitValidatorSpy(),
40634045
},
4046+
onSubmitInvalid: () => onInvalidSpy(),
40644047
})
4065-
40664048
form.mount()
4067-
new FieldApi({ form, name: 'name' }).mount()
4049+
4050+
const field = new FieldApi({ form, name: 'name' })
4051+
field.mount()
40684052

40694053
expect(form.state.canSubmit).toBe(true)
40704054

40714055
await form.handleSubmit()
40724056

4073-
expect(onSubmitValidator).toHaveBeenCalledTimes(1)
4074-
expect(onInvalid).toHaveBeenCalledTimes(1)
4057+
expect(onSubmitValidatorSpy).toHaveBeenCalledTimes(1)
4058+
expect(onInvalidSpy).toHaveBeenCalledTimes(1)
40754059
})

0 commit comments

Comments
 (0)