From bfec344de547fc593d8f4db78cd6eeac2727d670 Mon Sep 17 00:00:00 2001
From: zombieJ <smith3816@gmail.com>
Date: Sat, 26 Jan 2019 11:55:53 +0800
Subject: [PATCH] Not show spining mask in ie <= 10 (#14511)

* not show spining mask in ie <= 10
fix #14365

* revert, let's use css check for this

* add styleChecker

* add pointer-events check

* delay check spin not support when did mount

* use css hack replace style check
---
 components/_util/isFlexSupported.tsx | 12 ------------
 components/_util/styleChecker.tsx    | 13 +++++++++++++
 components/spin/index.tsx            |  2 +-
 components/spin/style/index.less     |  1 +
 components/tabs/index.tsx            |  4 ++--
 5 files changed, 17 insertions(+), 15 deletions(-)
 delete mode 100644 components/_util/isFlexSupported.tsx
 create mode 100644 components/_util/styleChecker.tsx

diff --git a/components/_util/isFlexSupported.tsx b/components/_util/isFlexSupported.tsx
deleted file mode 100644
index dd6a5ae7ed..0000000000
--- a/components/_util/isFlexSupported.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-export default function isFlexSupported() {
-  if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
-    const { documentElement } = window.document;
-    return (
-      'flex' in documentElement.style ||
-      'webkitFlex' in documentElement.style ||
-      'Flex' in documentElement.style ||
-      'msFlex' in documentElement.style
-    );
-  }
-  return false;
-}
diff --git a/components/_util/styleChecker.tsx b/components/_util/styleChecker.tsx
new file mode 100644
index 0000000000..8c3de765f9
--- /dev/null
+++ b/components/_util/styleChecker.tsx
@@ -0,0 +1,13 @@
+function isStyleSupport(styleName: string | Array<string>): boolean {
+  if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
+    const styleNameList = Array.isArray(styleName) ? styleName : [styleName];
+    const { documentElement } = window.document;
+
+    return styleNameList.some(name => name in documentElement.style);
+  }
+  return false;
+}
+
+export const isFlexSupported = isStyleSupport(['flex', 'webkitFlex', 'Flex', 'msFlex']);
+
+export default isStyleSupport;
diff --git a/components/spin/index.tsx b/components/spin/index.tsx
index 5d82fad74d..b729fc3d7f 100644
--- a/components/spin/index.tsx
+++ b/components/spin/index.tsx
@@ -118,7 +118,7 @@ class Spin extends React.Component<SpinProps, SpinState> {
     if (delay) {
       this.updateSpinning = debounce(this.originalUpdateSpinning, delay);
     }
-  }
+  };
 
   updateSpinning = () => {
     const { spinning } = this.props;
diff --git a/components/spin/style/index.less b/components/spin/style/index.less
index d4533ed89e..6b81ebfcae 100644
--- a/components/spin/style/index.less
+++ b/components/spin/style/index.less
@@ -90,6 +90,7 @@
       height: 100%;
       width: 100%;
       z-index: 10;
+      display: ~'none \9\0';
     }
   }
 
diff --git a/components/tabs/index.tsx b/components/tabs/index.tsx
index 69c4954bc0..499dab8bd9 100755
--- a/components/tabs/index.tsx
+++ b/components/tabs/index.tsx
@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import Icon from '../icon';
 import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
 import warning from '../_util/warning';
-import isFlexSupported from '../_util/isFlexSupported';
+import { isFlexSupported } from '../_util/styleChecker';
 
 export type TabsType = 'line' | 'card' | 'editable-card';
 export type TabsPosition = 'top' | 'right' | 'bottom' | 'left';
@@ -83,7 +83,7 @@ export default class Tabs extends React.Component<TabsProps, any> {
   componentDidMount() {
     const NO_FLEX = ' no-flex';
     const tabNode = ReactDOM.findDOMNode(this) as Element;
-    if (tabNode && !isFlexSupported() && tabNode.className.indexOf(NO_FLEX) === -1) {
+    if (tabNode && !isFlexSupported && tabNode.className.indexOf(NO_FLEX) === -1) {
       tabNode.className += NO_FLEX;
     }
   }