remove React.findDOMNode (#611)

* remove React.findDOMNode

* remove React.fondDOMNode

* validate node.current is Dom node

* add test case

Author: Zyf665

src/Dom/findDOMNode.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
 
 export function isDOM(node: any): node is HTMLElement | SVGElement {
   // https://developer.mozilla.org/en-US/docs/Web/API/Element
@@ -26,15 +25,23 @@ export function getDOM(node: any): HTMLElement | SVGElement | null {
  * Return if a node is a DOM node. Else will return by `findDOMNode`
  */
 export default function findDOMNode<T = Element | Text>(
-  node: React.ReactInstance | HTMLElement | SVGElement | { nativeElement: T },
-): T {
+  node:
+    | React.ReactInstance
+    | HTMLElement
+    | SVGElement
+    | { nativeElement: T }
+    | { current: T },
+): T | null {
   const domNode = getDOM(node);
   if (domNode) {
     return domNode as T;
   }
 
-  if (node instanceof React.Component) {
-    return ReactDOM.findDOMNode?.(node) as unknown as T;
+  if (node && typeof node === 'object' && 'current' in node) {
+    const refDomNode = getDOM(node.current);
+    if (refDomNode) {
+      return refDomNode as T;
+    }
   }
 
   return null;

tests/findDOMNode.test.tsx

@@ -35,12 +35,13 @@ describe('findDOMNode', () => {
     const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
     class DOMWrapper extends React.Component {
+      private elementRef = React.createRef<HTMLDivElement>();
       getDOM = () => {
-        return findDOMNode(this);
+        return findDOMNode(this.elementRef);
       };
 
       render() {
-        return <div />;
+        return <div ref={this.elementRef} />;
       }
     }
 
@@ -53,7 +54,7 @@ describe('findDOMNode', () => {
 
     expect(wrapperRef.current!.getDOM()).toBe(container.firstChild);
 
-    expect(errSpy).toHaveBeenCalled();
+    expect(errSpy).not.toHaveBeenCalled();
     errSpy.mockRestore();
   });
 
@@ -75,7 +76,26 @@ describe('findDOMNode', () => {
       expect(true).toBeFalsy();
     }
   });
+  it('should return DOM node from ref.current', () => {
+    const TestComponent = React.forwardRef<HTMLDivElement>((_, ref) => {
+      return <div ref={ref}>test</div>;
+    });
 
+    const elementRef = React.createRef<HTMLDivElement>();
+    const { container } = render(
+      <React.StrictMode>
+        <TestComponent ref={elementRef} />
+      </React.StrictMode>,
+    );
+
+    expect(findDOMNode(elementRef)).toBe(container.firstChild);
+  });
+
+  it('should return null if ref is not mounted', () => {
+    const elementRef = React.createRef<HTMLDivElement>();
+
+    expect(findDOMNode(elementRef)).toBeNull();
+  });
   it('nativeElement', () => {
     const Element = React.forwardRef<{ nativeElement: HTMLDivElement }>(
       (_, ref) => {