Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update useFormState.test.js #18

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Update useFormState.test.js #18

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
118 changes: 111 additions & 7 deletions __tests__/useFormState.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,10 @@ it('useFormState does not update the initial state when the dependencies remains

it('restForm updates the the state correct.', () => {
const initialValues = {
firstName: '',
lastName: '',
}
const valuesToStart = {
firstName: 'test',
lastName: 'form',
}
Expand All @@ -73,6 +77,11 @@ it('restForm updates the the state correct.', () => {
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
act(() => {
result.current.setValues(valuesToUpdate)
result.current.resetForm()
Expand All @@ -85,6 +94,10 @@ it('restForm updates the the state correct.', () => {

it('setValues updates the the state correct.', () => {
const initialValues = {
firstName: '',
lastName: '',
}
const valuesToStart = {
firstName: 'test',
lastName: 'form',
}
Expand All @@ -97,10 +110,15 @@ it('setValues updates the the state correct.', () => {
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
act(() => {
result.current.setValues(valuesToUpdate)
})
expect(result.current.values.firstName).toBe(initialValues.firstName)
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToUpdate.lastName)
expect(result.current.values.age).toBe(valuesToUpdate.age)
expect(Array.isArray(result.current.errors)).toBe(true)
Expand All @@ -109,13 +127,22 @@ it('setValues updates the the state correct.', () => {

it('handleChange updates the the state correct.', () => {
const initialValues = {
name: '',
}
const valuesToStart = {
name: 'test',
}
const newName = 'hook'
const { result } = renderHook(() => useFormState(initialValues))
expect(result.current.values.name).toBe(initialValues.name)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.name).toBe(valuesToStart.name)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.handleChange('name', newName)
})
Expand All @@ -126,12 +153,18 @@ it('handleChange updates the the state correct.', () => {

it('getInputProps return correct props.', () => {
const initialValues = {
name: '',
}
const valuesToStart = {
name: 'test',
}
const newName = 'hook'
const { result } = renderHook(() => useFormState(initialValues))
act(() => {
result.current.setValues(valuesToStart)
})
const props = result.current.getInputProps('name')
expect(props.value).toBe(initialValues.name)
expect(props.value).toBe(valuesToStart.name)
expect(props.hasError).toBe(false)
expect(props.name).toBe('name')
act(() => {
Expand All @@ -145,12 +178,18 @@ it('getInputProps return correct props.', () => {

it('getNativeInputProps return correct props for text input.', () => {
const initialValues = {
name: '',
}
const valuesToStart = {
name: 'test',
}
const newName = 'hook'
const { result } = renderHook(() => useFormState(initialValues))
act(() => {
result.current.setValues(valuesToStart)
})
const props = result.current.getNativeInputProps('name')
expect(props.value).toBe(initialValues.name)
expect(props.value).toBe(valuesToStart.name)
expect(props.hasError).toBe(false)
expect(props.name).toBe('name')
act(() => {
Expand All @@ -169,6 +208,10 @@ it('getNativeInputProps return correct props for text input.', () => {

it('calling handleChange twice updates the the state correct.', () => {
const initialValues = {
firstName: '',
lastName: '',
}
const valuesToStart = {
firstName: 'test',
lastName: 'hook',
}
Expand All @@ -179,8 +222,21 @@ it('calling handleChange twice updates the the state correct.', () => {
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.handleChange('firstName', newFirstName)
})
expect(result.current.values.firstName).toBe(newFirstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.handleChange('lastName', newLastName)
})
expect(result.current.values.firstName).toBe(newFirstName)
Expand All @@ -202,6 +258,10 @@ it('validate updates the state correctly.', () => {
const weakPassword = 'password'
const initialValues = {
userName: '',
password: '',
repeatPassword: '',
}
const valuesToStart = {
password: weakPassword,
repeatPassword: weakPassword,
}
Expand All @@ -219,7 +279,7 @@ it('validate updates the state correctly.', () => {
},
{
path: 'repeatPassword',
validate: (repeatPassword, values) => repeatPassword !== values.password,
validate: (repeatPassword, values) => repeatPassword === values.password,
message,
},
])
Expand All @@ -234,14 +294,29 @@ it('validate updates the state correctly.', () => {
result.current.validate()
})
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(3)
expect(result.current.errors.length).toBe(1)
expect(result.current.errors).toContainObject({ path: 'userName', message })
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.userName).toBe(initialValues.userName)
expect(result.current.values.password).toBe(valuesToStart.password)
expect(result.current.values.repeatPassword).toBe(valuesToStart.repeatPassword)
act(() => {
result.current.validate()
})
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(2)
expect(result.current.errors).toContainObject({ path: 'userName', message })
expect(result.current.errors).toContainObject({ path: 'password', message })
expect(result.current.errors).toContainObject({ path: 'repeatPassword', message })
})

it('handleChange updates the the state correct when the form is dirty.', () => {
const initialValues = {
firstName: '',
lastName: '',
}
const valuesToStart = {
firstName: 'test',
lastName: 'test',
}
Expand All @@ -258,19 +333,35 @@ it('handleChange updates the the state correct when the form is dirty.', () => {
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.validate()
})
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.handleChange('firstName', null)
})
expect(result.current.values.firstName).toBe(null)
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(1)
expect(result.current.errors).toContainObject({ path: 'firstName', message })
})

it('setValues updates the the state correct when the form is dirty.', () => {
const initialValues = {
firstName: '',
lastName: '',
}
const valuesToStart = {
firstName: 'test',
lastName: 'form',
}
Expand All @@ -292,6 +383,13 @@ it('setValues updates the the state correct when the form is dirty.', () => {
expect(result.current.values.lastName).toBe(initialValues.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.setValues(valuesToStart)
})
expect(result.current.values.firstName).toBe(valuesToStart.firstName)
expect(result.current.values.lastName).toBe(valuesToStart.lastName)
expect(Array.isArray(result.current.errors)).toBe(true)
expect(result.current.errors.length).toBe(0)
act(() => {
result.current.validate()
result.current.setValues(valuesToUpdate)
Expand Down Expand Up @@ -461,6 +559,10 @@ it('Validation can handle validationOption changes', () => {
}

const initialValues = {
name: '',
partnerName: '',
}
const valuesToUpdate = {
name: 'test',
partnerName: 'test',
}
Expand All @@ -487,8 +589,10 @@ it('Validation can handle validationOption changes', () => {
expect(Array.isArray(result.current.formState.errors)).toBe(true)
expect(result.current.formState.errors.length).toBe(0)
act(() => {
result.current.formState.setValues(valuesToUpdate)
result.current.setHasPartner(false)
})
expect(result.current.formState.values.name).toBe(valuesToUpdate.name)
act(() => {
result.current.formState.validate()
})
Expand Down