fix: hidden should higher than noStyle (#26020)

ant-design · Aug 5, 2020 · c345580 · c345580
1 parent 683750c
commit c345580
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 11 deletions.
diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx
@@ -142,7 +142,7 @@ function FormItem(props: FormItemProps): React.ReactElement {
     meta?: Meta,
     isRequired?: boolean,
   ): React.ReactNode {
-    if (noStyle) {
+    if (noStyle && !hidden) {
       return baseChildren;
     }
 

diff --git a/components/form/__tests__/__snapshots__/index.test.js.snap b/components/form/__tests__/__snapshots__/index.test.js.snap
@@ -1,6 +1,35 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Form Form item hidden 1`] = `
+exports[`Form Form item hidden noStyle should not work when hidden 1`] = `
+<form
+  class="ant-form ant-form-horizontal"
+>
+  <div
+    class="ant-row ant-form-item ant-form-item-hidden"
+  >
+    <div
+      class="ant-col ant-form-item-control"
+    >
+      <div
+        class="ant-form-item-control-input"
+      >
+        <div
+          class="ant-form-item-control-input-content"
+        >
+          <input
+            class="ant-input"
+            id="light"
+            type="text"
+            value=""
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</form>
+`;
+
+exports[`Form Form item hidden should work 1`] = `
 <form
   class="ant-form ant-form-horizontal"
 >

diff --git a/components/form/__tests__/index.test.js b/components/form/__tests__/index.test.js
@@ -699,14 +699,27 @@ describe('Form', () => {
     expect(wrapper.find('input').prop('onBlur')).toBeTruthy();
   });
 
-  it('Form item hidden', () => {
-    const wrapper = mount(
-      <Form>
-        <Form.Item name="light" hidden>
-          <Input />
-        </Form.Item>
-      </Form>,
-    );
-    expect(wrapper).toMatchRenderedSnapshot();
+  describe('Form item hidden', () => {
+    it('should work', () => {
+      const wrapper = mount(
+        <Form>
+          <Form.Item name="light" hidden>
+            <Input />
+          </Form.Item>
+        </Form>,
+      );
+      expect(wrapper).toMatchRenderedSnapshot();
+    });
+
+    it('noStyle should not work when hidden', () => {
+      const wrapper = mount(
+        <Form>
+          <Form.Item name="light" hidden noStyle>
+            <Input />
+          </Form.Item>
+        </Form>,
+      );
+      expect(wrapper).toMatchRenderedSnapshot();
+    });
   });
 });