From 6b2c25ccae84b34d37e5344db76ca3d2ee506f1b Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Tue, 9 Jun 2020 19:18:12 +0800
Subject: [PATCH] chore: Use overflow to hide the tab pane in !animated

---
 src/TabPanelList/TabPane.tsx            | 9 +++++----
 src/TabPanelList/index.tsx              | 4 +---
 tests/__snapshots__/index.test.tsx.snap | 6 ++++--
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/TabPanelList/TabPane.tsx b/src/TabPanelList/TabPane.tsx
index 6efa9b72..f8cfd64c 100644
--- a/src/TabPanelList/TabPane.tsx
+++ b/src/TabPanelList/TabPane.tsx
@@ -44,10 +44,11 @@ export default function TabPane({
 
   const mergedStyle: React.CSSProperties = {};
   if (!active) {
-    if (animated) {
-      mergedStyle.visibility = 'hidden';
-    } else {
-      mergedStyle.display = 'none';
+    mergedStyle.visibility = 'hidden';
+
+    if (!animated) {
+      mergedStyle.height = 0;
+      mergedStyle.overflowY = 'hidden';
     }
   }
 
diff --git a/src/TabPanelList/index.tsx b/src/TabPanelList/index.tsx
index 6480c997..55502a62 100644
--- a/src/TabPanelList/index.tsx
+++ b/src/TabPanelList/index.tsx
@@ -31,9 +31,7 @@ export default function TabPanelList({
         className={classNames(`${prefixCls}-content`, `${prefixCls}-content-${tabPosition}`, {
           [`${prefixCls}-content-animated`]: tabPaneAnimated,
         })}
-        style={
-          tabPaneAnimated ? { [rtl ? 'marginRight' : 'marginLeft']: `-${activeIndex}00%` } : null
-        }
+        style={{ [rtl ? 'marginRight' : 'marginLeft']: `-${activeIndex}00%` }}
       >
         {tabs.map(tab => {
           return React.cloneElement(tab.node, {
diff --git a/tests/__snapshots__/index.test.tsx.snap b/tests/__snapshots__/index.test.tsx.snap
index 43335b17..4f5a1a02 100644
--- a/tests/__snapshots__/index.test.tsx.snap
+++ b/tests/__snapshots__/index.test.tsx.snap
@@ -76,6 +76,7 @@ exports[`Tabs.Basic Normal 1`] = `
   >
     <div
       class="rc-tabs-content rc-tabs-content-top"
+      style="margin-left: -100%;"
     >
       <div
         aria-hidden="true"
@@ -83,7 +84,7 @@ exports[`Tabs.Basic Normal 1`] = `
         class="rc-tabs-tabpane"
         id="rc-tabs-test-panel-light"
         role="tabpanel"
-        style="display: none;"
+        style="visibility: hidden; height: 0px; overflow-y: hidden;"
         tabindex="-1"
       />
       <div
@@ -102,7 +103,7 @@ exports[`Tabs.Basic Normal 1`] = `
         class="rc-tabs-tabpane"
         id="rc-tabs-test-panel-cute"
         role="tabpanel"
-        style="display: none;"
+        style="visibility: hidden; height: 0px; overflow-y: hidden;"
         tabindex="-1"
       />
     </div>
@@ -164,6 +165,7 @@ exports[`Tabs.Basic Skip invalidate children 1`] = `
   >
     <div
       class="rc-tabs-content rc-tabs-content-top"
+      style="margin-left: -000%;"
     >
       <div
         aria-hidden="false"