fix onFocus not trigger in IE11 (#513)

* fix onFocus not trigger in IE11

close ant-design/ant-design#25354

* use IE hacks

* fix test case

Author: afc163

src/Selector/index.tsx

@@ -196,18 +196,21 @@ const Selector: React.RefForwardingComponent<RefSelectorProps, SelectorProps> =
     pastedTextRef.current = value;
   };
 
-  // ====================== Focus ======================
-  // Should focus input if click the selector
-  const onClick = ({ target }) => {
-    if (target !== inputRef.current) {
-      inputRef.current.focus();
-    }
-  };
-
   const onMouseDown: React.MouseEventHandler<HTMLElement> = event => {
     const inputMouseDown = getInputMouseDown();
-    if (event.target !== inputRef.current && !inputMouseDown) {
-      event.preventDefault();
+    if (event.target !== inputRef.current) {
+      if (!inputMouseDown) {
+        event.preventDefault();
+      }
+      // Should focus input if click the selector
+      const isIE = (document.body.style as any).msTouchAction !== undefined;
+      if (isIE) {
+        setTimeout(() => {
+          inputRef.current.focus();
+        });
+      } else {
+        inputRef.current.focus();
+      }
     }
 
     if ((mode !== 'combobox' && (!showSearch || !inputMouseDown)) || !open) {
@@ -236,12 +239,7 @@ const Selector: React.RefForwardingComponent<RefSelectorProps, SelectorProps> =
   );
 
   return (
-    <div
-      ref={domRef}
-      className={`${prefixCls}-selector`}
-      onClick={onClick}
-      onMouseDown={onMouseDown}
-    >
+    <div ref={domRef} className={`${prefixCls}-selector`} onMouseDown={onMouseDown}>
       {selectNode}
     </div>
   );

tests/Select.test.tsx

@@ -573,6 +573,7 @@ describe('Select.Basic', () => {
 
       const focusSpy = jest.spyOn(wrapper.find('input').instance(), 'focus');
 
+      wrapper.find('.rc-select-selector').simulate('mousedown');
       wrapper.find('.rc-select-selector').simulate('click');
       expect(focusSpy).toHaveBeenCalled();
 
@@ -604,6 +605,7 @@ describe('Select.Basic', () => {
 
       const inputSpy = jest.spyOn(wrapper2.find('input').instance(), 'focus');
 
+      wrapper2.find('.rc-select-selection-placeholder').simulate('mousedown');
       wrapper2.find('.rc-select-selection-placeholder').simulate('click');
       expect(inputSpy).toHaveBeenCalled();
     });
@@ -770,8 +772,8 @@ describe('Select.Basic', () => {
     );
 
     const focusSpy = jest.spyOn(wrapper.find('input').instance(), 'focus');
+    wrapper.find('.rc-select-selection-placeholder').simulate('mousedown');
     wrapper.find('.rc-select-selection-placeholder').simulate('click');
-
     expect(focusSpy).toHaveBeenCalled();
   });
 

tests/shared/blurTest.tsx

@@ -2,7 +2,7 @@ import { mount } from 'enzyme';
 import React from 'react';
 import Option from '../../src/Option';
 import Select from '../../src/Select';
-import { injectRunAllTimers, toggleOpen } from '../utils/common';
+import { injectRunAllTimers } from '../utils/common';
 
 export default function blurTest(mode: any) {
   describe(`blur of ${mode}`, () => {
@@ -56,7 +56,6 @@ export default function blurTest(mode: any) {
           .find('input')
           .instance()
           .focus();
-        toggleOpen(wrapper);
         expect(handleBlur).not.toHaveBeenCalled();
 
         wrapper.find('input').simulate('blur');
@@ -66,7 +65,7 @@ export default function blurTest(mode: any) {
         wrapper
           .find('input')
           .instance()
-          .focus();
+          .blur();
         jest.runAllTimers();
         handleBlur.mockReset();