1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from "react";
6 import { mount, configure, ReactWrapper } from "enzyme";
7 import * as Adapter from "enzyme-adapter-react-16";
8 import MainAppBar from "./main-app-bar";
9 import SearchBar from "../../components/search-bar/search-bar";
10 import Breadcrumbs from "../../components/breadcrumbs/breadcrumbs";
11 import DropdownMenu from "../../components/dropdown-menu/dropdown-menu";
12 import { Button, MenuItem, IconButton } from "@material-ui/core";
13 import { User } from "../../models/user";
15 configure({ adapter: new Adapter() });
17 describe("<MainAppBar />", () => {
22 email: "test.user@example.com",
27 it("renders all components and the menu for authenticated user if user prop has value", () => {
28 const mainAppBar = mount(
31 onContextMenu={jest.fn()}
32 onDetailsPanelToggle={jest.fn()}
33 onContextMenu={jest.fn()}
34 {...{ searchText: "", breadcrumbs: [], menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onSearch: jest.fn(), onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
37 expect(mainAppBar.find(SearchBar)).toHaveLength(1);
38 expect(mainAppBar.find(Breadcrumbs)).toHaveLength(1);
39 expect(mainAppBar.find(DropdownMenu)).toHaveLength(2);
42 it("renders only the menu for anonymous user if user prop is undefined", () => {
43 const menuItems = { accountMenu: [], helpMenu: [], anonymousMenu: [{ label: 'Sign in' }] };
44 const mainAppBar = mount(
47 onDetailsPanelToggle={jest.fn()}
48 onContextMenu={jest.fn()}
49 {...{ searchText: "", breadcrumbs: [], onSearch: jest.fn(), onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
52 expect(mainAppBar.find(SearchBar)).toHaveLength(0);
53 expect(mainAppBar.find(Breadcrumbs)).toHaveLength(0);
54 expect(mainAppBar.find(DropdownMenu)).toHaveLength(0);
55 expect(mainAppBar.find(Button)).toHaveLength(1);
58 it("communicates with <SearchBar />", () => {
59 const onSearch = jest.fn();
60 const mainAppBar = mount(
62 searchText="search text"
64 onContextMenu={jest.fn()}
66 onContextMenu={jest.fn()}
67 onDetailsPanelToggle={jest.fn()}
68 {...{ user, breadcrumbs: [], menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
71 const searchBar = mainAppBar.find(SearchBar);
72 expect(searchBar.prop("value")).toBe("search text");
73 expect(searchBar.prop("debounce")).toBe(2000);
74 searchBar.prop("onSearch")("new search text");
75 expect(onSearch).toBeCalledWith("new search text");
78 it("communicates with <Breadcrumbs />", () => {
79 const items = [{ label: "breadcrumb 1" }];
80 const onBreadcrumbClick = jest.fn();
81 const mainAppBar = mount(
84 onContextMenu={jest.fn()}
85 onBreadcrumbClick={onBreadcrumbClick}
86 onContextMenu={jest.fn()}
87 onDetailsPanelToggle={jest.fn()}
88 {...{ user, searchText: "", menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onSearch: jest.fn(), onMenuItemClick: jest.fn() }}
91 const breadcrumbs = mainAppBar.find(Breadcrumbs);
92 expect(breadcrumbs.prop("items")).toBe(items);
93 breadcrumbs.prop("onClick")(items[0]);
94 expect(onBreadcrumbClick).toBeCalledWith(items[0]);
97 it("communicates with menu", () => {
98 const onMenuItemClick = jest.fn();
99 const menuItems = { accountMenu: [{label: "log out"}], helpMenu: [], anonymousMenu: [] };
100 const mainAppBar = mount(
102 menuItems={menuItems}
103 onContextMenu={jest.fn()}
104 onMenuItemClick={onMenuItemClick}
105 onContextMenu={jest.fn()}
106 onDetailsPanelToggle={jest.fn()}
107 {...{ user, searchText: "", breadcrumbs: [], onSearch: jest.fn(), onBreadcrumbClick: jest.fn() }}
111 mainAppBar.find(DropdownMenu).at(0).find(IconButton).simulate("click");
112 mainAppBar.find(DropdownMenu).at(0).find(MenuItem).at(1).simulate("click");
113 expect(onMenuItemClick).toBeCalledWith(menuItems.accountMenu[0]);