feat: Remove findDOMNode from rc-css-motion

src/CSSMotion.tsx

@@ -1,6 +1,5 @@
 /* eslint-disable react/default-props-match-prop-types, react/no-multi-comp, react/prop-types */
 import classNames from 'classnames';
-import findDOMNode from 'rc-util/lib/Dom/findDOMNode';
 import { fillRef, getNodeRef, supportRef } from 'rc-util/lib/ref';
 import * as React from 'react';
 import { useRef } from 'react';
@@ -141,18 +140,9 @@ export function genCSSMotion(config: CSSMotionConfig) {
     const wrapperNodeRef = useRef();
 
     function getDomElement() {
-      try {
-        // Here we're avoiding call for findDOMNode since it's deprecated
-        // in strict mode. We're calling it only when node ref is not
-        // an instance of DOM HTMLElement. Otherwise use
-        // findDOMNode as a final resort
-        return nodeRef.current instanceof HTMLElement
-          ? nodeRef.current
-          : findDOMNode<HTMLElement>(wrapperNodeRef.current);
-      } catch (e) {
-        // Only happen when `motionDeadline` trigger but element removed.
-        return null;
-      }
+      return nodeRef.current instanceof HTMLElement
+        ? nodeRef.current
+        : wrapperNodeRef.current;
     }
 
     const [status, statusStep, statusStyle, mergedVisible] = useStatus(

tests/CSSMotion.spec.tsx

@@ -5,7 +5,6 @@
 import { act, fireEvent, render } from '@testing-library/react';
 import classNames from 'classnames';
 import React from 'react';
-import ReactDOM from 'react-dom';
 import type { CSSMotionProps } from '../src';
 import { Provider } from '../src';
 import RefCSSMotion, { genCSSMotion } from '../src/CSSMotion';
@@ -831,74 +830,28 @@ describe('CSSMotion', () => {
   });
 
   describe('strict mode', () => {
-    beforeEach(() => {
-      jest.spyOn(ReactDOM, 'findDOMNode');
-    });
-
-    afterEach(() => {
-      jest.resetAllMocks();
-    });
-
-    it('calls findDOMNode when no refs are passed', () => {
+    it('renders correctly when no ref is passed', () => {
       const Div = () => <div />;
-      render(
-        <CSSMotion motionName="transition" visible>
-          {() => <Div />}
-        </CSSMotion>,
-      );
 
-      act(() => {
-        jest.runAllTimers();
-      });
-
-      expect(ReactDOM.findDOMNode).toHaveBeenCalled();
-    });
-
-    it('does not call findDOMNode when ref is passed internally', () => {
-      render(
+      const { container } = render(
         <CSSMotion motionName="transition" visible>
-          {(props, ref) => <div ref={ref} />}
+          {(props, ref) => <Div {...props} ref={ref} />}
         </CSSMotion>,
       );
 
-      act(() => {
-        jest.runAllTimers();
-      });
-
-      expect(ReactDOM.findDOMNode).not.toHaveBeenCalled();
+      // 检查 DOM 是否渲染出来
+      expect(container.querySelector('div')).toBeInTheDocument();
     });
 
-    it('calls findDOMNode when refs are forwarded but not assigned', () => {
-      const domRef = React.createRef();
-      const Div = () => <div />;
-
-      render(
-        <CSSMotion motionName="transition" visible ref={domRef}>
-          {() => <Div />}
-        </CSSMotion>,
-      );
-
-      act(() => {
-        jest.runAllTimers();
-      });
-
-      expect(ReactDOM.findDOMNode).toHaveBeenCalled();
-    });
-
-    it('does not call findDOMNode when refs are forwarded and assigned', () => {
-      const domRef = React.createRef();
-
-      render(
-        <CSSMotion motionName="transition" visible ref={domRef}>
+    it('renders correctly when ref is passed internally', () => {
+      const { container } = render(
+        <CSSMotion motionName="transition" visible>
           {(props, ref) => <div ref={ref} />}
         </CSSMotion>,
       );
 
-      act(() => {
-        jest.runAllTimers();
-      });
-
-      expect(ReactDOM.findDOMNode).not.toHaveBeenCalled();
+      // 检查 DOM 是否渲染出来
+      expect(container.querySelector('div')).toBeInTheDocument();
     });
   });