Start a new pull request in StackBlitz Codeflow .

• react-wubjtr (Open reproduction)

ant-design/components/tooltip/tests/tooltip.test.tsx

Lines 36 to 116 in 8b1f79c

| | it('check onOpenChange arguments',async()=>{ |
| | constonOpenChange=jest.fn(); |
| | constref=React.createRef(); |
| | |
| | const{ container, rerender }=render( |
| | <Tooltip |
| | title="" |
| | mouseEnterDelay={0} |
| | mouseLeaveDelay={0} |
| | onOpenChange={onOpenChange} |
| | ref={ref} |
| | > |
| | <divid="hello">Hello world! |
| | , |
| | ); |
| | |
| | // title is empty. |
| | constdivElement=container.querySelector('#hello'); |
| | fireEvent.mouseEnter(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange).not.toHaveBeenCalled(); |
| | expect(isTooltipOpen()).toBeFalsy(); |
| | expect(container.querySelector('.ant-tooltip-open')).toBeNull(); |
| | |
| | fireEvent.mouseLeave(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange).not.toHaveBeenCalled(); |
| | expect(isTooltipOpen()).toBeFalsy(); |
| | expect(container.querySelector('.ant-tooltip-open')).toBeNull(); |
| | |
| | // update title value. |
| | rerender( |
| | <Tooltip |
| | title="Have a nice day!" |
| | mouseEnterDelay={0} |
| | mouseLeaveDelay={0} |
| | onOpenChange={onOpenChange} |
| | ref={ref} |
| | > |
| | <divid="hello">Hello world! |
| | , |
| | ); |
| | fireEvent.mouseEnter(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange).toHaveBeenLastCalledWith(true); |
| | expect(isTooltipOpen()).toBeTruthy(); |
| | expect(container.querySelector('.ant-tooltip-open')).not.toBeNull(); |
| | |
| | fireEvent.mouseLeave(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange).toHaveBeenLastCalledWith(false); |
| | expect(isTooltipOpen()).toBeFalsy(); |
| | expect(container.querySelector('.ant-tooltip-open')).toBeNull(); |
| | |
| | // add open props. |
| | rerender( |
| | <Tooltip |
| | title="Have a nice day!" |
| | mouseEnterDelay={0} |
| | mouseLeaveDelay={0} |
| | onOpenChange={onOpenChange} |
| | ref={ref} |
| | open={false} |
| | > |
| | <divid="hello">Hello world! |
| | , |
| | ); |
| | fireEvent.mouseEnter(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange).toHaveBeenLastCalledWith(true); |
| | constlastCount=onOpenChange.mock.calls.length; |
| | expect(isTooltipOpen()).toBeFalsy(); |
| | expect(container.querySelector('.ant-tooltip-open')).toBeNull(); |
| | |
| | // always trigger onOpenChange |
| | fireEvent.mouseLeave(divElement!); |
| | awaitwaitFakeTimer(); |
| | expect(onOpenChange.mock.calls.length).toBe(lastCount);// no change with lastCount |
| | expect(isTooltipOpen()).toBeFalsy(); |
| | expect(container.querySelector('.ant-tooltip-open')).toBeNull(); |
| | }); |

看这段测试用例貌似是预期的？

预期行为，Tooltip trigger 为 hover 时只有鼠标进入时才会触发。

预期行为，Tooltip trigger 为 hover 时只有鼠标进入时才会触发。

试了下 floating-ui 是可以的。antd 要这样才行

直接用 trigger="click" ？

测试了下，为空时移入不会触发 onOpenChange，点击后有 title 了，open 还是 false，所以不会显示出来。

我感觉正确的应该是这样的：为空时移入时不触发 onOpenChange，点击后有 title 了，触发 onOpenChange true。
内部应该是维护一个 open，不管 title 为不为空，都会更着改变，只是空的时候不触发 onOpenChange 而已

场景是这样的，Button 外面套一个 Tooltip，点击后满足某个条件后禁用，并马上在 Tooltip 显示禁用的原因。如果还需要移出再移入才显示的话，给用户不太直观，他可能不清楚。现在是用的条件渲染 Tooltip 实现。