feature: add default onReset props on Form component (#278)

* feature: add onReset props

* fix: remove unused code

* fix: not call onReset props

* fix: a potential bug(ignore user passed onReset prop)

Co-authored-by: chenliang <[email protected]>

Author: jueinin

src/Form.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {
+import type {
   Store,
   FormInstance,
   FieldData,
@@ -9,7 +9,8 @@ import {
 } from './interface';
 import useForm from './useForm';
 import FieldContext, { HOOK_MARK } from './FieldContext';
-import FormContext, { FormContextProps } from './FormContext';
+import type { FormContextProps } from './FormContext';
+import FormContext from './FormContext';
 import { isSimilar } from './utils/valueUtil';
 
 type BaseFormProps = Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onSubmit'>;
@@ -153,6 +154,12 @@ const Form: React.ForwardRefRenderFunction<FormInstance, FormProps> = (
 
         formInstance.submit();
       }}
+      onReset={(event: React.FormEvent<HTMLFormElement>) => {
+        event.preventDefault();
+
+        formInstance.resetFields();
+        restProps.onReset?.(event);
+      }}
     >
       {wrapperNode}
     </Component>

tests/index.test.js

@@ -240,7 +240,23 @@ describe('Form.Basic', () => {
     await changeValue(getField(wrapper, 'bamboo'), 'beauty');
     expect(onValuesChange).toHaveBeenCalledWith(expect.anything(), { bamboo: 'beauty' });
   });
-
+  it('should call onReset fn, when the button is clicked', async () => {
+    const resetFn = jest.fn();
+    const wrapper = mount(
+      <Form onReset={resetFn}>
+        <InfoField name={'user'}>
+          <Input />
+        </InfoField>
+        <button type="reset">reset</button>
+      </Form>,
+    );
+    await changeValue(getField(wrapper), 'Bamboo');
+    wrapper.find('button').simulate('reset');
+    await timeout();
+    expect(resetFn).toHaveBeenCalledTimes(1);
+    const { value } = wrapper.find('input').props();
+    expect(value).toEqual('');
+  });
   it('submit', async () => {
     const onFinish = jest.fn();
     const onFinishFailed = jest.fn();