Skip to content

Commit

Permalink
feat: Tooltip ref support nativeElement (#463)
Browse files Browse the repository at this point in the history
  • Loading branch information
zombieJ authored Oct 26, 2023
1 parent d023229 commit c8d83d1
Show file tree
Hide file tree
Showing 3 changed files with 17 additions and 4 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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": {
Expand Down
3 changes: 2 additions & 1 deletion src/Tooltip.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ export interface TooltipProps
}

export interface TooltipRef {
nativeElement: HTMLElement;
forceAlign: VoidFunction;
}

Expand Down Expand Up @@ -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) {
Expand Down
16 changes: 14 additions & 2 deletions tests/index.test.tsx
Original file line number Diff line number Diff line change
@@ -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);
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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'));
});
});

0 comments on commit c8d83d1

Please sign in to comment.