fix: Slider tooltip should not display when open is false (#48708)

This commit is contained in:
afc163 2024-04-30 13:48:31 +08:00 committed by GitHub
parent 5fc3618aad
commit 244ad743e3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 19 additions and 13 deletions

View File

@ -54,25 +54,31 @@ describe('Slider.Tooltip', () => {
expect(tooltipProps().open).toBeFalsy();
});
it('When format equals null, tooltip does not display', async () => {
it('tooltip should not display when formatter is null or open is false', async () => {
// https://github.com/ant-design/ant-design/issues/48668
const { container } = render(<Slider defaultValue={30} tooltip={{ formatter: null }} />);
const { container: container1 } = render(
<Slider defaultValue={30} tooltip={{ formatter: null }} />,
);
// https://github.com/ant-design/ant-design/issues/48707
const { container: container2 } = render(
<Slider defaultValue={30} tooltip={{ open: false }} />,
);
const handleEle = container.querySelector('.ant-slider-handle')!;
const handler1 = container1.querySelector('.ant-slider-handle')!;
const handler2 = container2.querySelector('.ant-slider-handle')!;
// Enter
fireEvent.mouseEnter(handleEle);
fireEvent.mouseEnter(handler1);
fireEvent.mouseEnter(handler2);
await waitFakeTimer();
expect(tooltipProps().open).toBeFalsy();
expect(container1.querySelector('.ant-tooltip-open')).toBeFalsy();
expect(container2.querySelector('.ant-tooltip-open')).toBeFalsy();
// Down
fireEvent.mouseDown(handleEle);
fireEvent.focus(handler1);
fireEvent.focus(handler2);
await waitFakeTimer();
expect(tooltipProps().open).toBeFalsy();
// Move(Leave)
fireEvent.mouseLeave(handleEle);
await waitFakeTimer();
expect(tooltipProps().open).toBeFalsy();
expect(container1.querySelector('.ant-tooltip-open')).toBeFalsy();
expect(container2.querySelector('.ant-tooltip-open')).toBeFalsy();
});
});

View File

@ -154,7 +154,6 @@ const Slider = React.forwardRef<SliderRef, SliderSingleProps | SliderRangeProps>
// =============================== Open ===============================
const [hoverOpen, setHoverOpen] = useRafLock();
const [focusOpen, setFocusOpen] = useRafLock();
const activeOpen = hoverOpen || focusOpen;
const tooltipProps: SliderTooltipProps = {
...tooltip,
@ -168,6 +167,7 @@ const Slider = React.forwardRef<SliderRef, SliderSingleProps | SliderRangeProps>
} = tooltipProps;
const lockOpen = tooltipOpen ?? legacyTooltipVisible;
const activeOpen = (hoverOpen || focusOpen) && lockOpen !== false;
const mergedTipFormatter = getTipFormatter(tipFormatter, legacyTipFormatter);