2018-01-04 20:43:56 +08:00
|
|
|
import React from 'react';
|
2019-09-12 20:15:17 +08:00
|
|
|
import { act } from 'react-dom/test-utils';
|
2018-01-04 20:43:56 +08:00
|
|
|
import { mount } from 'enzyme';
|
2017-11-19 01:41:40 +08:00
|
|
|
import Select from '..';
|
2018-11-15 14:43:54 +08:00
|
|
|
import Icon from '../../icon';
|
2017-11-19 01:41:40 +08:00
|
|
|
import focusTest from '../../../tests/shared/focusTest';
|
2019-08-26 22:53:20 +08:00
|
|
|
import mountTest from '../../../tests/shared/mountTest';
|
2020-01-02 19:10:16 +08:00
|
|
|
import rtlTest from '../../../tests/shared/rtlTest';
|
2017-11-19 01:41:40 +08:00
|
|
|
|
2018-08-25 23:41:30 +08:00
|
|
|
const { Option } = Select;
|
|
|
|
|
2017-11-19 01:41:40 +08:00
|
|
|
describe('Select', () => {
|
2020-10-24 20:33:18 +08:00
|
|
|
focusTest(Select, { refFocus: true });
|
2019-08-26 22:53:20 +08:00
|
|
|
mountTest(Select);
|
2020-01-02 19:10:16 +08:00
|
|
|
rtlTest(Select);
|
2018-01-04 20:43:56 +08:00
|
|
|
|
2019-09-12 20:15:17 +08:00
|
|
|
function toggleOpen(wrapper) {
|
|
|
|
act(() => {
|
|
|
|
wrapper.find('.ant-select-selector').simulate('mousedown');
|
|
|
|
jest.runAllTimers();
|
|
|
|
});
|
2021-06-01 10:11:24 +08:00
|
|
|
wrapper.update();
|
2019-09-12 20:15:17 +08:00
|
|
|
}
|
|
|
|
|
2018-01-04 20:43:56 +08:00
|
|
|
beforeEach(() => {
|
|
|
|
jest.useFakeTimers();
|
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
jest.useRealTimers();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should have default notFoundContent', () => {
|
2018-12-07 20:02:01 +08:00
|
|
|
const wrapper = mount(<Select mode="multiple" />);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
|
|
|
expect(wrapper.find('.ant-select-item-option').length).toBeFalsy();
|
|
|
|
expect(wrapper.find('.ant-empty').length).toBeTruthy();
|
2018-01-04 20:43:56 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
it('should support set notFoundContent to null', () => {
|
2018-12-07 20:02:01 +08:00
|
|
|
const wrapper = mount(<Select mode="multiple" notFoundContent={null} />);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
2020-10-21 10:35:06 +08:00
|
|
|
const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
2018-01-04 20:43:56 +08:00
|
|
|
expect(dropdownWrapper.find('MenuItem').length).toBe(0);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should not have default notFoundContent when mode is combobox', () => {
|
2018-12-07 20:02:01 +08:00
|
|
|
const wrapper = mount(<Select mode={Select.SECRET_COMBOBOX_MODE_DO_NOT_USE} />);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
2020-10-21 10:35:06 +08:00
|
|
|
const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
2018-01-04 20:43:56 +08:00
|
|
|
expect(dropdownWrapper.find('MenuItem').length).toBe(0);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should not have notFoundContent when mode is combobox and notFoundContent is set', () => {
|
|
|
|
const wrapper = mount(
|
2018-12-07 20:02:01 +08:00
|
|
|
<Select mode={Select.SECRET_COMBOBOX_MODE_DO_NOT_USE} notFoundContent="not at all" />,
|
2018-01-04 20:43:56 +08:00
|
|
|
);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
2020-10-21 10:35:06 +08:00
|
|
|
const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
2019-09-12 20:15:17 +08:00
|
|
|
expect(dropdownWrapper.find('.ant-select-item-option').length).toBeFalsy();
|
2020-10-21 10:35:06 +08:00
|
|
|
expect(dropdownWrapper.find('.ant-select-item-empty').at(0).text()).toBe('not at all');
|
2018-01-04 20:43:56 +08:00
|
|
|
});
|
2018-08-25 23:41:30 +08:00
|
|
|
|
|
|
|
it('should be controlled by open prop', () => {
|
|
|
|
const onDropdownVisibleChange = jest.fn();
|
|
|
|
const wrapper = mount(
|
|
|
|
<Select open onDropdownVisibleChange={onDropdownVisibleChange}>
|
|
|
|
<Option value="1">1</Option>
|
2018-12-07 20:02:01 +08:00
|
|
|
</Select>,
|
|
|
|
);
|
2020-10-21 10:35:06 +08:00
|
|
|
let dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
2018-08-25 23:41:30 +08:00
|
|
|
expect(dropdownWrapper.props().visible).toBe(true);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
2018-08-25 23:41:30 +08:00
|
|
|
expect(onDropdownVisibleChange).toHaveBeenLastCalledWith(false);
|
|
|
|
expect(dropdownWrapper.props().visible).toBe(true);
|
|
|
|
|
|
|
|
wrapper.setProps({ open: false });
|
2020-10-21 10:35:06 +08:00
|
|
|
dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
|
2018-08-25 23:41:30 +08:00
|
|
|
expect(dropdownWrapper.props().visible).toBe(false);
|
2019-09-12 20:15:17 +08:00
|
|
|
toggleOpen(wrapper);
|
2018-08-25 23:41:30 +08:00
|
|
|
expect(onDropdownVisibleChange).toHaveBeenLastCalledWith(true);
|
|
|
|
expect(dropdownWrapper.props().visible).toBe(false);
|
|
|
|
});
|
2018-11-12 12:18:21 +08:00
|
|
|
|
2020-06-11 18:01:45 +08:00
|
|
|
it('should show search icon when showSearch and open', () => {
|
|
|
|
const wrapper = mount(
|
|
|
|
<Select showSearch>
|
|
|
|
<Option value="1">1</Option>
|
|
|
|
</Select>,
|
|
|
|
);
|
|
|
|
expect(wrapper.find('.anticon-down').length).toBe(1);
|
|
|
|
expect(wrapper.find('.anticon-search').length).toBe(0);
|
|
|
|
wrapper.setProps({ open: true });
|
|
|
|
expect(wrapper.find('.anticon-down').length).toBe(0);
|
|
|
|
expect(wrapper.find('.anticon-search').length).toBe(1);
|
|
|
|
});
|
|
|
|
|
2018-11-12 12:18:21 +08:00
|
|
|
describe('Select Custom Icons', () => {
|
|
|
|
it('should support customized icons', () => {
|
|
|
|
const wrapper = mount(
|
|
|
|
<Select
|
|
|
|
removeIcon={<Icon type="close" />}
|
|
|
|
clearIcon={<Icon type="close" />}
|
|
|
|
menuItemSelectedIcon={<Icon type="close" />}
|
|
|
|
>
|
|
|
|
<Option value="1">1</Option>
|
2018-12-07 20:02:01 +08:00
|
|
|
</Select>,
|
2018-11-12 12:18:21 +08:00
|
|
|
);
|
|
|
|
wrapper.setProps({ count: 10 });
|
|
|
|
jest.runAllTimers();
|
2018-11-20 17:26:08 +08:00
|
|
|
expect(wrapper.render()).toMatchSnapshot();
|
2018-11-12 12:18:21 +08:00
|
|
|
});
|
|
|
|
});
|
2020-06-11 18:01:45 +08:00
|
|
|
|
|
|
|
describe('Deprecated', () => {
|
|
|
|
it('should ignore mode="combobox"', () => {
|
|
|
|
const wrapper = mount(
|
|
|
|
<Select mode="combobox">
|
|
|
|
<Option value="1">1</Option>
|
|
|
|
</Select>,
|
|
|
|
);
|
|
|
|
expect(wrapper.render()).toMatchSnapshot();
|
|
|
|
});
|
|
|
|
});
|
2017-11-19 01:41:40 +08:00
|
|
|
});
|