Skip to content

Commit 12d02f2

Browse files
committed
Added test to simulate final-form/final-form#26 (comment)
1 parent 6ca17dd commit 12d02f2

File tree

3 files changed

+55
-4
lines changed

3 files changed

+55
-4
lines changed

package-lock.json

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@
5454
"eslint-plugin-jsx-a11y": "^6.2.1",
5555
"eslint-plugin-react": "^7.13.0",
5656
"eslint-plugin-react-hooks": "^1.6.0",
57-
"final-form": "^4.13.0",
57+
"final-form": "^4.13.1",
5858
"final-form-arrays": "^1.1.2",
5959
"flow-bin": "^0.98.1",
6060
"glow": "^1.2.2",

src/FieldArray.test.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { Form, Field } from 'react-final-form'
77
import FieldArray from './FieldArray'
88

99
const onSubmitMock = values => {}
10+
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms))
1011

1112
describe('FieldArray', () => {
1213
afterEach(cleanup)
@@ -626,4 +627,54 @@ describe('FieldArray', () => {
626627
expect(getByTestId('arrayDirty')).toHaveTextContent('Pristine')
627628
expect(getByTestId('names[0].dirty')).toHaveTextContent('Pristine')
628629
})
630+
631+
it('should allow resetting the form in onSubmit', async () => {
632+
// https://github.com/final-form/final-form/issues/26#issuecomment-497272119
633+
const onSubmit = jest.fn((values, form) => {
634+
expect(values).toEqual({ names: ['erikras'] })
635+
return Promise.resolve().then(() => {
636+
form.reset()
637+
})
638+
})
639+
const { getByTestId, getByText } = render(
640+
<Form
641+
onSubmit={onSubmit}
642+
mutators={arrayMutators}
643+
subscription={{ values: true }}
644+
>
645+
{({ handleSubmit, values }) => (
646+
<form onSubmit={handleSubmit} data-testid="form">
647+
<pre data-testid="values">{JSON.stringify(values)}</pre>
648+
<FieldArray
649+
name="names"
650+
render={({ fields }) => (
651+
<div>
652+
{fields.map(field => (
653+
<Field
654+
name={field}
655+
key={field}
656+
component="input"
657+
data-testid={field}
658+
/>
659+
))}
660+
<button type="button" onClick={() => fields.push('erikras')}>
661+
Add
662+
</button>
663+
</div>
664+
)}
665+
/>
666+
</form>
667+
)}
668+
</Form>
669+
)
670+
expect(getByTestId('values')).toHaveTextContent('')
671+
expect(onSubmit).not.toHaveBeenCalled()
672+
fireEvent.click(getByText('Add'))
673+
expect(getByTestId('values')).toHaveTextContent('{"names":["erikras"]}')
674+
fireEvent.submit(getByTestId('form'))
675+
await sleep(3)
676+
expect(onSubmit).toHaveBeenCalled()
677+
expect(onSubmit).toHaveBeenCalledTimes(1)
678+
expect(getByTestId('values')).toHaveTextContent('')
679+
})
629680
})

0 commit comments

Comments
 (0)