From a10d2501ffff60c3d279d99af4e522932794dde0 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Sat, 25 Apr 2020 16:05:01 +0800
Subject: [PATCH 1/2] test first

---
 tests/index.test.js | 95 ++++++++++++++++++++++++++++++---------------
 1 file changed, 63 insertions(+), 32 deletions(-)

diff --git a/tests/index.test.js b/tests/index.test.js
index 778588d1..fb13a496 100644
--- a/tests/index.test.js
+++ b/tests/index.test.js
@@ -311,44 +311,75 @@ describe('Form.Basic', () => {
     expect(wrapper.find('.anything').props().light).toEqual('bamboo');
   });
 
-  it('shouldUpdate', async () => {
-    let isAllTouched;
-    let hasError;
+  describe('shouldUpdate', () => {
+    it('work', async () => {
+      let isAllTouched;
+      let hasError;
 
-    const wrapper = mount(
-      <Form>
-        <Field name="username" rules={[{ required: true }]}>
-          <Input />
-        </Field>
-        <Field name="password" rules={[{ required: true }]}>
-          <Input />
-        </Field>
-        <Field shouldUpdate>
-          {(_, __, { getFieldsError, isFieldsTouched }) => {
-            isAllTouched = isFieldsTouched(true);
-            hasError = getFieldsError().filter(({ errors }) => errors.length).length;
+      const wrapper = mount(
+        <Form>
+          <Field name="username" rules={[{ required: true }]}>
+            <Input />
+          </Field>
+          <Field name="password" rules={[{ required: true }]}>
+            <Input />
+          </Field>
+          <Field shouldUpdate>
+            {(_, __, { getFieldsError, isFieldsTouched }) => {
+              isAllTouched = isFieldsTouched(true);
+              hasError = getFieldsError().filter(({ errors }) => errors.length).length;
 
-            return null;
-          }}
-        </Field>
-      </Form>,
-    );
+              return null;
+            }}
+          </Field>
+        </Form>,
+      );
+
+      await changeValue(getField(wrapper, 'username'), '');
+      expect(isAllTouched).toBeFalsy();
+      expect(hasError).toBeTruthy();
 
-    await changeValue(getField(wrapper, 'username'), '');
-    expect(isAllTouched).toBeFalsy();
-    expect(hasError).toBeTruthy();
+      await changeValue(getField(wrapper, 'username'), 'Bamboo');
+      expect(isAllTouched).toBeFalsy();
+      expect(hasError).toBeFalsy();
+
+      await changeValue(getField(wrapper, 'password'), 'Light');
+      expect(isAllTouched).toBeTruthy();
+      expect(hasError).toBeFalsy();
+
+      await changeValue(getField(wrapper, 'password'), '');
+      expect(isAllTouched).toBeTruthy();
+      expect(hasError).toBeTruthy();
+    });
 
-    await changeValue(getField(wrapper, 'username'), 'Bamboo');
-    expect(isAllTouched).toBeFalsy();
-    expect(hasError).toBeFalsy();
+    it('true will force one more update', async () => {
+      let renderPhase = 0;
 
-    await changeValue(getField(wrapper, 'password'), 'Light');
-    expect(isAllTouched).toBeTruthy();
-    expect(hasError).toBeFalsy();
+      const wrapper = mount(
+        <Form initialValues={{ username: 'light' }}>
+          <Field name="username">
+            <Input />
+          </Field>
+          <Field shouldUpdate>
+            {(_, __, form) => {
+              renderPhase += 1;
+              return (
+                <span
+                  id="holder"
+                  touched={form.isFieldsTouched(true)}
+                  value={form.getFieldsValue()}
+                />
+              );
+            }}
+          </Field>
+        </Form>,
+      );
 
-    await changeValue(getField(wrapper, 'password'), '');
-    expect(isAllTouched).toBeTruthy();
-    expect(hasError).toBeTruthy();
+      const props = wrapper.find('#holder').props();
+      expect(renderPhase).toEqual(2);
+      expect(props.touched).toBeFalsy();
+      expect(props.value).toEqual({ username: 'light' });
+    });
   });
 
   describe('setFields', () => {

From 6df25ef469566a7cdb2c16e54dfd8344513d23f8 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Sat, 25 Apr 2020 16:12:00 +0800
Subject: [PATCH 2/2] force re-render

---
 src/Field.tsx       | 6 ++++++
 tests/index.test.js | 8 ++++----
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/Field.tsx b/src/Field.tsx
index 893d4f60..c593c2bc 100644
--- a/src/Field.tsx
+++ b/src/Field.tsx
@@ -114,9 +114,15 @@ class Field extends React.Component<InternalFieldProps, FieldState> implements F
 
   // ============================== Subscriptions ==============================
   public componentDidMount() {
+    const { shouldUpdate } = this.props;
     const { getInternalHooks }: InternalFormInstance = this.context;
     const { registerField } = getInternalHooks(HOOK_MARK);
     this.cancelRegisterFunc = registerField(this);
+
+    // One more render for component in case fields not ready
+    if (shouldUpdate === true) {
+      this.reRender();
+    }
   }
 
   public componentWillUnmount() {
diff --git a/tests/index.test.js b/tests/index.test.js
index fb13a496..1b90d83b 100644
--- a/tests/index.test.js
+++ b/tests/index.test.js
@@ -366,8 +366,8 @@ describe('Form.Basic', () => {
               return (
                 <span
                   id="holder"
-                  touched={form.isFieldsTouched(true)}
-                  value={form.getFieldsValue()}
+                  data-touched={form.isFieldsTouched(true)}
+                  data-value={form.getFieldsValue()}
                 />
               );
             }}
@@ -377,8 +377,8 @@ describe('Form.Basic', () => {
 
       const props = wrapper.find('#holder').props();
       expect(renderPhase).toEqual(2);
-      expect(props.touched).toBeFalsy();
-      expect(props.value).toEqual({ username: 'light' });
+      expect(props['data-touched']).toBeFalsy();
+      expect(props['data-value']).toEqual({ username: 'light' });
     });
   });