From 0097d34d013b8422a7a471fb2ffbbac77db850a1 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, 2 Sep 2020 18:30:27 +0800
Subject: [PATCH] fix: Update `rc-motion` deps & fix ssr (#26542)

* chore: Update rc-motion deps

* frame wheel not prevent scroll

* update ts
---
 components/_util/motion.tsx                   |    3 +-
 .../__snapshots__/type.test.tsx.snap          |   52 +-
 components/button/__tests__/type.test.tsx     |   16 +-
 .../__snapshots__/index.test.js.snap          | 1140 +++--------------
 components/cascader/__tests__/index.test.js   |    6 +-
 package.json                                  |    2 +-
 6 files changed, 160 insertions(+), 1059 deletions(-)

diff --git a/components/_util/motion.tsx b/components/_util/motion.tsx
index f9c5a7f431..1c58df584e 100644
--- a/components/_util/motion.tsx
+++ b/components/_util/motion.tsx
@@ -1,5 +1,4 @@
-import { CSSMotionProps } from 'rc-motion';
-import { MotionEventHandler, MotionEndEventHandler } from 'rc-motion/lib/CSSMotion';
+import { CSSMotionProps, MotionEventHandler, MotionEndEventHandler } from 'rc-motion';
 
 // ================== Collapse Motion ==================
 const getCollapsedHeight: MotionEventHandler = () => ({ height: 0, opacity: 0 });
diff --git a/components/button/__tests__/__snapshots__/type.test.tsx.snap b/components/button/__tests__/__snapshots__/type.test.tsx.snap
index 0fb8c86a6d..b3836621c7 100644
--- a/components/button/__tests__/__snapshots__/type.test.tsx.snap
+++ b/components/button/__tests__/__snapshots__/type.test.tsx.snap
@@ -291,54 +291,10 @@ exports[`Button should not render as link button when href is undefined 1`] = `
 `;
 
 exports[`Button should render empty button without errors 1`] = `
-<Button
-  block={false}
-  ghost={false}
-  htmlType="button"
-  loading={false}
->
-  <Wave>
-    <button
-      className="ant-btn"
-      onClick={[Function]}
-      type="button"
-    >
-      <LoadingIcon
-        existIcon={false}
-        loading={false}
-        prefixCls="ant-btn"
-      >
-        <ForwardRef
-          motionName="ant-btn-loading-icon-motion"
-          onAppearActive={[Function]}
-          onAppearStart={[Function]}
-          onEnterActive={[Function]}
-          onEnterStart={[Function]}
-          onLeaveActive={[Function]}
-          onLeaveStart={[Function]}
-          removeOnLeave={true}
-          visible={false}
-        >
-          <CSSMotion
-            internalRef={null}
-            motionAppear={true}
-            motionEnter={true}
-            motionLeave={true}
-            motionName="ant-btn-loading-icon-motion"
-            onAppearActive={[Function]}
-            onAppearStart={[Function]}
-            onEnterActive={[Function]}
-            onEnterStart={[Function]}
-            onLeaveActive={[Function]}
-            onLeaveStart={[Function]}
-            removeOnLeave={true}
-            visible={false}
-          />
-        </ForwardRef>
-      </LoadingIcon>
-    </button>
-  </Wave>
-</Button>
+<button
+  class="ant-btn"
+  type="button"
+/>
 `;
 
 exports[`Button should support link button 1`] = `
diff --git a/components/button/__tests__/type.test.tsx b/components/button/__tests__/type.test.tsx
index d7d1d676be..2daa119c54 100644
--- a/components/button/__tests__/type.test.tsx
+++ b/components/button/__tests__/type.test.tsx
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { mount, render } from 'enzyme';
 import { act } from 'react-dom/test-utils';
 import { SearchOutlined } from '@ant-design/icons';
-import { resetWarned } from 'rc-util/lib/warning'
+import { resetWarned } from 'rc-util/lib/warning';
 import Button from '..';
 import ConfigProvider from '../../config-provider';
 import mountTest from '../../../tests/shared/mountTest';
@@ -111,7 +111,7 @@ describe('Button', () => {
         {undefined}
       </Button>,
     );
-    expect(wrapper).toMatchSnapshot();
+    expect(wrapper.render()).toMatchSnapshot();
   });
 
   it('have static property for type detecting', () => {
@@ -282,7 +282,7 @@ describe('Button', () => {
   });
 
   it('should warning when pass a string as icon props', () => {
-    resetWarned()
+    resetWarned();
     const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     mount(<Button type="primary" icon="ab" />);
     expect(warnSpy).not.toHaveBeenCalled();
@@ -294,24 +294,24 @@ describe('Button', () => {
   });
 
   it('should warning when pass type=link and ghost=true', () => {
-    resetWarned()
+    resetWarned();
     const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     mount(<Button type="link" ghost />);
     expect(warnSpy).toHaveBeenCalledWith(
       "Warning: [antd: Button] `link` or `text` button can't be a `ghost` button.",
     );
     warnSpy.mockRestore();
-  })
-  
+  });
+
   it('should warning when pass type=text and ghost=true', () => {
-    resetWarned()
+    resetWarned();
     const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     mount(<Button type="text" ghost />);
     expect(warnSpy).toHaveBeenCalledWith(
       "Warning: [antd: Button] `link` or `text` button can't be a `ghost` button.",
     );
     warnSpy.mockRestore();
-  })
+  });
 
   it('skip check 2 words when ConfigProvider disable this', () => {
     const wrapper = mount(
diff --git a/components/cascader/__tests__/__snapshots__/index.test.js.snap b/components/cascader/__tests__/__snapshots__/index.test.js.snap
index 0883343fe1..ae71753306 100644
--- a/components/cascader/__tests__/__snapshots__/index.test.js.snap
+++ b/components/cascader/__tests__/__snapshots__/index.test.js.snap
@@ -1042,402 +1042,40 @@ exports[`Cascader rtl render component should be rendered correctly in RTL direc
 `;
 
 exports[`Cascader should highlight keyword and filter when search in Cascader 1`] = `
-<Popup
-  align={
-    Object {
-      "offset": Array [
-        0,
-        4,
-      ],
-      "overflow": Object {
-        "adjustX": 1,
-        "adjustY": 1,
-      },
-      "points": Array [
-        "tl",
-        "bl",
-      ],
-    }
-  }
-  className=""
-  destroyPopupOnHide={false}
-  getClassNameFromAlign={[Function]}
-  getRootDomNode={[Function]}
-  mask={false}
-  onAlign={[Function]}
-  onMouseDown={[Function]}
-  onTouchStart={[Function]}
-  prefixCls="ant-cascader-menus"
-  style={Object {}}
-  transitionName="slide-up"
-  visible={true}
->
-  <div>
-    <ForwardRef
-      leavedClassName="ant-cascader-menus-hidden"
-      motionAppear={false}
-      motionEnter={false}
-      motionLeave={false}
-      motionName="slide-up"
-      onAppearStart={[Function]}
-      onEnterEnd={[Function]}
-      onEnterStart={[Function]}
-      onLeaveEnd={[Function]}
-      onLeaveStart={[Function]}
-      removeOnLeave={false}
-      visible={true}
-    >
-      <CSSMotion
-        internalRef={null}
-        leavedClassName="ant-cascader-menus-hidden"
-        motionAppear={false}
-        motionEnter={false}
-        motionLeave={false}
-        motionName="slide-up"
-        onAppearStart={[Function]}
-        onEnterEnd={[Function]}
-        onEnterStart={[Function]}
-        onLeaveEnd={[Function]}
-        onLeaveStart={[Function]}
-        removeOnLeave={false}
-        visible={true}
+<div>
+  <div
+    class="ant-cascader-menus"
+    style="opacity: 0; pointer-events: none;"
+  >
+    <div>
+      <ul
+        class="ant-cascader-menu"
+        style="width: 0px;"
       >
-        <Align
-          align={
-            Object {
-              "offset": Array [
-                0,
-                4,
-              ],
-              "overflow": Object {
-                "adjustX": 1,
-                "adjustY": 1,
-              },
-              "points": Array [
-                "tl",
-                "bl",
-              ],
-            }
-          }
-          disabled={true}
-          key="popup"
-          monitorWindowResize={true}
-          onAlign={[Function]}
-          target={[Function]}
+        <li
+          class="ant-cascader-menu-item"
+          role="menuitem"
+          title=""
         >
-          <PopupInner
-            className="ant-cascader-menus"
-            onMouseDown={[Function]}
-            onTouchStart={[Function]}
-            prefixCls="ant-cascader-menus"
-            style={
-              Object {
-                "opacity": 0,
-                "pointerEvents": "none",
-                "zIndex": undefined,
-              }
-            }
+          Jiangsu / Nanjing / Zhong Hua Men
+        </li>
+        <li
+          class="ant-cascader-menu-item"
+          role="menuitem"
+          title=""
+        >
+          Zhejiang / Hang
+          <span
+            class="ant-cascader-menu-item-keyword"
           >
-            <div
-              className="ant-cascader-menus"
-              onMouseDown={[Function]}
-              onTouchStart={[Function]}
-              style={
-                Object {
-                  "opacity": 0,
-                  "pointerEvents": "none",
-                  "zIndex": undefined,
-                }
-              }
-            >
-              <Menus
-                activeValue={Array []}
-                allowClear={true}
-                builtinPlacements={
-                  Object {
-                    "bottomLeft": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tl",
-                        "bl",
-                      ],
-                    },
-                    "bottomRight": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tr",
-                        "br",
-                      ],
-                    },
-                    "topLeft": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "bl",
-                        "tl",
-                      ],
-                    },
-                    "topRight": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "br",
-                        "tr",
-                      ],
-                    },
-                  }
-                }
-                defaultFieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                disabled={false}
-                dropdownMenuColumnStyle={
-                  Object {
-                    "width": 0,
-                  }
-                }
-                expandIcon={<ForwardRef(RightOutlined) />}
-                expandTrigger="click"
-                fieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                loadingIcon={
-                  <span
-                    className="ant-cascader-menu-item-loading-icon"
-                  >
-                    <ForwardRef(RedoOutlined)
-                      spin={true}
-                    />
-                  </span>
-                }
-                onChange={[Function]}
-                onItemDoubleClick={[Function]}
-                onPopupVisibleChange={[Function]}
-                onSelect={[Function]}
-                options={
-                  Array [
-                    Object {
-                      "__IS_FILTERED_OPTION": true,
-                      "disabled": false,
-                      "isEmptyNode": true,
-                      "label": Array [
-                        "Jiangsu",
-                        Array [
-                          " / ",
-                          "Nanjing",
-                        ],
-                        Array [
-                          " / ",
-                          "Zhong Hua Men",
-                        ],
-                      ],
-                      "path": Array [
-                        Object {
-                          "children": Array [
-                            Object {
-                              "children": Array [
-                                Object {
-                                  "label": "Zhong Hua Men",
-                                  "value": "zhonghuamen",
-                                },
-                              ],
-                              "label": "Nanjing",
-                              "value": "nanjing",
-                            },
-                          ],
-                          "label": "Jiangsu",
-                          "value": "jiangsu",
-                        },
-                        Object {
-                          "children": Array [
-                            Object {
-                              "label": "Zhong Hua Men",
-                              "value": "zhonghuamen",
-                            },
-                          ],
-                          "label": "Nanjing",
-                          "value": "nanjing",
-                        },
-                        Object {
-                          "label": "Zhong Hua Men",
-                          "value": "zhonghuamen",
-                        },
-                      ],
-                      "value": Array [
-                        "jiangsu",
-                        "nanjing",
-                        "zhonghuamen",
-                      ],
-                    },
-                    Object {
-                      "__IS_FILTERED_OPTION": true,
-                      "disabled": false,
-                      "isEmptyNode": true,
-                      "label": Array [
-                        "Zhejiang",
-                        Array [
-                          " / ",
-                          Array [
-                            "Hang",
-                            Array [
-                              <span
-                                className="ant-cascader-menu-item-keyword"
-                              >
-                                z
-                              </span>,
-                              "hou",
-                            ],
-                          ],
-                        ],
-                        Array [
-                          " / ",
-                          "West Lake",
-                        ],
-                      ],
-                      "path": Array [
-                        Object {
-                          "children": Array [
-                            Object {
-                              "children": Array [
-                                Object {
-                                  "label": "West Lake",
-                                  "value": "xihu",
-                                },
-                              ],
-                              "label": "Hangzhou",
-                              "value": "hangzhou",
-                            },
-                          ],
-                          "label": "Zhejiang",
-                          "value": "zhejiang",
-                        },
-                        Object {
-                          "children": Array [
-                            Object {
-                              "label": "West Lake",
-                              "value": "xihu",
-                            },
-                          ],
-                          "label": "Hangzhou",
-                          "value": "hangzhou",
-                        },
-                        Object {
-                          "label": "West Lake",
-                          "value": "xihu",
-                        },
-                      ],
-                      "value": Array [
-                        "zhejiang",
-                        "hangzhou",
-                        "xihu",
-                      ],
-                    },
-                  ]
-                }
-                popupClassName=""
-                popupPlacement="bottomLeft"
-                popupVisible={true}
-                prefixCls="ant-cascader"
-                showSearch={
-                  Object {
-                    "filter": [Function],
-                  }
-                }
-                transitionName="slide-up"
-                value={Array []}
-                visible={true}
-              >
-                <div>
-                  <ul
-                    className="ant-cascader-menu"
-                    key="0"
-                    style={
-                      Object {
-                        "width": 0,
-                      }
-                    }
-                  >
-                    <li
-                      className="ant-cascader-menu-item"
-                      key="jiangsu,nanjing,zhonghuamen"
-                      onClick={[Function]}
-                      onDoubleClick={[Function]}
-                      onMouseDown={[Function]}
-                      role="menuitem"
-                      title=""
-                    >
-                      Jiangsu
-                       / 
-                      Nanjing
-                       / 
-                      Zhong Hua Men
-                    </li>
-                    <li
-                      className="ant-cascader-menu-item"
-                      key="zhejiang,hangzhou,xihu"
-                      onClick={[Function]}
-                      onDoubleClick={[Function]}
-                      onMouseDown={[Function]}
-                      role="menuitem"
-                      title=""
-                    >
-                      Zhejiang
-                       / 
-                      Hang
-                      <span
-                        className="ant-cascader-menu-item-keyword"
-                        key="seperator"
-                      >
-                        z
-                      </span>
-                      hou
-                       / 
-                      West Lake
-                    </li>
-                  </ul>
-                </div>
-              </Menus>
-            </div>
-          </PopupInner>
-        </Align>
-      </CSSMotion>
-    </ForwardRef>
+            z
+          </span>
+          hou / West Lake
+        </li>
+      </ul>
+    </div>
   </div>
