feat: Tooltip ref support nativeElement (#463)

Author: zombieJ

package.json

@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.11.2",
-    "@rc-component/trigger": "^1.17.0",
+    "@rc-component/trigger": "^1.18.0",
     "classnames": "^2.3.1"
   },
   "devDependencies": {

src/Tooltip.tsx

@@ -43,6 +43,7 @@ export interface TooltipProps
 }
 
 export interface TooltipRef {
+  nativeElement: HTMLElement;
   forceAlign: VoidFunction;
 }
 
@@ -74,7 +75,7 @@ const Tooltip = (props: TooltipProps, ref: React.Ref<TooltipRef>) => {
   } = props;
 
   const triggerRef = useRef<TriggerRef>(null);
-  useImperativeHandle(ref, () => triggerRef.current as TriggerRef);
+  useImperativeHandle(ref, () => triggerRef.current);
 
   const extraProps: Partial<TooltipProps & TriggerProps> = { ...restProps };
   if ('visible' in props) {

tests/index.test.tsx

@@ -1,6 +1,6 @@
 import { act, fireEvent, render } from '@testing-library/react';
 import React from 'react';
-import Tooltip from '../src';
+import Tooltip, { TooltipRef } from '../src';
 
 const verifyContent = (wrapper: HTMLElement, content: string) => {
   expect(wrapper.querySelector('.x-content').textContent).toBe(content);
@@ -188,7 +188,7 @@ describe('rc-tooltip', () => {
           placement="left"
           overlay={<strong className="x-content">Tooltip content</strong>}
           showArrow={{
-            className: 'abc'
+            className: 'abc',
           }}
         >
           <div className="target">Click this</div>
@@ -239,4 +239,16 @@ describe('rc-tooltip', () => {
     fireEvent.click(container.querySelector('.target'));
     expect(container.querySelector('.x-content')).toBeTruthy();
   });
+
+  it('ref support nativeElement', () => {
+    const nodeRef = React.createRef<TooltipRef>();
+
+    const { container } = render(
+      <Tooltip ref={nodeRef} overlay={<div />}>
+        <button />
+      </Tooltip>,
+    );
+
+    expect(nodeRef.current.nativeElement).toBe(container.querySelector('button'));
+  });
 });