Update main-app-bar tests
authorMichal Klobukowski <michal.klobukowski@contractors.roche.com>
Tue, 28 Aug 2018 09:16:10 +0000 (11:16 +0200)
committerMichal Klobukowski <michal.klobukowski@contractors.roche.com>
Tue, 28 Aug 2018 09:16:10 +0000 (11:16 +0200)
Feature #14102

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>

src/views-components/main-app-bar/main-app-bar.test.tsx
src/views-components/main-app-bar/main-app-bar.tsx

index 75a39fd57ac74ecb72634ab7aadb563176670aaf..030fb353e3d3e52f15dbfd22f478126a87b55807 100644 (file)
@@ -5,7 +5,7 @@
 import * as React from "react";
 import { mount, configure } from "enzyme";
 import * as Adapter from "enzyme-adapter-react-16";
-import { MainAppBar } from "./main-app-bar";
+import { MainAppBar, MainAppBarProps } from './main-app-bar';
 import { SearchBar } from "~/components/search-bar/search-bar";
 import { Breadcrumbs } from "~/components/breadcrumbs/breadcrumbs";
 import { DropdownMenu } from "~/components/dropdown-menu/dropdown-menu";
@@ -27,10 +27,7 @@ describe("<MainAppBar />", () => {
     it("renders all components and the menu for authenticated user if user prop has value", () => {
         const mainAppBar = mount(
             <MainAppBar
-                user={user}
-                onContextMenu={jest.fn()}
-                onDetailsPanelToggle={jest.fn()}
-                {...{ searchText: "", breadcrumbs: [], menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onSearch: jest.fn(), onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
+                {...mockMainAppBarProps({ user })}
             />
         );
         expect(mainAppBar.find(SearchBar)).toHaveLength(1);
@@ -42,10 +39,7 @@ describe("<MainAppBar />", () => {
         const menuItems = { accountMenu: [], helpMenu: [], anonymousMenu: [{ label: 'Sign in' }] };
         const mainAppBar = mount(
             <MainAppBar
-                menuItems={menuItems}
-                onDetailsPanelToggle={jest.fn()}
-                onContextMenu={jest.fn()}
-                {...{ searchText: "", breadcrumbs: [], onSearch: jest.fn(), onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
+                {...mockMainAppBarProps({ user: undefined, menuItems })}
             />
         );
         expect(mainAppBar.find(SearchBar)).toHaveLength(0);
@@ -58,12 +52,7 @@ describe("<MainAppBar />", () => {
         const onSearch = jest.fn();
         const mainAppBar = mount(
             <MainAppBar
-                searchText="search text"
-                searchDebounce={2000}
-                onContextMenu={jest.fn()}
-                onSearch={onSearch}
-                onDetailsPanelToggle={jest.fn()}
-                {...{ user, breadcrumbs: [], menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onBreadcrumbClick: jest.fn(), onMenuItemClick: jest.fn() }}
+                {...mockMainAppBarProps({ searchText: 'search text', searchDebounce: 2000, onSearch, user })}
             />
         );
         const searchBar = mainAppBar.find(SearchBar);
@@ -73,34 +62,12 @@ describe("<MainAppBar />", () => {
         expect(onSearch).toBeCalledWith("new search text");
     });
 
-    it("communicates with <Breadcrumbs />", () => {
-        const items = [{ label: "breadcrumb 1" }];
-        const onBreadcrumbClick = jest.fn();
-        const mainAppBar = mount(
-            <MainAppBar
-                breadcrumbs={items}
-                onContextMenu={jest.fn()}
-                onBreadcrumbClick={onBreadcrumbClick}
-                onDetailsPanelToggle={jest.fn()}
-                {...{ user, searchText: "", menuItems: { accountMenu: [], helpMenu: [], anonymousMenu: [] }, onSearch: jest.fn(), onMenuItemClick: jest.fn() }}
-            />
-        );
-        const breadcrumbs = mainAppBar.find(Breadcrumbs);
-        expect(breadcrumbs.prop("items")).toBe(items);
-        breadcrumbs.prop("onClick")(items[0]);
-        expect(onBreadcrumbClick).toBeCalledWith(items[0]);
-    });
-
     it("communicates with menu", () => {
         const onMenuItemClick = jest.fn();
-        const menuItems = { accountMenu: [{label: "log out"}], helpMenu: [], anonymousMenu: [] };
+        const menuItems = { accountMenu: [{ label: "log out" }], helpMenu: [], anonymousMenu: [] };
         const mainAppBar = mount(
             <MainAppBar
-                menuItems={menuItems}
-                onContextMenu={jest.fn()}
-                onMenuItemClick={onMenuItemClick}
-                onDetailsPanelToggle={jest.fn()}
-                {...{ user, searchText: "", breadcrumbs: [], onSearch: jest.fn(), onBreadcrumbClick: jest.fn() }}
+                {...mockMainAppBarProps({ menuItems, onMenuItemClick, user })}
             />
         );
 
@@ -109,3 +76,20 @@ describe("<MainAppBar />", () => {
         expect(onMenuItemClick).toBeCalledWith(menuItems.accountMenu[0]);
     });
 });
+
+const Breadcrumbs = () => <span>Breadcrumbs</span>;
+
+const mockMainAppBarProps = (props: Partial<MainAppBarProps>): MainAppBarProps => ({
+    searchText: '',
+    breadcrumbs: Breadcrumbs,
+    menuItems: {
+        accountMenu: [],
+        helpMenu: [],
+        anonymousMenu: [],
+    },
+    buildInfo: '',
+    onSearch: jest.fn(),
+    onMenuItemClick: jest.fn(),
+    onDetailsPanelToggle: jest.fn(),
+    ...props,
+});
index 73a8608c8afe7f5a8dc0b97955a3059e176a1a27..de6be7e7948fa78fbf8a232db386139a351052a1 100644 (file)
@@ -6,7 +6,6 @@ import * as React from "react";
 import { AppBar, Toolbar, Typography, Grid, IconButton, Badge, Button, MenuItem } from "@material-ui/core";
 import { User, getUserFullname } from "~/models/user";
 import { SearchBar } from "~/components/search-bar/search-bar";
-import { Breadcrumbs, Breadcrumb } from "~/components/breadcrumbs/breadcrumbs";
 import { DropdownMenu } from "~/components/dropdown-menu/dropdown-menu";
 import { DetailsIcon, NotificationIcon, UserPanelIcon, HelpIcon } from "~/components/icon/icon";
 
@@ -35,7 +34,7 @@ export interface MainAppBarActionProps {
     onDetailsPanelToggle: () => void;
 }
 
-type MainAppBarProps = MainAppBarDataProps & MainAppBarActionProps;
+export type MainAppBarProps = MainAppBarDataProps & MainAppBarActionProps;
 
 export const MainAppBar: React.SFC<MainAppBarProps> = (props) => {
     return <AppBar position="static">