describe("on input target change", () => {
it("clears the input value on selfClearProp change", () => {
const searchInput = mount(<SearchInput selfClearProp="abc" value="123" onSearch={onSearch} debounce={1000}/>);
- searchInput.setProps({ selfClearProp: '111' });
+
+ // component should clear value upon creation
jest.runTimersToTime(1000);
expect(onSearch).toBeCalledWith("");
expect(onSearch).toHaveBeenCalledTimes(1);
+
+ // component should clear on selfClearProp change
+ searchInput.setProps({ selfClearProp: '111' });
+ jest.runTimersToTime(1000);
+ expect(onSearch).toBeCalledWith("");
+ expect(onSearch).toHaveBeenCalledTimes(2);
});
});
});
type SearchInputProps = SearchInputDataProps & SearchInputActionProps & WithStyles<CssRules>;
-// interface SearchInputState {
-// value: string;
-// label: string;
-// }
-
-// let selfClearPropState = '';
-
export const DEFAULT_SEARCH_DEBOUNCE = 1000;
const SearchInputComponent = (props: SearchInputProps) => {
- const [timeout, setTimeout] = useState(1);
+ const [timeout, setTimeout] = useState(0);
const [value, setValue] = useState("");
const [label, setLabel] = useState("Search");
const [selfClearProp, setSelfClearProp] = useState("");
const { target: { value: eventValue } } = event;
clearTimeout(timeout);
setValue(eventValue);
+
setTimeout(window.setTimeout(
() => {
props.onSearch(eventValue);
},
- props.debounce || DEFAULT_SEARCH_DEBOUNCE
+ props.debounce || DEFAULT_SEARCH_DEBOUNCE
));
};