19504: Fix breadcrumb unit tests
authorStephen Smith <stephen@curii.com>
Wed, 16 Nov 2022 19:47:50 +0000 (14:47 -0500)
committerStephen Smith <stephen@curii.com>
Wed, 16 Nov 2022 19:47:50 +0000 (14:47 -0500)
Arvados-DCO-1.1-Signed-off-by: Stephen Smith <stephen@curii.com>

src/components/breadcrumbs/breadcrumbs.test.tsx

index 1594c0366c6d11f8ffb238ce1f107de4c6d15c72..f17ce3936dc7d0c5604047322df99daf107423ba 100644 (file)
@@ -3,12 +3,15 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import React from "react";
-import { configure, shallow } from "enzyme";
+import { configure, mount } from "enzyme";
 
 import Adapter from "enzyme-adapter-react-16";
 import { Breadcrumbs } from "./breadcrumbs";
-import { Button } from "@material-ui/core";
+import { Button, MuiThemeProvider } from "@material-ui/core";
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
+import { CustomTheme } from 'common/custom-theme';
+import { Provider } from "react-redux";
+import { combineReducers, createStore } from "redux";
 
 configure({ adapter: new Adapter() });
 
@@ -16,36 +19,63 @@ describe("<Breadcrumbs />", () => {
 
     let onClick: () => void;
     let resources = {};
-
+    let store;
     beforeEach(() => {
         onClick = jest.fn();
+        const initialAuthState = {
+            config: {
+                clusterConfig: {
+                    Collections: {
+                        ForwardSlashNameSubstitution: "/"
+                    }
+                }
+            }
+        }
+        store = createStore(combineReducers({
+            auth: (state: any = initialAuthState, action: any) => state,
+        }));
     });
 
     it("renders one item", () => {
         const items = [
-            { label: 'breadcrumb 1' }
+            { label: 'breadcrumb 1', uuid: '1' }
         ];
-        const breadcrumbs = shallow(<Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />).dive();
+        const breadcrumbs = mount(
+            <Provider store={store}>
+                <MuiThemeProvider theme={CustomTheme}>
+                    <Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />
+                </MuiThemeProvider>
+            </Provider>);
         expect(breadcrumbs.find(Button)).toHaveLength(1);
         expect(breadcrumbs.find(ChevronRightIcon)).toHaveLength(0);
     });
 
     it("renders multiple items", () => {
         const items = [
-            { label: 'breadcrumb 1' },
-            { label: 'breadcrumb 2' }
+            { label: 'breadcrumb 1', uuid: '1' },
+            { label: 'breadcrumb 2', uuid: '2' }
         ];
-        const breadcrumbs = shallow(<Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />).dive();
+        const breadcrumbs = mount(
+            <Provider store={store}>
+                <MuiThemeProvider theme={CustomTheme}>
+                    <Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />
+                </MuiThemeProvider>
+            </Provider>);
         expect(breadcrumbs.find(Button)).toHaveLength(2);
         expect(breadcrumbs.find(ChevronRightIcon)).toHaveLength(1);
     });
 
     it("calls onClick with clicked item", () => {
         const items = [
-            { label: 'breadcrumb 1' },
-            { label: 'breadcrumb 2' }
+            { label: 'breadcrumb 1', uuid: '1' },
+            { label: 'breadcrumb 2', uuid: '2' }
         ];
-        const breadcrumbs = shallow(<Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />).dive();
+        const breadcrumbs = mount(
+            <Provider store={store}>
+                <MuiThemeProvider theme={CustomTheme}>
+                    <Breadcrumbs items={items} resources={resources} onClick={onClick} onContextMenu={jest.fn()} />
+                </MuiThemeProvider>
+            </Provider>);
         breadcrumbs.find(Button).at(1).simulate('click');
         expect(onClick).toBeCalledWith(items[1]);
     });