From 1425de31b7437356c5051344261f30f6f57c5bbe Mon Sep 17 00:00:00 2001
From: tanjinzhou <415800467@qq.com>
Date: Fri, 14 Aug 2020 11:15:10 +0800
Subject: [PATCH] test: update modal snap

---
 components/modal/__tests__/Modal.test.js      |  6 +--
 .../__snapshots__/Modal.test.js.snap          | 54 ++++++++++++-------
 .../__tests__/__snapshots__/demo.test.js.snap | 54 ++++++++++++++-----
 components/modal/__tests__/confirm.test.js    |  8 +--
 4 files changed, 81 insertions(+), 41 deletions(-)

diff --git a/components/modal/__tests__/Modal.test.js b/components/modal/__tests__/Modal.test.js
index 8930001d7..fb8a6bc7e 100644
--- a/components/modal/__tests__/Modal.test.js
+++ b/components/modal/__tests__/Modal.test.js
@@ -12,10 +12,8 @@ const ModalTester = {
   },
   render() {
     const modalProps = {
-      props: {
-        ...this.$props,
-        getContainer: this.getContainer,
-      },
+      ...this.$props,
+      getContainer: this.getContainer,
     };
     return (
       <div>
diff --git a/components/modal/__tests__/__snapshots__/Modal.test.js.snap b/components/modal/__tests__/__snapshots__/Modal.test.js.snap
index 1e6de6ab0..4fdcc4cd1 100644
--- a/components/modal/__tests__/__snapshots__/Modal.test.js.snap
+++ b/components/modal/__tests__/__snapshots__/Modal.test.js.snap
@@ -5,22 +5,27 @@ exports[`Modal render correctly 1`] = `
   <div>
     <div>
       <div class="ant-modal-root">
-        <div class="ant-modal-mask"></div>
-        <div tabindex="-1" role="dialog" class="ant-modal-wrap ">
-          <div role="document" class="ant-modal" style="width: 520px;">
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
-            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+        <div class="ant-modal-mask fade-enter"></div>
+        <div tabindex="-1" class="ant-modal-wrap" role="dialog">
+          <div role="document" style="width: 520px;" class="ant-modal zoom-enter">
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
+            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+              <!---->
               <div class="ant-modal-body">Here is content of Modal</div>
               <div class="ant-modal-footer">
-                <div><button type="button" class="ant-btn"><span>Cancel</span></button><button type="button" class="ant-btn ant-btn-primary"><span>OK</span></button></div>
+                <div><button class="ant-btn" type="button">
+                    <!----><span>Cancel</span></button><button class="ant-btn ant-btn-primary" type="button">
+                    <!----><span>OK</span></button></div>
               </div>
             </div>
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
           </div>
         </div>
       </div>
     </div>
   </div>
+  <!--teleport start-->
+  <!--teleport end-->
 </div>
 `;
 
@@ -29,22 +34,27 @@ exports[`Modal render correctly 2`] = `
   <div>
     <div>
       <div class="ant-modal-root">
-        <div class="ant-modal-mask"></div>
-        <div tabindex="-1" role="dialog" class="ant-modal-wrap ">
-          <div role="document" class="ant-modal" style="width: 520px;">
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
-            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+        <div class="ant-modal-mask fade-enter"></div>
+        <div tabindex="-1" class="ant-modal-wrap" role="dialog">
+          <div role="document" style="width: 520px;" class="ant-modal zoom-enter">
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
+            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+              <!---->
               <div class="ant-modal-body">Here is content of Modal</div>
               <div class="ant-modal-footer">
-                <div><button type="button" class="ant-btn"><span>Cancel</span></button><button type="button" class="ant-btn ant-btn-primary"><span>OK</span></button></div>
+                <div><button class="ant-btn" type="button">
+                    <!----><span>Cancel</span></button><button class="ant-btn ant-btn-primary" type="button">
+                    <!----><span>OK</span></button></div>
               </div>
             </div>
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
           </div>
         </div>
       </div>
     </div>
   </div>
+  <!--teleport start-->
+  <!--teleport end-->
 </div>
 `;
 
@@ -53,18 +63,22 @@ exports[`Modal render without footer 1`] = `
   <div>
     <div>
       <div class="ant-modal-root">
-        <div class="ant-modal-mask"></div>
-        <div tabindex="-1" role="dialog" class="ant-modal-wrap ">
-          <div role="document" class="ant-modal" style="width: 520px;">
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
-            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg viewBox="64 64 896 896" focusable="false" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+        <div class="ant-modal-mask fade-enter"></div>
+        <div tabindex="-1" class="ant-modal-wrap" role="dialog">
+          <div role="document" style="width: 520px;" class="ant-modal zoom-enter">
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
+            <div class="ant-modal-content"><button type="button" aria-label="Close" class="ant-modal-close"><span class="ant-modal-close-x"><span role="img" aria-label="close" class="anticon anticon-close ant-modal-close-icon"><svg class="" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></span></span></button>
+              <!---->
               <div class="ant-modal-body">Here is content of Modal</div>
+              <!---->
             </div>
-            <div tabindex="0" aria-hidden="true" style="width: 0px; height: 0px; overflow: hidden;"></div>
+            <div tabindex="0" style="width: 0px; height: 0px; overflow: hidden;" aria-hidden="true"></div>
           </div>
         </div>
       </div>
     </div>
   </div>
+  <!--teleport start-->
+  <!--teleport end-->
 </div>
 `;
diff --git a/components/modal/__tests__/__snapshots__/demo.test.js.snap b/components/modal/__tests__/__snapshots__/demo.test.js.snap
index b8c88424d..f24488017 100644
--- a/components/modal/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/modal/__tests__/__snapshots__/demo.test.js.snap
@@ -1,47 +1,75 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders ./antdv-demo/docs/modal/demo/async.md correctly 1`] = `
-<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with async logic</span></button>
+<div><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Open Modal with async logic</span></button>
   <!---->
 </div>
 `;
 
 exports[`renders ./antdv-demo/docs/modal/demo/basic.md correctly 1`] = `
-<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal</span></button>
+<div><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Open Modal</span></button>
   <!---->
 </div>
 `;
 
 exports[`renders ./antdv-demo/docs/modal/demo/button-props.md correctly 1`] = `
-<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with customized button props</span></button>
+<div><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Open Modal with customized button props</span></button>
   <!---->
 </div>
 `;
 
-exports[`renders ./antdv-demo/docs/modal/demo/confirm.md correctly 1`] = `<div><button type="button" class="ant-btn"><span>Confirm</span></button> <button type="button" class="ant-btn ant-btn-dashed"><span>Delete</span></button> <button type="button" class="ant-btn ant-btn-dashed"><span>With extra props</span></button></div>`;
+exports[`renders ./antdv-demo/docs/modal/demo/confirm.md correctly 1`] = `
+<div><button class="ant-btn" type="button">
+    <!----><span>Confirm</span></button><button class="ant-btn ant-btn-dashed" type="button">
+    <!----><span>Delete</span></button><button class="ant-btn ant-btn-dashed" type="button">
+    <!----><span>With extra props</span></button></div>
+`;
 
-exports[`renders ./antdv-demo/docs/modal/demo/confirm-promise.md correctly 1`] = `<button type="button" class="ant-btn"><span>Confirm</span></button>`;
+exports[`renders ./antdv-demo/docs/modal/demo/confirm-promise.md correctly 1`] = `
+<button class="ant-btn" type="button">
+  <!----><span>Confirm</span></button>
+`;
 
-exports[`renders ./antdv-demo/docs/modal/demo/confirm-router.md correctly 1`] = `<button type="button" class="ant-btn"><span>Confirm</span></button>`;
+exports[`renders ./antdv-demo/docs/modal/demo/confirm-router.md correctly 1`] = `
+<button class="ant-btn" type="button">
+  <!----><span>Confirm</span></button>
+`;
 
 exports[`renders ./antdv-demo/docs/modal/demo/footer.md correctly 1`] = `
-<div><button type="button" class="ant-btn ant-btn-primary"><span>Open Modal with customized footer</span></button>
+<div><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Open Modal with customized footer</span></button>
   <!---->
 </div>
 `;
 
-exports[`renders ./antdv-demo/docs/modal/demo/info.md correctly 1`] = `<div><button type="button" class="ant-btn"><span>Info</span></button> <button type="button" class="ant-btn"><span>Success</span></button> <button type="button" class="ant-btn"><span>Error</span></button> <button type="button" class="ant-btn"><span>Warning</span></button></div>`;
+exports[`renders ./antdv-demo/docs/modal/demo/info.md correctly 1`] = `
+<div><button class="ant-btn" type="button">
+    <!----><span>Info</span></button><button class="ant-btn" type="button">
+    <!----><span>Success</span></button><button class="ant-btn" type="button">
+    <!----><span>Error</span></button><button class="ant-btn" type="button">
+    <!----><span>Warning</span></button></div>
+`;
 
 exports[`renders ./antdv-demo/docs/modal/demo/locale.md correctly 1`] = `
-<div><button type="button" class="ant-btn ant-btn-primary"><span>Modal</span></button>
-  <!----> <br> <br> <button type="button" class="ant-btn"><span>Confirm</span></button></div>
+<div><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Modal</span></button>
+  <!----><br><br><button class="ant-btn" type="button">
+    <!----><span>Confirm</span></button></div>
 `;
 
-exports[`renders ./antdv-demo/docs/modal/demo/manual.md correctly 1`] = `<button type="button" class="ant-btn"><span>Open modal to close in 5s</span></button>`;
+exports[`renders ./antdv-demo/docs/modal/demo/manual.md correctly 1`] = `
+<button class="ant-btn" type="button">
+  <!----><span>Open modal to close in 5s</span></button>
+`;
 
 exports[`renders ./antdv-demo/docs/modal/demo/position.md correctly 1`] = `
-<div id="components-modal-demo-position"><button type="button" class="ant-btn ant-btn-primary"><span>Display a modal dialog at 20px to Top</span></button>
-  <!----> <br><br> <button type="button" class="ant-btn ant-btn-primary"><span>Vertically centered modal dialog</span></button>
+<div id="components-modal-demo-position"><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Display a modal dialog at 20px to Top</span></button>
+  <!----><br><br><button class="ant-btn ant-btn-primary" type="button">
+    <!----><span>Vertically centered modal dialog</span></button>
   <!---->
 </div>
 `;
diff --git a/components/modal/__tests__/confirm.test.js b/components/modal/__tests__/confirm.test.js
index b66e1c87a..224fe5f1e 100644
--- a/components/modal/__tests__/confirm.test.js
+++ b/components/modal/__tests__/confirm.test.js
@@ -79,8 +79,8 @@ describe('Modal.confirm triggers callbacks correctly', () => {
 
   it('allows extra props on buttons', async () => {
     open({
-      okButtonProps: { props: { disabled: true } },
-      cancelButtonProps: { attrs: { 'data-test': 'baz' } },
+      okButtonProps: { disabled: true },
+      cancelButtonProps: { 'data-test': 'baz' },
     });
     await sleep();
     expect($$('.ant-btn')).toHaveLength(2);
@@ -88,7 +88,7 @@ describe('Modal.confirm triggers callbacks correctly', () => {
     expect($$('.ant-btn')[1].disabled).toBe(true);
   });
 
-  fit('trigger onCancel once when click on cancel button', async () => {
+  it('trigger onCancel once when click on cancel button', async () => {
     const arr = ['info', 'success', 'warning', 'error'];
     for (let type of arr) {
       Modal[type]({
@@ -98,7 +98,7 @@ describe('Modal.confirm triggers callbacks correctly', () => {
       await sleep();
       expect($$(`.ant-modal-confirm-${type}`)).toHaveLength(1);
       $$('.ant-btn')[0].click();
-      await sleep();
+      await sleep(500);
       expect($$(`.ant-modal-confirm-${type}`)).toHaveLength(0);
     }
   });