From c826a79f2ea4be3bcb1175f5cbdfbfc6bedbc4a2 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Sat, 10 Oct 2020 11:46:13 +0800
Subject: [PATCH 1/2] fix: Should trigger re-render on submit

---
 src/Field.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/Field.tsx b/src/Field.tsx
index b0d2f923..68822a31 100644
--- a/src/Field.tsx
+++ b/src/Field.tsx
@@ -323,6 +323,9 @@ class Field extends React.Component<InternalFieldProps, FieldState, InternalForm
     this.validatePromise = promise;
     this.errors = [];
 
+    // Force trigger re-render since we need sync renderProps with new meta
+    this.reRender();
+
     promise
       .catch(e => e)
       .then((errors: string[] = []) => {

From c32053ae5a63498d928302aa1d30c652dbcf2624 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Sat, 10 Oct 2020 12:06:30 +0800
Subject: [PATCH 2/2] test: Add test case

---
 tests/validate.test.js | 34 +++++++++++++++++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/tests/validate.test.js b/tests/validate.test.js
index a015c9ed..4de387f6 100644
--- a/tests/validate.test.js
+++ b/tests/validate.test.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-template-curly-in-string */
 import React from 'react';
 import { mount } from 'enzyme';
-import Form, { Field } from '../src';
+import Form, { Field, useForm } from '../src';
 import InfoField, { Input } from './common/InfoField';
 import { changeValue, matchError, getField } from './common';
 import timeout from './common/timeout';
@@ -578,5 +578,37 @@ describe('Form.Validate', () => {
     wrapper.update();
     matchError(wrapper, false);
   });
+
+  it('submit should trigger Field re-render', () => {
+    const renderProps = jest.fn().mockImplementation(() => null);
+
+    const Demo = () => {
+      const [form] = useForm();
+
+      return (
+        <Form form={form}>
+          <Field
+            name="test"
+            rules={[{ validator: async () => Promise.reject(new Error('Failed')) }]}
+          >
+            {renderProps}
+          </Field>
+          <button
+            type="button"
+            onClick={() => {
+              form.submit();
+            }}
+          />
+        </Form>
+      );
+    };
+
+    const wrapper = mount(<Demo />);
+    renderProps.mockReset();
+
+    // Should trigger validating
+    wrapper.find('button').simulate('click');
+    expect(renderProps.mock.calls[0][1]).toEqual(expect.objectContaining({ validating: true }));
+  });
 });
 /* eslint-enable no-template-curly-in-string */