-</Popup>
+</div>
 `;
 
 exports[`Cascader should highlight keyword and filter when search in Cascader with same field name of label and value 1`] = `
@@ -1484,632 +1122,140 @@ exports[`Cascader should highlight keyword and filter when search in Cascader wi
 `;
 
 exports[`Cascader should render not found content 1`] = `
-<Popup
-  align={
-    Object {
-      "offset": Array [
-        0,
-        4,
-      ],
-      "overflow": Object {
-        "adjustX": 1,
-        "adjustY": 1,
-      },
-      "points": Array [
-        "tl",
-        "bl",
-      ],
-    }
-  }
-  className="ant-cascader-menu-empty"
-  destroyPopupOnHide={false}
-  getClassNameFromAlign={[Function]}
-  getRootDomNode={[Function]}
-  mask={false}
-  onAlign={[Function]}
-  onMouseDown={[Function]}
-  onTouchStart={[Function]}
-  prefixCls="ant-cascader-menus"
-  style={Object {}}
-  transitionName="slide-up"
-  visible={true}
->
-  <div>
-    <ForwardRef
-      leavedClassName="ant-cascader-menus-hidden"
-      motionAppear={false}
-      motionEnter={false}
-      motionLeave={false}
-      motionName="slide-up"
-      onAppearStart={[Function]}
-      onEnterEnd={[Function]}
-      onEnterStart={[Function]}
-      onLeaveEnd={[Function]}
-      onLeaveStart={[Function]}
-      removeOnLeave={false}
-      visible={true}
-    >
-      <CSSMotion
-        internalRef={null}
-        leavedClassName="ant-cascader-menus-hidden"
-        motionAppear={false}
-        motionEnter={false}
-        motionLeave={false}
-        motionName="slide-up"
-        onAppearStart={[Function]}
-        onEnterEnd={[Function]}
-        onEnterStart={[Function]}
-        onLeaveEnd={[Function]}
-        onLeaveStart={[Function]}
-        removeOnLeave={false}
-        visible={true}
+<div>
+  <div
+    class="ant-cascader-menus ant-cascader-menu-empty"
+    style="opacity: 0; pointer-events: none;"
+  >
+    <div>
+      <ul
+        class="ant-cascader-menu"
+        style="height: auto; width: 0px;"
       >
-        <Align
-          align={
-            Object {
-              "offset": Array [
-                0,
-                4,
-              ],
-              "overflow": Object {
-                "adjustX": 1,
-                "adjustY": 1,
-              },
-              "points": Array [
-                "tl",
-                "bl",
-              ],
-            }
-          }
-          disabled={true}
-          key="popup"
-          monitorWindowResize={true}
-          onAlign={[Function]}
-          target={[Function]}
+        <li
+          class="ant-cascader-menu-item ant-cascader-menu-item-disabled"
+          role="menuitem"
+          title=""
         >
-          <PopupInner
-            className="ant-cascader-menus ant-cascader-menu-empty"
-            onMouseDown={[Function]}
-            onTouchStart={[Function]}
-            prefixCls="ant-cascader-menus"
-            style={
-              Object {
-                "opacity": 0,
-                "pointerEvents": "none",
-                "zIndex": undefined,
-              }
-            }
+          <div
+            class="ant-empty ant-empty-normal ant-empty-small"
           >
             <div
-              className="ant-cascader-menus ant-cascader-menu-empty"
-              onMouseDown={[Function]}
-              onTouchStart={[Function]}
-              style={
-                Object {
-                  "opacity": 0,
-                  "pointerEvents": "none",
-                  "zIndex": undefined,
-                }
-              }
+              class="ant-empty-image"
             >
-              <Menus
-                activeValue={Array []}
-                allowClear={true}
-                builtinPlacements={
-                  Object {
-                    "bottomLeft": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tl",
-                        "bl",
-                      ],
-                    },
-                    "bottomRight": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tr",
-                        "br",
-                      ],
-                    },
-                    "topLeft": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "bl",
-                        "tl",
-                      ],
-                    },
-                    "topRight": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "br",
-                        "tr",
-                      ],
-                    },
-                  }
-                }
-                defaultFieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                disabled={false}
-                dropdownMenuColumnStyle={
-                  Object {
-                    "height": "auto",
-                    "width": 0,
-                  }
-                }
-                expandIcon={<ForwardRef(RightOutlined) />}
-                expandTrigger="click"
-                fieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                loadingIcon={
-                  <span
-                    className="ant-cascader-menu-item-loading-icon"
-                  >
-                    <ForwardRef(RedoOutlined)
-                      spin={true}
-                    />
-                  </span>
-                }
-                onChange={[Function]}
-                onItemDoubleClick={[Function]}
-                onPopupVisibleChange={[Function]}
-                onSelect={[Function]}
-                options={
-                  Array [
-                    Object {
-                      "disabled": true,
-                      "isEmptyNode": true,
-                      "label": <Context.Consumer>
-                        [Function]
-                      </Context.Consumer>,
-                      "value": "ANT_CASCADER_NOT_FOUND",
-                    },
-                  ]
-                }
-                popupClassName="ant-cascader-menu-empty"
-                popupPlacement="bottomLeft"
-                popupVisible={true}
-                prefixCls="ant-cascader"
-                showSearch={
-                  Object {
-                    "filter": [Function],
-                  }
-                }
-                transitionName="slide-up"
-                value={Array []}
-                visible={true}
+              <svg
+                class="ant-empty-img-simple"
+                height="41"
+                viewBox="0 0 64 41"
+                width="64"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <div>
-                  <ul
-                    className="ant-cascader-menu"
-                    key="0"
-                    style={
-                      Object {
-                        "height": "auto",
-                        "width": 0,
-                      }
-                    }
+                <g
+                  fill="none"
+                  fill-rule="evenodd"
+                  transform="translate(0 1)"
+                >
+                  <ellipse
+                    class="ant-empty-img-simple-ellipse"
+                    cx="32"
+                    cy="33"
+                    rx="32"
+                    ry="7"
+                  />
+                  <g
+                    class="ant-empty-img-simple-g"
+                    fill-rule="nonzero"
                   >
-                    <li
-                      className="ant-cascader-menu-item ant-cascader-menu-item-disabled"
-                      key="ANT_CASCADER_NOT_FOUND"
-                      onClick={[Function]}
-                      onDoubleClick={[Function]}
-                      onMouseDown={[Function]}
-                      role="menuitem"
-                      title=""
-                    >
-                      <Empty
-                        className="ant-empty-small"
-                        image={<Simple />}
-                      >
-                        <LocaleReceiver
-                          componentName="Empty"
-                        >
-                          <div
-                            className="ant-empty ant-empty-normal ant-empty-small"
-                          >
-                            <div
-                              className="ant-empty-image"
-                            >
-                              <Simple>
-                                <svg
-                                  className="ant-empty-img-simple"
-                                  height="41"
-                                  viewBox="0 0 64 41"
-                                  width="64"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                >
-                                  <g
-                                    fill="none"
-                                    fillRule="evenodd"
-                                    transform="translate(0 1)"
-                                  >
-                                    <ellipse
-                                      className="ant-empty-img-simple-ellipse"
-                                      cx="32"
-                                      cy="33"
-                                      rx="32"
-                                      ry="7"
-                                    />
-                                    <g
-                                      className="ant-empty-img-simple-g"
-                                      fillRule="nonzero"
-                                    >
-                                      <path
-                                        d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
-                                      />
-                                      <path
-                                        className="ant-empty-img-simple-path"
-                                        d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
-                                      />
-                                    </g>
-                                  </g>
-                                </svg>
-                              </Simple>
-                            </div>
-                            <p
-                              className="ant-empty-description"
-                            >
-                              No Data
-                            </p>
-                          </div>
-                        </LocaleReceiver>
-                      </Empty>
-                    </li>
-                  </ul>
-                </div>
-              </Menus>
+                    <path
+                      d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
+                    />
+                    <path
+                      class="ant-empty-img-simple-path"
+                      d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
+                    />
+                  </g>
+                </g>
+              </svg>
             </div>
-          </PopupInner>
-        </Align>
-      </CSSMotion>
-    </ForwardRef>
+            <p
+              class="ant-empty-description"
+            >
+              No Data
+            </p>
+          </div>
+        </li>
+      </ul>
+    </div>
   </div>
-</Popup>
+</div>
 `;
 
 exports[`Cascader should show not found content when options.length is 0 1`] = `
-<Popup
-  align={
-    Object {
-      "offset": Array [
-        0,
-        4,
-      ],
-      "overflow": Object {
-        "adjustX": 1,
-        "adjustY": 1,
-      },
-      "points": Array [
-        "tl",
-        "bl",
-      ],
-    }
-  }
-  className="ant-cascader-menu-empty"
-  destroyPopupOnHide={false}
-  getClassNameFromAlign={[Function]}
-  getRootDomNode={[Function]}
-  mask={false}
-  onAlign={[Function]}
-  onMouseDown={[Function]}
-  onTouchStart={[Function]}
-  prefixCls="ant-cascader-menus"
-  style={Object {}}
-  transitionName="slide-up"
-  visible={true}
->
-  <div>
-    <ForwardRef
-      leavedClassName="ant-cascader-menus-hidden"
-      motionAppear={false}
-      motionEnter={false}
-      motionLeave={false}
-      motionName="slide-up"
-      onAppearStart={[Function]}
-      onEnterEnd={[Function]}
-      onEnterStart={[Function]}
-      onLeaveEnd={[Function]}
-      onLeaveStart={[Function]}
-      removeOnLeave={false}
-      visible={true}
-    >
-      <CSSMotion
-        internalRef={null}
-        leavedClassName="ant-cascader-menus-hidden"
-        motionAppear={false}
-        motionEnter={false}
-        motionLeave={false}
-        motionName="slide-up"
-        onAppearStart={[Function]}
-        onEnterEnd={[Function]}
-        onEnterStart={[Function]}
-        onLeaveEnd={[Function]}
-        onLeaveStart={[Function]}
-        removeOnLeave={false}
-        visible={true}
+<div>
+  <div
+    class="ant-cascader-menus ant-cascader-menu-empty"
+    style="opacity: 0; pointer-events: none;"
+  >
+    <div>
+      <ul
+        class="ant-cascader-menu"
       >
-        <Align
-          align={
-            Object {
-              "offset": Array [
-                0,
-                4,
-              ],
-              "overflow": Object {
-                "adjustX": 1,
-                "adjustY": 1,
-              },
-              "points": Array [
-                "tl",
-                "bl",
-              ],
-            }
-          }
-          disabled={true}
-          key="popup"
-          monitorWindowResize={true}
-          onAlign={[Function]}
-          target={[Function]}
+        <li
+          class="ant-cascader-menu-item"
+          role="menuitem"
+          title=""
         >
-          <PopupInner
-            className="ant-cascader-menus ant-cascader-menu-empty"
-            onMouseDown={[Function]}
-            onTouchStart={[Function]}
-            prefixCls="ant-cascader-menus"
-            style={
-              Object {
-                "opacity": 0,
-                "pointerEvents": "none",
-                "zIndex": undefined,
-              }
-            }
+          <div
+            class="ant-empty ant-empty-normal ant-empty-small"
           >
             <div
-              className="ant-cascader-menus ant-cascader-menu-empty"
-              onMouseDown={[Function]}
-              onTouchStart={[Function]}
-              style={
-                Object {
-                  "opacity": 0,
-                  "pointerEvents": "none",
-                  "zIndex": undefined,
-                }
-              }
+              class="ant-empty-image"
             >
-              <Menus
-                activeValue={Array []}
-                allowClear={true}
-                builtinPlacements={
-                  Object {
-                    "bottomLeft": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tl",
-                        "bl",
-                      ],
-                    },
-                    "bottomRight": Object {
-                      "offset": Array [
-                        0,
-                        4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "tr",
-                        "br",
-                      ],
-                    },
-                    "topLeft": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "bl",
-                        "tl",
-                      ],
-                    },
-                    "topRight": Object {
-                      "offset": Array [
-                        0,
-                        -4,
-                      ],
-                      "overflow": Object {
-                        "adjustX": 1,
-                        "adjustY": 1,
-                      },
-                      "points": Array [
-                        "br",
-                        "tr",
-                      ],
-                    },
-                  }
-                }
-                defaultFieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                disabled={false}
-                dropdownMenuColumnStyle={Object {}}
-                expandIcon={<ForwardRef(RightOutlined) />}
-                expandTrigger="click"
-                fieldNames={
-                  Object {
-                    "children": "children",
-                    "label": "label",
-                    "value": "value",
-                  }
-                }
-                loadingIcon={
-                  <span
-                    className="ant-cascader-menu-item-loading-icon"
-                  >
-                    <ForwardRef(RedoOutlined)
-                      spin={true}
-                    />
-                  </span>
-                }
-                onChange={[Function]}
-                onItemDoubleClick={[Function]}
-                onPopupVisibleChange={[Function]}
-                onSelect={[Function]}
-                options={
-                  Array [
-                    Object {
-                      "label": <Context.Consumer>
-                        [Function]
-                      </Context.Consumer>,
-                      "value": "ANT_CASCADER_NOT_FOUND",
-                    },
-                  ]
-                }
-                popupClassName="ant-cascader-menu-empty"
-                popupPlacement="bottomLeft"
-                popupVisible={true}
-                prefixCls="ant-cascader"
-                transitionName="slide-up"
-                value={Array []}
-                visible={true}
+              <svg
+                class="ant-empty-img-simple"
+                height="41"
+                viewBox="0 0 64 41"
+                width="64"
+                xmlns="http://www.w3.org/2000/svg"
               >
-                <div>
-                  <ul
-                    className="ant-cascader-menu"
-                    key="0"
-                    style={Object {}}
+                <g
+                  fill="none"
+                  fill-rule="evenodd"
+                  transform="translate(0 1)"
+                >
+                  <ellipse
+                    class="ant-empty-img-simple-ellipse"
+                    cx="32"
+                    cy="33"
+                    rx="32"
+                    ry="7"
+                  />
+                  <g
+                    class="ant-empty-img-simple-g"
+                    fill-rule="nonzero"
                   >
-                    <li
-                      className="ant-cascader-menu-item"
-                      key="ANT_CASCADER_NOT_FOUND"
-                      onClick={[Function]}
-                      onDoubleClick={[Function]}
-                      onMouseDown={[Function]}
-                      role="menuitem"
-                      title=""
-                    >
-                      <Empty
-                        className="ant-empty-small"
-                        image={<Simple />}
-                      >
-                        <LocaleReceiver
-                          componentName="Empty"
-                        >
-                          <div
-                            className="ant-empty ant-empty-normal ant-empty-small"
-                          >
-                            <div
-                              className="ant-empty-image"
-                            >
-                              <Simple>
-                                <svg
-                                  className="ant-empty-img-simple"
-                                  height="41"
-                                  viewBox="0 0 64 41"
-                                  width="64"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                >
-                                  <g
-                                    fill="none"
-                                    fillRule="evenodd"
-                                    transform="translate(0 1)"
-                                  >
-                                    <ellipse
-                                      className="ant-empty-img-simple-ellipse"
-                                      cx="32"
-                                      cy="33"
-                                      rx="32"
-                                      ry="7"
-                                    />
-                                    <g
-                                      className="ant-empty-img-simple-g"
-                                      fillRule="nonzero"
-                                    >
-                                      <path
-                                        d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
-                                      />
-                                      <path
-                                        className="ant-empty-img-simple-path"
-                                        d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
-                                      />
-                                    </g>
-                                  </g>
-                                </svg>
-                              </Simple>
-                            </div>
-                            <p
-                              className="ant-empty-description"
-                            >
-                              No Data
-                            </p>
-                          </div>
-                        </LocaleReceiver>
-                      </Empty>
-                    </li>
-                  </ul>
-                </div>
-              </Menus>
+                    <path
+                      d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z"
+                    />
+                    <path
+                      class="ant-empty-img-simple-path"
+                      d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
+                    />
+                  </g>
+                </g>
+              </svg>
             </div>
-          </PopupInner>
-        </Align>
-      </CSSMotion>
-    </ForwardRef>
+            <p
+              class="ant-empty-description"
+            >
+              No Data
+            </p>
+          </div>
+        </li>
+      </ul>
+    </div>
   </div>
-</Popup>
+</div>
 `;
 
 exports[`Cascader support controlled mode 1`] = `
diff --git a/components/cascader/__tests__/index.test.js b/components/cascader/__tests__/index.test.js
index 73a7e6424f..50ba05cf98 100644
--- a/components/cascader/__tests__/index.test.js
+++ b/components/cascader/__tests__/index.test.js
@@ -134,7 +134,7 @@ describe('Cascader', () => {
     wrapper.find('input').simulate('change', { target: { value: 'z' } });
     expect(wrapper.state('inputValue')).toBe('z');
     const popupWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(popupWrapper).toMatchSnapshot();
+    expect(popupWrapper.render()).toMatchSnapshot();
   });
 
   it('should highlight keyword and filter when search in Cascader with same field name of label and value', () => {
@@ -184,7 +184,7 @@ describe('Cascader', () => {
     wrapper.find('input').simulate('change', { target: { value: '__notfoundkeyword__' } });
     expect(wrapper.state('inputValue')).toBe('__notfoundkeyword__');
     const popupWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(popupWrapper).toMatchSnapshot();
+    expect(popupWrapper.render()).toMatchSnapshot();
   });
 
   it('should support to clear selection', async () => {
@@ -318,7 +318,7 @@ describe('Cascader', () => {
     const wrapper = mount(<Cascader options={customerOptions} />);
     wrapper.find('input').simulate('click');
     const popupWrapper = mount(wrapper.find('Trigger').instance().getComponent());
-    expect(popupWrapper).toMatchSnapshot();
+    expect(popupWrapper.render()).toMatchSnapshot();
   });
 
   describe('limit filtered item count', () => {
diff --git a/package.json b/package.json
index d3527cd4d5..673321f03d 100644
--- a/package.json
+++ b/package.json
@@ -129,7 +129,7 @@
     "rc-input-number": "~6.0.0",
     "rc-mentions": "~1.4.0",
     "rc-menu": "~8.5.2",
-    "rc-motion": "^1.0.0",
+    "rc-motion": "^1.1.1",
     "rc-notification": "~4.4.0",
     "rc-pagination": "~3.0.3",
     "rc-picker": "~2.0.6",