18559: Add user profile tests.

[arvados-workbench2.git] / src / views / user-profile-panel / user-profile-panel-root.tsx

diff --git a/src/views/user-profile-panel/user-profile-panel-root.tsx b/src/views/user-profile-panel/user-profile-panel-root.tsx
index 2176b3235b5854278ec0a72324dec28f6750bfbc..82c20728209d8ef319f95172a566748afeb5e114 100644 (file)
--- a/src/views/user-profile-panel/user-profile-panel-root.tsx
+++ b/src/views/user-profile-panel/user-profile-panel-root.tsx
@@ -84,6 +84,7 @@ export interface UserProfilePanelRootDataProps {
 }
 
 const RoleTypes = [
+    { key: '', value: '' },
     { key: 'Bio-informatician', value: 'Bio-informatician' },
     { key: 'Data Scientist', value: 'Data Scientist' },
     { key: 'Analyst', value: 'Analyst' },
@@ -103,6 +104,13 @@ export enum UserProfileGroupsColumnNames {
     REMOVE = "Remove",
 }
 
+enum TABS {
+    PROFILE = "PROFILE",
+    GROUPS = "GROUPS",
+    ADMIN = "ADMIN",
+
+}
+
 export const userProfileGroupsColumns: DataColumns<string> = [
     {
         name: UserProfileGroupsColumnNames.NAME,
@@ -143,11 +151,11 @@ export const userProfileGroupsColumns: DataColumns<string> = [
 
 const ReadOnlyField = withStyles(styles)(
     (props: ({ label: string, input: {value: string} }) & WithStyles<CssRules> ) => (
-        <Grid item xs={12}>
+        <Grid item xs={12} data-cy="field">
             <Typography className={props.classes.label}>
                 {props.label}
             </Typography>
-            <Typography className={props.classes.readOnlyValue}>
+            <Typography className={props.classes.readOnlyValue} data-cy="value">
                 {props.input.value}
             </Typography>
         </Grid>
@@ -157,25 +165,25 @@ const ReadOnlyField = withStyles(styles)(
 export const UserProfilePanelRoot = withStyles(styles)(
     class extends React.Component<UserProfilePanelRootProps> {
         state = {
-            value: 0,
+            value: TABS.PROFILE,
         };
 
         componentDidMount() {
-            this.setState({ value: 0 });
+            this.setState({ value: TABS.PROFILE});
         }
 
         render() {
             return <Paper className={this.props.classes.root}>
                 <Tabs value={this.state.value} onChange={this.handleChange} variant={"fullWidth"}>
-                    <Tab label="PROFILE" />
-                    <Tab label="GROUPS" />
-                    <Tab label="ADMIN" disabled={!this.props.isAdmin} />
+                    <Tab label={TABS.PROFILE} value={TABS.PROFILE} />
+                    <Tab label={TABS.GROUPS} value={TABS.GROUPS} />
+                    {this.props.isAdmin && <Tab label={TABS.ADMIN} value={TABS.ADMIN} />}
                 </Tabs>
-                {this.state.value === 0 &&
+                {this.state.value === TABS.PROFILE &&
                     <CardContent>
-                        <form onSubmit={this.props.handleSubmit}>
+                        <form onSubmit={this.props.handleSubmit} data-cy="profile-form">
                             <Grid container spacing={24}>
-                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12}>
+                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12} data-cy="firstName">
                                     <Field
                                         label="First name"
                                         name="firstName"
@@ -183,7 +191,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         disabled
                                     />
                                 </Grid>
-                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12}>
+                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12} data-cy="lastName">
                                     <Field
                                         label="Last name"
                                         name="lastName"
@@ -191,7 +199,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         disabled
                                     />
                                 </Grid>
-                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12}>
+                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12} data-cy="email">
                                     <Field
                                         label="E-mail"
                                         name="email"
@@ -199,7 +207,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         disabled
                                     />
                                 </Grid>
-                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12}>
+                                <Grid item className={this.props.classes.gridItem} sm={6} xs={12} data-cy="username">
                                     <Field
                                         label="Username"
                                         name="username"
@@ -212,7 +220,6 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         label="Organization"
                                         name="prefs.profile.organization"
                                         component={TextField as any}
-                                        validate={MY_ACCOUNT_VALIDATION}
                                         disabled={!this.props.isAdmin && !this.props.isSelf}
                                     />
                                 </Grid>
@@ -221,7 +228,6 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         label="E-mail at Organization"
                                         name="prefs.profile.organization_email"
                                         component={TextField as any}
-                                        validate={MY_ACCOUNT_VALIDATION}
                                         disabled={!this.props.isAdmin && !this.props.isSelf}
                                     />
                                 </Grid>
@@ -259,12 +265,14 @@ export const UserProfilePanelRoot = withStyles(styles)(
                         </form >
                     </CardContent>
                 }
-                {this.state.value === 1 &&
+                {this.state.value === TABS.GROUPS &&
                     <div className={this.props.classes.content}>
                         <DataExplorer
                                 id={USER_PROFILE_PANEL_ID}
+                                data-cy="user-profile-groups-data-explorer"
                                 onRowClick={noop}
                                 onRowDoubleClick={noop}
+                                onContextMenu={noop}
                                 contextMenuColumn={false}
                                 hideColumnSelector
                                 hideSearchInput
@@ -277,7 +285,7 @@ export const UserProfilePanelRoot = withStyles(styles)(
                                         messages={['Group list is empty.']} />
                                 } />
                     </div>}
-                {this.state.value === 2 &&
+                {this.props.isAdmin && this.state.value === TABS.ADMIN &&
                     <Paper elevation={0} className={this.props.classes.adminRoot}>
                         <Card elevation={0}>
                             <CardContent>