fix: should close when blur (#871)

* fix: should close when blur

* chore: trigger ci

Author: zombieJ

package.json

@@ -53,7 +53,8 @@
     "rc-virtual-list": "^3.2.0"
   },
   "devDependencies": {
-    "@testing-library/react": "12",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^12.1.5",
     "@types/enzyme": "^3.10.9",
     "@types/jest": "^26.0.24",
     "@types/react": "^17.0.15",

src/BaseSelect.tsx

@@ -1,22 +1,22 @@
-import * as React from 'react';
 import classNames from 'classnames';
 import type { AlignType } from 'rc-trigger/lib/interface';
-import KeyCode from 'rc-util/lib/KeyCode';
+import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
+import useMergedState from 'rc-util/lib/hooks/useMergedState';
 import isMobile from 'rc-util/lib/isMobile';
+import KeyCode from 'rc-util/lib/KeyCode';
 import { useComposeRef } from 'rc-util/lib/ref';
-import type { ScrollTo, ScrollConfig } from 'rc-virtual-list/lib/List';
-import useMergedState from 'rc-util/lib/hooks/useMergedState';
-import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
-import { getSeparatedContent } from './utils/valueUtil';
-import type { RefTriggerProps } from './SelectTrigger';
-import SelectTrigger from './SelectTrigger';
+import type { ScrollConfig, ScrollTo } from 'rc-virtual-list/lib/List';
+import * as React from 'react';
+import { BaseSelectContext } from './hooks/useBaseProps';
+import useDelayReset from './hooks/useDelayReset';
+import useLock from './hooks/useLock';
+import useSelectTriggerControl from './hooks/useSelectTriggerControl';
 import type { RefSelectorProps } from './Selector';
 import Selector from './Selector';
-import useSelectTriggerControl from './hooks/useSelectTriggerControl';
-import useDelayReset from './hooks/useDelayReset';
+import type { RefTriggerProps } from './SelectTrigger';
+import SelectTrigger from './SelectTrigger';
 import TransBtn from './TransBtn';
-import useLock from './hooks/useLock';
-import { BaseSelectContext } from './hooks/useBaseProps';
+import { getSeparatedContent } from './utils/valueUtil';
 
 const DEFAULT_OMIT_PROPS = [
   'value',
@@ -368,9 +368,12 @@ const BaseSelect = React.forwardRef((props: BaseSelectProps, ref: React.Ref<Base
     (newOpen?: boolean) => {
       const nextOpen = newOpen !== undefined ? newOpen : !mergedOpen;
 
-      if (mergedOpen !== nextOpen && !disabled) {
+      if (!disabled) {
         setInnerOpen(nextOpen);
-        onDropdownVisibleChange?.(nextOpen);
+
+        if (mergedOpen !== nextOpen) {
+          onDropdownVisibleChange?.(nextOpen);
+        }
       }
     },
     [disabled, mergedOpen, setInnerOpen, onDropdownVisibleChange],

tests/Combobox.test.tsx

@@ -1,17 +1,19 @@
 /* eslint-disable max-classes-per-file */
 
+import '@testing-library/jest-dom';
+import { act, fireEvent, render } from '@testing-library/react';
 import { mount } from 'enzyme';
 import KeyCode from 'rc-util/lib/KeyCode';
-import React from 'react';
 import { resetWarned } from 'rc-util/lib/warning';
+import React from 'react';
 import type { SelectProps } from '../src';
 import Select, { Option } from '../src';
+import allowClearTest from './shared/allowClearTest';
 import focusTest from './shared/focusTest';
 import keyDownTest from './shared/keyDownTest';
 import openControlledTest from './shared/openControlledTest';
-import { expectOpen, toggleOpen, selectItem, injectRunAllTimers } from './utils/common';
-import allowClearTest from './shared/allowClearTest';
 import throwOptionValue from './shared/throwOptionValue';
+import { expectOpen, injectRunAllTimers, selectItem, toggleOpen } from './utils/common';
 
 async function delay(timeout = 0) {
   return new Promise((resolve) => {
@@ -577,4 +579,25 @@ describe('Select.Combobox', () => {
     selectItem(wrapper);
     expect(wrapper.find('.rc-select-item-option-selected').length).toBe(0);
   });
+
+  // https://github.com/ant-design/ant-design/issues/38844
+  it('not show dropdown when options changed', () => {
+    jest.useFakeTimers();
+    const { container, rerender } = render(<Select mode="combobox" options={[]} />);
+
+    fireEvent.mouseDown(container.querySelector('input'));
+    act(() => {
+      jest.runAllTimers();
+    });
+
+    fireEvent.blur(container.querySelector('input'));
+    act(() => {
+      jest.runAllTimers();
+    });
+
+    rerender(<Select mode="combobox" options={[{ value: 'shouldHide' }]} />);
+    expect(document.body.querySelector('.rc-select-dropdown-hidden')).toBeTruthy();
+
+    jest.useRealTimers();
+  });
 });