From 2d4393355a2363d2e872a24544bdcb50f20deb86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E7=BE=8E=E5=BB=BA?= <wangmeijian2016@gmail.com>
Date: Wed, 26 Oct 2022 10:22:13 +0800
Subject: [PATCH] fix: Picker should open when click inside (#490)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: Picker should open when click inside

* fix: add picker test

* Update src/Picker.tsx

Co-authored-by: afc163 <afc163@gmail.com>

Co-authored-by: 王美建 <>
Co-authored-by: afc163 <afc163@gmail.com>
---
 src/Picker.tsx        | 10 ++++------
 tests/picker.spec.tsx | 22 ++++++++++++++++------
 2 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/Picker.tsx b/src/Picker.tsx
index d309dc8..e551644 100644
--- a/src/Picker.tsx
+++ b/src/Picker.tsx
@@ -284,10 +284,8 @@ function InnerPicker<DateType>(props: PickerProps<DateType>) {
     }
   };
 
-  const onInternalMouseUp: React.MouseEventHandler<HTMLDivElement> = (...args) => {
-    if (onMouseUp) {
-      onMouseUp(...args);
-    }
+  const onInternalClick: React.MouseEventHandler<HTMLDivElement> = (...args) => {
+    onClick?.(...args);
 
     if (inputRef.current) {
       inputRef.current.focus();
@@ -536,11 +534,11 @@ function InnerPicker<DateType>(props: PickerProps<DateType>) {
           })}
           style={style}
           onMouseDown={onMouseDown}
-          onMouseUp={onInternalMouseUp}
+          onMouseUp={onMouseUp}
           onMouseEnter={onMouseEnter}
           onMouseLeave={onMouseLeave}
           onContextMenu={onContextMenu}
-          onClick={onClick}
+          onClick={onInternalClick}
         >
           <div
             className={classNames(`${prefixCls}-input`, {
diff --git a/tests/picker.spec.tsx b/tests/picker.spec.tsx
index a42c197..8f96766 100644
--- a/tests/picker.spec.tsx
+++ b/tests/picker.spec.tsx
@@ -617,28 +617,38 @@ describe('Picker.Basic', () => {
     expect(wrapper.find('input').prop('value')).toEqual('2020-1st');
   });
 
-  it('click outside should also focus', () => {
-    const onMouseUp = jest.fn();
-    const wrapper = mount(<MomentPicker onMouseUp={onMouseUp} />);
+  it('Picker should open when click inside', () => {
+    const onClick = jest.fn();
+    const wrapper = mount(<MomentPicker onClick={onClick} />);
     const inputElement = wrapper.find('input').instance() as any as HTMLInputElement;
     inputElement.focus = jest.fn();
 
-    wrapper.find('.rc-picker').simulate('mouseUp');
+    wrapper.find('.rc-picker').simulate('click');
     expect(inputElement.focus).toHaveBeenCalled();
     expect(wrapper.isOpen()).toBeTruthy();
 
-    expect(onMouseUp).toHaveBeenCalled();
+    expect(onClick).toHaveBeenCalled();
   });
 
   it('not open when disabled', () => {
     const wrapper = mount(<MomentPicker disabled />);
-    wrapper.find('.rc-picker').simulate('mouseUp');
+    wrapper.find('.rc-picker').simulate('click');
     expect(wrapper.isOpen()).toBeFalsy();
 
     wrapper.setProps({ disabled: false });
     expect(wrapper.isOpen()).toBeFalsy();
   });
 
+  it('not open when mouseup', () => {
+    const wrapper = mount(<MomentPicker />);
+    const inputElement = wrapper.find('input').instance() as any as HTMLInputElement;
+    inputElement.focus = jest.fn();
+
+    wrapper.find('.rc-picker').simulate('mouseup');
+    expect(inputElement.focus).toHaveBeenCalledTimes(0);
+    expect(wrapper.isOpen()).toBeFalsy();
+  });
+
   it('defaultOpenValue in timePicker', () => {
     resetWarned();
     const onChange = jest.fn();