Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: https://github.com/ant-design/ant-design/issues/50642 #1084

Closed
wants to merge 4 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/BaseSelect/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -606,7 +606,7 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
} else if (mode === 'multiple') {
// `multiple` mode only clean the search value but not trigger event
onSearch('', {
source: 'blur',
source: mergedShowSearch ? 'effect' : 'blur',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

感觉反了,应该是单选的时候 blur 触发的 onSearch 的 source 不对。那个应该是 blur,这个 multiple 的是对的。

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

感觉反了,应该是单选的时候 blur 触发的 onSearch 的 source 不对。那个应该是 blur,这个 multiple 的是对的。

“多选下也需要重新触发搜索”,大佬,这是你给出的思路

});
}
}
Expand Down
50 changes: 50 additions & 0 deletions tests/BaseSelect.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -123,4 +123,54 @@ describe('BaseSelect', () => {

expect(container.querySelector('.rc-select-dropdown-placement-fallback')).toBeTruthy();
});

describe("Testing BaseSelect component's onContainerBlur params", () => {
it('BaseSelect with showSearch, onContainerBlur params is effect', () => {
const onSearch = jest.fn();
const { container } = render(
<BaseSelect
prefixCls="rc-select"
mode="multiple"
id="test"
displayValues={[]}
onDisplayValuesChange={() => {}}
searchValue="1"
showSearch
open
onSearch={onSearch}
OptionList={OptionList}
emptyOptions
/>,
);
expect(container.querySelector('div.rc-select')).toBeTruthy();
fireEvent.change(container.querySelector('input'), { target: { value: '2' } });
expect(onSearch).toHaveBeenCalledWith('2', { source: 'typing' });
fireEvent.blur(container.querySelector('div.rc-select'));
expect(onSearch).toHaveBeenCalledWith('', { source: 'effect' });
});

it('BaseSelect without showSearch, onContainerBlur params is blur', () => {
const onSearch = jest.fn();
const { container } = render(
<BaseSelect
prefixCls="rc-select"
mode="multiple"
id="test"
displayValues={[]}
onDisplayValuesChange={() => {}}
searchValue="1"
showSearch={false}
open
onSearch={onSearch}
OptionList={OptionList}
emptyOptions
/>,
);
expect(container.querySelector('div.rc-select')).toBeTruthy();
fireEvent.change(container.querySelector('input'), { target: { value: '2' } });
expect(onSearch).toHaveBeenCalledWith('2', { source: 'typing' });
fireEvent.blur(container.querySelector('div.rc-select'));
expect(onSearch).toHaveBeenCalledWith('', { source: 'blur' });
});
});
});
43 changes: 43 additions & 0 deletions tests/Select.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -605,6 +605,49 @@ describe('Select.Basic', () => {
jest.useRealTimers();
});

describe('should call handleSearch twice on search and blur', () => {
injectRunAllTimers(jest);

beforeEach(() => {
jest.useFakeTimers();
});

afterEach(() => {
jest.useRealTimers();
});

it('multiple mode should call handleSearch twice on search and blur', async () => {
const handleSearch = jest.fn();
const { container } = render(
<Select showSearch onSearch={handleSearch} mode="multiple">
<Option value="1">1</Option>
<Option value="2">2</Option>
</Select>,
);
fireEvent.change(container.querySelector('input')!, { target: { value: '1' } });
// 模拟失去焦点(blur)事件
fireEvent.blur(container.querySelector('input'));
jest.runAllTimers();
expect(handleSearch).toHaveBeenCalledTimes(2);
jest.useRealTimers();
});

it('not multiple mode should call handleSearch twice on search and blur', async () => {
const handleSearch = jest.fn();
const { container } = render(
<Select showSearch onSearch={handleSearch}>
<Option value="1">1</Option>
<Option value="2">2</Option>
</Select>,
);
fireEvent.change(container.querySelector('input')!, { target: { value: '1' } });
fireEvent.blur(container.querySelector('input'));
jest.runAllTimers();
expect(handleSearch).toHaveBeenCalledTimes(2);
jest.useRealTimers();
});
});

it('should render 0 as text properly', () => {
const data = [
{ text: 0, value: '=0' },
Expand Down
Loading