diff --git a/src/Select.jsx b/src/Select.jsx
index 84be11b9d..e04442c8d 100644
--- a/src/Select.jsx
+++ b/src/Select.jsx
@@ -26,7 +26,7 @@ function saveRef(name, component) {
}
function chaining(...fns) {
- return function (...args) {
+ return function (...args) { // eslint-disable-line
for (let i = 0; i < fns.length; i++) {
if (fns[i] && typeof fns[i] === 'function') {
fns[i].apply(this, args);
@@ -716,13 +716,9 @@ const Select = createClass({
return;
}
let { open } = this.state;
- if (typeof document !== 'undefined' &&
- this.getInputDOMNode() &&
- document.activeElement === this.getInputDOMNode()) {
- open = true;
- }
let options = [];
- if (open) {
+ // If hidden menu due to no options, then it should be calculated again
+ if (open || this.hiddenForNoOptions) {
options = this.renderFilterOptions();
}
this._options = options;
@@ -730,6 +726,12 @@ const Select = createClass({
if (isMultipleOrTagsOrCombobox(this.props) || !this.props.showSearch) {
if (open && !options.length) {
open = false;
+ this.hiddenForNoOptions = true;
+ }
+ // Keep menu open if there are options and hidden for no options before
+ if (this.hiddenForNoOptions && options.length) {
+ open = true;
+ this.hiddenForNoOptions = false;
}
}
this.state.open = open;
diff --git a/tests/Select.combobox.spec.js b/tests/Select.combobox.spec.js
index 2a83e277a..651dbd660 100644
--- a/tests/Select.combobox.spec.js
+++ b/tests/Select.combobox.spec.js
@@ -1,9 +1,11 @@
-/* eslint-disable no-undef */
+/* eslint-disable no-undef, react/no-multi-comp */
import React from 'react';
import Select, { Option } from '../src';
import { mount, render } from 'enzyme';
import allowClearTest from './shared/allowClearTest';
+const delay = timeout => new Promise(resolve => setTimeout(resolve, timeout));
+
describe('Select.combobox', () => {
allowClearTest('combobox');
@@ -112,5 +114,85 @@ describe('Select.combobox', () => {
expect(wrapper.find('input').props().value).toBe('One');
});
});
+
+ describe('hidden when filtered options is empty', () => {
+ // https://github.com/ant-design/ant-design/issues/3958
+ it('should popup when input with async data', () => {
+ class AsyncCombobox extends React.Component {
+ state = {
+ data: [],
+ }
+ handleChange = () => {
+ setTimeout(() => {
+ this.setState({
+ data: [{ key: '1', label: '1' }, { key: '2', label: '2' }],
+ });
+ }, 500);
+ }
+ render() {
+ const options = this.state.data.map(item => (
+
+ ));
+ return (
+
+ );
+ }
+ }
+ const wrapper = mount(