fix: Slider show empty tooltip when tooltip.formatter is falsy (#48673)

* fix: slider tooltip is cant hide * fix: update case description
ant-design · Apr 29, 2024 · c150885 · c150885
1 parent 0dd5617
commit c150885
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 2 deletions.
diff --git a/components/slider/__tests__/tooltip.test.tsx b/components/slider/__tests__/tooltip.test.tsx
@@ -53,4 +53,26 @@ describe('Slider.Tooltip', () => {
     await waitFakeTimer();
     expect(tooltipProps().open).toBeFalsy();
   });
+
+  it('When format equals null, tooltip does not display', async () => {
+    // https://github.com/ant-design/ant-design/issues/48668
+    const { container } = render(<Slider defaultValue={30} tooltip={{ formatter: null }} />);
+
+    const handleEle = container.querySelector('.ant-slider-handle')!;
+
+    // Enter
+    fireEvent.mouseEnter(handleEle);
+    await waitFakeTimer();
+    expect(tooltipProps().open).toBeFalsy();
+
+    // Down
+    fireEvent.mouseDown(handleEle);
+    await waitFakeTimer();
+    expect(tooltipProps().open).toBeFalsy();
+
+    // Move(Leave)
+    fireEvent.mouseLeave(handleEle);
+    await waitFakeTimer();
+    expect(tooltipProps().open).toBeFalsy();
+  });
 });
diff --git a/components/slider/index.tsx b/components/slider/index.tsx
@@ -291,14 +291,16 @@ const Slider = React.forwardRef<SliderRef, SliderSingleProps | SliderRangeProps>
 
     const cloneNode = React.cloneElement(node, passedProps);
 
+    const open = (!!lockOpen || activeOpen) && mergedTipFormatter !== null;
+
     // Wrap on handle with Tooltip when is single mode or multiple with all show tooltip
     if (!useActiveTooltipHandle) {
       return (
         <SliderTooltip
           {...tooltipProps}
           prefixCls={getPrefixCls('tooltip', customizeTooltipPrefixCls ?? legacyTooltipPrefixCls)}
           title={mergedTipFormatter ? mergedTipFormatter(info.value) : ''}
-          open={!!lockOpen || activeOpen}
+          open={open}
           placement={getTooltipPlacement(tooltipPlacement ?? legacyTooltipPlacement, vertical)}
           key={index}
           overlayClassName={`${prefixCls}-tooltip`}
@@ -329,7 +331,7 @@ const Slider = React.forwardRef<SliderRef, SliderSingleProps | SliderRangeProps>
             {...tooltipProps}
             prefixCls={getPrefixCls('tooltip', customizeTooltipPrefixCls ?? legacyTooltipPrefixCls)}
             title={mergedTipFormatter ? mergedTipFormatter(info.value) : ''}
-            open={activeOpen}
+            open={mergedTipFormatter !== null && activeOpen}
             placement={getTooltipPlacement(tooltipPlacement ?? legacyTooltipPlacement, vertical)}
             key="tooltip"
             overlayClassName={`${prefixCls}-tooltip`}