|
1 | 1 | import type { OptionListProps, RefOptionListProps } from '@/OptionList'; |
2 | 2 | import { fireEvent, render } from '@testing-library/react'; |
3 | | -import { forwardRef, act } from 'react'; |
| 3 | +import { forwardRef, act, useState } from 'react'; |
4 | 4 | import BaseSelect from '../src/BaseSelect'; |
5 | 5 |
|
6 | 6 | const OptionList = forwardRef<RefOptionListProps, OptionListProps>(() => ( |
@@ -123,4 +123,54 @@ describe('BaseSelect', () => { |
123 | 123 |
|
124 | 124 | expect(container.querySelector('.rc-select-dropdown-placement-fallback')).toBeTruthy(); |
125 | 125 | }); |
| 126 | + |
| 127 | + describe("Testing BaseSelect component's onContainerBlur params", () => { |
| 128 | + it('BaseSelect with showSearch, onContainerBlur params is effect', () => { |
| 129 | + const onSearch = jest.fn(); |
| 130 | + const { container } = render( |
| 131 | + <BaseSelect |
| 132 | + prefixCls="rc-select" |
| 133 | + mode="multiple" |
| 134 | + id="test" |
| 135 | + displayValues={[]} |
| 136 | + onDisplayValuesChange={() => {}} |
| 137 | + searchValue="1" |
| 138 | + showSearch |
| 139 | + open |
| 140 | + onSearch={onSearch} |
| 141 | + OptionList={OptionList} |
| 142 | + emptyOptions |
| 143 | + />, |
| 144 | + ); |
| 145 | + expect(container.querySelector('div.rc-select')).toBeTruthy(); |
| 146 | + fireEvent.change(container.querySelector('input'), { target: { value: '2' } }); |
| 147 | + expect(onSearch).toHaveBeenCalledWith('2', { source: 'typing' }); |
| 148 | + fireEvent.blur(container.querySelector('div.rc-select')); |
| 149 | + expect(onSearch).toHaveBeenCalledWith('', { source: 'effect' }); |
| 150 | + }); |
| 151 | + |
| 152 | + it('BaseSelect without showSearch, onContainerBlur params is blur', () => { |
| 153 | + const onSearch = jest.fn(); |
| 154 | + const { container } = render( |
| 155 | + <BaseSelect |
| 156 | + prefixCls="rc-select" |
| 157 | + mode="multiple" |
| 158 | + id="test" |
| 159 | + displayValues={[]} |
| 160 | + onDisplayValuesChange={() => {}} |
| 161 | + searchValue="1" |
| 162 | + showSearch={false} |
| 163 | + open |
| 164 | + onSearch={onSearch} |
| 165 | + OptionList={OptionList} |
| 166 | + emptyOptions |
| 167 | + />, |
| 168 | + ); |
| 169 | + expect(container.querySelector('div.rc-select')).toBeTruthy(); |
| 170 | + fireEvent.change(container.querySelector('input'), { target: { value: '2' } }); |
| 171 | + expect(onSearch).toHaveBeenCalledWith('2', { source: 'typing' }); |
| 172 | + fireEvent.blur(container.querySelector('div.rc-select')); |
| 173 | + expect(onSearch).toHaveBeenCalledWith('', { source: 'blur' }); |
| 174 | + }); |
| 175 | + }); |
126 | 176 | }); |
0 commit comments