From 44fb747426ccbef5ab50fcc6f891e18385a12026 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Wed, 14 Oct 2020 11:04:06 +0800
Subject: [PATCH] fix: Dialog should not auto destroy (#206)

* fix: default destoryOnClose false

* test: add test case
---
 src/DialogWrap.tsx  |  3 +-
 tests/index.spec.js | 67 +++++++++++++++++++++++++++++----------------
 2 files changed, 46 insertions(+), 24 deletions(-)

diff --git a/src/DialogWrap.tsx b/src/DialogWrap.tsx
index 458f3c9d..ed787b20 100644
--- a/src/DialogWrap.tsx
+++ b/src/DialogWrap.tsx
@@ -13,7 +13,7 @@ import { IDialogPropTypes } from './IDialogPropTypes';
  * */
 
 const DialogWrap: React.FC<IDialogPropTypes> = (props: IDialogPropTypes) => {
-  const { visible, getContainer, forceRender, destroyOnClose, afterClose } = props;
+  const { visible, getContainer, forceRender, destroyOnClose = false, afterClose } = props;
   const [animatedVisible, setAnimatedVisible] = React.useState<boolean>(visible);
 
   React.useEffect(() => {
@@ -42,6 +42,7 @@ const DialogWrap: React.FC<IDialogPropTypes> = (props: IDialogPropTypes) => {
       {(childProps: IDialogChildProps) => (
         <Dialog
           {...props}
+          destroyOnClose={destroyOnClose}
           afterClose={() => {
             afterClose?.();
             setAnimatedVisible(false);
diff --git a/tests/index.spec.js b/tests/index.spec.js
index a5996d93..4e3b8a18 100644
--- a/tests/index.spec.js
+++ b/tests/index.spec.js
@@ -57,34 +57,55 @@ describe('dialog', () => {
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
-  it('destroy on hide should unmount child components on close', () => {
-    const wrapper = mount(
-      <Dialog destroyOnClose>
-        <input className="test-input" />
-      </Dialog>,
-      { attachTo: document.body },
-    );
+  describe('destroyOnClose', () => {
+    it('default is false', () => {
+      const wrapper = mount(
+        <Dialog visible>
+          <input className="test-destroy" />
+        </Dialog>,
+        { attachTo: document.body },
+      );
 
-    // Show
-    wrapper.setProps({ visible: true });
-    jest.runAllTimers();
-    wrapper.update();
+      act(() => {
+        wrapper.setProps({ visible: false });
+        jest.runAllTimers();
+        wrapper.update();
+      });
 
-    document.getElementsByClassName('.test-input').value = 'test';
-    expect(document.getElementsByClassName('.test-input').value).toBe('test');
+      expect(document.querySelectorAll('.test-destroy')).toHaveLength(1);
 
-    // Hide
-    wrapper.setProps({ visible: false });
-    jest.runAllTimers();
-    wrapper.update();
+      wrapper.unmount();
+    });
 
-    // Show
-    wrapper.setProps({ visible: true });
-    jest.runAllTimers();
-    wrapper.update();
+    it('destroy on hide should unmount child components on close', () => {
+      const wrapper = mount(
+        <Dialog destroyOnClose>
+          <input className="test-input" />
+        </Dialog>,
+        { attachTo: document.body },
+      );
 
-    expect(document.getElementsByClassName('.test-input').value).toBeUndefined();
-    wrapper.unmount();
+      // Show
+      wrapper.setProps({ visible: true });
+      jest.runAllTimers();
+      wrapper.update();
+
+      document.getElementsByClassName('.test-input').value = 'test';
+      expect(document.getElementsByClassName('.test-input').value).toBe('test');
+
+      // Hide
+      wrapper.setProps({ visible: false });
+      jest.runAllTimers();
+      wrapper.update();
+
+      // Show
+      wrapper.setProps({ visible: true });
+      jest.runAllTimers();
+      wrapper.update();
+
+      expect(document.getElementsByClassName('.test-input').value).toBeUndefined();
+      wrapper.unmount();
+    });
   });
 
   it('esc to close', () => {