From d56a6b231e95cb9e512051b1dae5ac50f31ee6fe Mon Sep 17 00:00:00 2001
From: Lucas Di Pentima <lucas@di-pentima.com.ar>
Date: Tue, 1 Sep 2020 18:05:42 -0300
Subject: [PATCH] 16679: Adds test on action dispatching when using the Logout
 menu item.

Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas@di-pentima.com.ar>
---
 src/store/auth/auth-action.ts                 |  6 +-
 .../main-app-bar/account-menu.test.tsx        | 51 +++++++++++++++
 .../main-app-bar/account-menu.tsx             | 64 ++++++++++---------
 3 files changed, 88 insertions(+), 33 deletions(-)
 create mode 100644 src/views-components/main-app-bar/account-menu.test.tsx

diff --git a/src/store/auth/auth-action.ts b/src/store/auth/auth-action.ts
index 1060ec70..15fe3d4d 100644
--- a/src/store/auth/auth-action.ts
+++ b/src/store/auth/auth-action.ts
@@ -97,8 +97,8 @@ export const login = (uuidPrefix: string, homeCluster: string, loginCluster: str
         dispatch(authActions.LOGIN());
     };
 
-export const logout = (deleteLinkData: boolean = false) => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-    dispatch(authActions.LOGOUT({ deleteLinkData }));
-};
+export const logout = (deleteLinkData: boolean = false) =>
+    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) =>
+        dispatch(authActions.LOGOUT({ deleteLinkData }));
 
 export type AuthAction = UnionOf<typeof authActions>;
diff --git a/src/views-components/main-app-bar/account-menu.test.tsx b/src/views-components/main-app-bar/account-menu.test.tsx
new file mode 100644
index 00000000..4436f6a3
--- /dev/null
+++ b/src/views-components/main-app-bar/account-menu.test.tsx
@@ -0,0 +1,51 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import * as Adapter from 'enzyme-adapter-react-16';
+import {configure, shallow } from 'enzyme';
+
+import { AccountMenuComponent } from './account-menu';
+
+configure({ adapter: new Adapter() });
+
+describe('<AccountMenu />', () => {
+    let props;
+    let wrapper;
+
+    beforeEach(() => {
+      props = {
+        classes: {},
+        user: {
+            email: 'email@example.com',
+            firstName: 'User',
+            lastName: 'Test',
+            uuid: 'zzzzz-tpzed-testuseruuid',
+            ownerUuid: '',
+            username: 'testuser',
+            prefs: {},
+            isAdmin: false,
+            isActive: true
+        },
+        currentRoute: '',
+        workbenchURL: '',
+        localCluser: 'zzzzz',
+        dispatch: jest.fn(),
+      };
+    });
+
+    describe('Logout Menu Item', () => {
+        beforeEach(() => {
+            wrapper = shallow(<AccountMenuComponent {...props} />).dive();
+        });
+
+        it('should dispatch a logout action when clicked', () => {
+            wrapper.find('[data-cy="logout-menuitem"]').simulate('click');
+            expect(props.dispatch).toHaveBeenCalledWith({
+                payload: {deleteLinkData: true},
+                type: 'LOGOUT',
+            });
+        });
+    });
+});
diff --git a/src/views-components/main-app-bar/account-menu.tsx b/src/views-components/main-app-bar/account-menu.tsx
index 37702536..6e844cc8 100644
--- a/src/views-components/main-app-bar/account-menu.tsx
+++ b/src/views-components/main-app-bar/account-menu.tsx
@@ -9,7 +9,7 @@ import { User, getUserDisplayName } from "~/models/user";
 import { DropdownMenu } from "~/components/dropdown-menu/dropdown-menu";
 import { UserPanelIcon } from "~/components/icon/icon";
 import { DispatchProp, connect } from 'react-redux';
-import { logout } from '~/store/auth/auth-action';
+import { authActions } from '~/store/auth/auth-action';
 import { RootState } from "~/store/store";
 import { openCurrentTokenDialog } from '~/store/current-token-dialog/current-token-dialog-actions';
 import { openRepositoriesPanel } from "~/store/repositories/repositories-actions";
