Merge branch 'master' into 13797-refactoring
[arvados.git] / src / components / search-bar / search-bar.test.tsx
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import * as React from "react";
6 import { mount, configure } from "enzyme";
7 import SearchBar, { DEFAULT_SEARCH_DEBOUNCE } from "./search-bar";
8
9 import * as Adapter from 'enzyme-adapter-react-16';
10
11 configure({ adapter: new Adapter() });
12
13 describe("<SearchBar />", () => {
14
15     jest.useFakeTimers();
16
17     let onSearch: () => void;
18
19     beforeEach(() => {
20         onSearch = jest.fn();
21     });
22
23     describe("on submit", () => {
24         it("calls onSearch with initial value passed via props", () => {
25             const searchBar = mount(<SearchBar value="initial value" onSearch={onSearch} />);
26             searchBar.find("form").simulate("submit");
27             expect(onSearch).toBeCalledWith("initial value");
28         });
29
30         it("calls onSearch with current value", () => {
31             const searchBar = mount(<SearchBar value="" onSearch={onSearch} />);
32             searchBar.find("input").simulate("change", { target: { value: "current value" } });
33             searchBar.find("form").simulate("submit");
34             expect(onSearch).toBeCalledWith("current value");
35         });
36
37         it("calls onSearch with new value passed via props", () => {
38             const searchBar = mount(<SearchBar value="" onSearch={onSearch} />);
39             searchBar.find("input").simulate("change", { target: { value: "current value" } });
40             searchBar.setProps({value: "new value"});
41             searchBar.find("form").simulate("submit");
42             expect(onSearch).toBeCalledWith("new value");
43         });
44
45         it("cancels timeout set on input value change", () => {
46             const searchBar = mount(<SearchBar value="" onSearch={onSearch} debounce={1000} />);
47             searchBar.find("input").simulate("change", { target: { value: "current value" } });
48             searchBar.find("form").simulate("submit");
49             jest.advanceTimersByTime(1000);
50             expect(onSearch).toHaveBeenCalledTimes(1);
51             expect(onSearch).toBeCalledWith("current value");
52         });
53
54     });
55
56     describe("on input value change", () => {
57         it("calls onSearch after default timeout", () => {
58             const searchBar = mount(<SearchBar value="" onSearch={onSearch} />);
59             searchBar.find("input").simulate("change", { target: { value: "current value" } });
60             expect(onSearch).not.toBeCalled();
61             jest.advanceTimersByTime(DEFAULT_SEARCH_DEBOUNCE);
62             expect(onSearch).toBeCalledWith("current value");
63         });
64         
65         it("calls onSearch after the time specified in props has passed", () => {
66             const searchBar = mount(<SearchBar value="" onSearch={onSearch} debounce={2000}/>);
67             searchBar.find("input").simulate("change", { target: { value: "current value" } });
68             jest.advanceTimersByTime(1000);
69             expect(onSearch).not.toBeCalled();
70             jest.advanceTimersByTime(1000);
71             expect(onSearch).toBeCalledWith("current value");
72         });
73         
74         it("calls onSearch only once after no change happened during the specified time", () => {
75             const searchBar = mount(<SearchBar value="" onSearch={onSearch} debounce={1000}/>);
76             searchBar.find("input").simulate("change", { target: { value: "current value" } });
77             jest.advanceTimersByTime(500);
78             searchBar.find("input").simulate("change", { target: { value: "changed value" } });
79             jest.advanceTimersByTime(1000);
80             expect(onSearch).toHaveBeenCalledTimes(1);
81         });
82         
83         it("calls onSearch again after the specified time has passed since previous call", () => {
84             const searchBar = mount(<SearchBar value="" onSearch={onSearch} debounce={1000}/>);
85             searchBar.find("input").simulate("change", { target: { value: "current value" } });
86             jest.advanceTimersByTime(500);
87             searchBar.find("input").simulate("change", { target: { value: "intermediate value" } });
88             jest.advanceTimersByTime(1000);
89             expect(onSearch).toBeCalledWith("intermediate value");
90             searchBar.find("input").simulate("change", { target: { value: "latest value" } });
91             jest.advanceTimersByTime(1000);
92             expect(onSearch).toBeCalledWith("latest value");
93             expect(onSearch).toHaveBeenCalledTimes(2);
94             
95         });
96
97     });
98
99 });