chore: Use latest rc-motion

Author: zombieJ

package.json

@@ -48,6 +48,7 @@
   },
   "devDependencies": {
     "@types/classnames": "^2.2.10",
+    "@types/enzyme": "^3.10.7",
     "@types/jest": "^26.0.4",
     "@types/react": "^16.9.34",
     "@types/react-dom": "^16.9.7",
@@ -65,7 +66,7 @@
   "dependencies": {
     "@babel/runtime": "^7.10.1",
     "classnames": "2.x",
-    "rc-motion": "^2.1.1",
+    "rc-motion": "^2.2.0",
     "rc-util": "^5.0.1"
   }
 }

src/Notification.tsx

@@ -165,8 +165,10 @@ class Notification extends Component<NotificationProps, NotificationState> {
         <CSSMotionList
           keys={noticeKeys}
           motionName={this.getTransitionName()}
-          onLeaveEnd={(_, __, { key }) => {
-            delete this.noticePropsMap[key];
+          onVisibleChanged={(changedVisible, { key }) => {
+            if (!changedVisible) {
+              delete this.noticePropsMap[key];
+            }
           }}
         >
           {({ key, className: motionClassName, style: motionStyle }) => {

tests/hooks.test.js tests/hooks.test.tsxtests/hooks.test.js renamed to tests/hooks.test.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mount, ReactWrapper } from 'enzyme';
 import Notification from '../src';
+import { NotificationInstance } from '../src/Notification';
 
 require('../assets/index.less');
 
@@ -12,13 +13,21 @@ async function timeout(delay = 0) {
 
 describe('Notification.Hooks', () => {
   it('works', async () => {
-    let instance;
+    let instance: NotificationInstance;
 
     const Context = React.createContext({ name: 'light' });
 
-    Notification.newInstance({}, notification => {
-      instance = notification;
-    });
+    let wrapper: ReactWrapper;
+    Notification.newInstance(
+      {
+        TEST_RENDER: (node: React.ReactElement) => {
+          wrapper = mount(<div>{node}</div>);
+        },
+      } as any,
+      notification => {
+        instance = notification;
+      },
+    );
 
     await timeout(0);
 
@@ -30,6 +39,7 @@ describe('Notification.Hooks', () => {
             type="button"
             onClick={() => {
               notify({
+                duration: 0.1,
                 content: (
                   <Context.Consumer>
                     {({ name }) => <div className="context-content">{name}</div>}
@@ -50,6 +60,8 @@ describe('Notification.Hooks', () => {
     expect(demo.find('.context-content').text()).toEqual('bamboo');
 
     await timeout(1000);
+    expect(wrapper.find('Notification').state().notices).toHaveLength(0);
+
     instance.destroy();
   });
 });