diff --git a/components/form/FormItemLabel.tsx b/components/form/FormItemLabel.tsx index bfcf1d9d07fb..c57ead79c7cd 100644 --- a/components/form/FormItemLabel.tsx +++ b/components/form/FormItemLabel.tsx @@ -93,9 +93,18 @@ const FormItemLabel: React.FC, ...restTooltipProps } = tooltipProps; - const tooltipNode = ( + const tooltipNode: React.ReactNode = ( - {React.cloneElement(icon, { className: `${prefixCls}-item-tooltip`, title: '' })} + {React.cloneElement(icon, { + className: `${prefixCls}-item-tooltip`, + title: '', + onClick: (e: React.MouseEvent) => { + // Prevent label behavior in tooltip icon + // https://github.com/ant-design/ant-design/issues/46154 + e.preventDefault(); + }, + tabIndex: null, + })} ); diff --git a/components/form/__tests__/index.test.tsx b/components/form/__tests__/index.test.tsx index a70229ed1d26..6987883acbeb 100644 --- a/components/form/__tests__/index.test.tsx +++ b/components/form/__tests__/index.test.tsx @@ -1252,6 +1252,21 @@ describe('Form', () => { expect(container.querySelector('.ant-tooltip-inner')).toHaveTextContent('Bamboo'); }); + + // https://github.com/ant-design/ant-design/issues/46154 + it('should not trigger form change when click icon', async () => { + const onChange = jest.fn(); + + const { container } = render( +
+ + + +
, + ); + fireEvent.click(container.querySelector('.anticon-question-circle')!); + expect(onChange).not.toHaveBeenCalled(); + }); }); it('warningOnly validate', async () => {