@@ -56,32 +56,36 @@ const styles: StyleRulesCallback<CssRules> = () => ({
     }
 });
 
-export const AccountMenu = withStyles(styles)(
-    connect(mapStateToProps)(
-        ({ user, dispatch, currentRoute, workbenchURL, apiToken, localCluster, classes }: AccountMenuProps & DispatchProp<any> & WithStyles<CssRules>) =>
-            user
-                ? <DropdownMenu
-                    icon={<UserPanelIcon />}
-                    id="account-menu"
-                    title="Account Management"
-                    key={currentRoute}>
-                    <MenuItem disabled>
-                        {getUserDisplayName(user)} {user.uuid.substr(0, 5) !== localCluster && `(${user.uuid.substr(0, 5)})`}
-                    </MenuItem>
-                    {user.isActive ? <>
-                        <MenuItem onClick={() => dispatch(openUserVirtualMachines())}>Virtual Machines</MenuItem>
-                        {!user.isAdmin && <MenuItem onClick={() => dispatch(openRepositoriesPanel())}>Repositories</MenuItem>}
-                        <MenuItem onClick={() => dispatch(openCurrentTokenDialog)}>Current token</MenuItem>
-                        <MenuItem onClick={() => dispatch(navigateToSshKeysUser)}>Ssh Keys</MenuItem>
-                        <MenuItem onClick={() => dispatch(navigateToSiteManager)}>Site Manager</MenuItem>
-                        <MenuItem onClick={() => dispatch(navigateToMyAccount)}>My account</MenuItem>
-                        <MenuItem onClick={() => dispatch(navigateToLinkAccount)}>Link account</MenuItem>
-                    </> : null}
-                    <MenuItem>
-                        <a href={`${workbenchURL.replace(/\/$/, "")}/${wb1URL(currentRoute)}?api_token=${apiToken}`}
-                            className={classes.link}>
-                            Switch to Workbench v1</a></MenuItem>
-                    <Divider />
-                    <MenuItem onClick={() => dispatch(logout(true))}>Logout</MenuItem>
-                </DropdownMenu>
-                : null));
+export const AccountMenuComponent =
+    ({ user, dispatch, currentRoute, workbenchURL, apiToken, localCluster, classes }: AccountMenuProps & DispatchProp<any> & WithStyles<CssRules>) =>
+        user
+        ? <DropdownMenu
+            icon={<UserPanelIcon />}
+            id="account-menu"
+            title="Account Management"
+            key={currentRoute}>
+            <MenuItem disabled>
+                {getUserDisplayName(user)} {user.uuid.substr(0, 5) !== localCluster && `(${user.uuid.substr(0, 5)})`}
+            </MenuItem>
+            {user.isActive ? <>
+                <MenuItem onClick={() => dispatch(openUserVirtualMachines())}>Virtual Machines</MenuItem>
+                {!user.isAdmin && <MenuItem onClick={() => dispatch(openRepositoriesPanel())}>Repositories</MenuItem>}
+                <MenuItem onClick={() => dispatch(openCurrentTokenDialog)}>Current token</MenuItem>
+                <MenuItem onClick={() => dispatch(navigateToSshKeysUser)}>Ssh Keys</MenuItem>
+                <MenuItem onClick={() => dispatch(navigateToSiteManager)}>Site Manager</MenuItem>
+                <MenuItem onClick={() => dispatch(navigateToMyAccount)}>My account</MenuItem>
+                <MenuItem onClick={() => dispatch(navigateToLinkAccount)}>Link account</MenuItem>
+            </> : null}
+            <MenuItem>
+                <a href={`${workbenchURL.replace(/\/$/, "")}/${wb1URL(currentRoute)}?api_token=${apiToken}`}
+                    className={classes.link}>
+                    Switch to Workbench v1</a></MenuItem>
+            <Divider />
+            <MenuItem data-cy="logout-menuitem"
+                onClick={() => dispatch(authActions.LOGOUT({deleteLinkData: true}))}>
+                Logout
+            </MenuItem>
+        </DropdownMenu>
+        : null;
+
+export const AccountMenu = withStyles(styles)( connect(mapStateToProps)(AccountMenuComponent) );
-- 
2.30.2