[test-only] E2e. changing user

packages/web-app-admin-settings/src/components/Users/SideBar/EditPanel.vue

@@ -4,6 +4,7 @@
     <form id="user-edit-form" class="oc-background-highlight oc-p-m" autocomplete="off">
       <div>
         <oc-text-input
+          id="userName-input"
           v-model="editUser.onPremisesSamAccountName"
           class="oc-mb-s"
           :label="$gettext('User name')"
@@ -12,6 +13,7 @@
           @update:model-value="validateUserName"
         />
         <oc-text-input
+          id="displayName-input"
           v-model="editUser.displayName"
           class="oc-mb-s"
           :label="$gettext('First and last name')"
@@ -20,6 +22,7 @@
           @update:model-value="validateDisplayName"
         />
         <oc-text-input
+          id="email-input"
           v-model="editUser.mail"
           class="oc-mb-s"
           :label="$gettext('Email')"
@@ -29,6 +32,7 @@
           @change="validateEmail"
         />
         <oc-text-input
+          id="password-input"
           :model-value="editUser.passwordProfile?.password"
           class="oc-mb-s"
           :label="$gettext('Password')"
@@ -39,6 +43,7 @@
         />
         <div class="oc-mb-s">
           <oc-select
+            id="role-input"
             :model-value="editUser"
             :label="$gettext('Role')"
             option-label="displayName"

packages/web-app-admin-settings/tests/unit/components/Users/SideBar/__snapshots__/EditPanel.spec.ts.snap

@@ -5,12 +5,12 @@ exports[`EditPanel renders all available inputs 1`] = `
   <user-info-box-stub user="[object Object]"></user-info-box-stub>
   <form autocomplete="off" class="oc-background-highlight oc-p-m" id="user-edit-form">
     <div>
-      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="oc-textinput-1" label="User name" type="text"></oc-text-input-stub>
-      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="oc-textinput-2" label="First and last name" modelvalue="jan" type="text"></oc-text-input-stub>
-      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="oc-textinput-3" label="Email" modelvalue="[email protected]" type="email"></oc-text-input-stub>
-      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" fixmessageline="true" id="oc-textinput-4" label="Password" modelvalue="" placeholder="●●●●●●●●" type="password"></oc-text-input-stub>
+      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="userName-input" label="User name" type="text"></oc-text-input-stub>
+      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="displayName-input" label="First and last name" modelvalue="jan" type="text"></oc-text-input-stub>
+      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" errormessage="" fixmessageline="true" id="email-input" label="Email" modelvalue="[email protected]" type="email"></oc-text-input-stub>
+      <oc-text-input-stub class="oc-mb-s" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" fixmessageline="true" id="password-input" label="Password" modelvalue="" placeholder="●●●●●●●●" type="password"></oc-text-input-stub>
       <div class="oc-mb-s">
-        <oc-select-stub clearable="false" disabled="false" filter="[Function]" id="oc-select-5" label="Role" loading="false" model-value="[object Object]" optionlabel="displayName" options="[object Object]" searchable="true"></oc-select-stub>
+        <oc-select-stub clearable="false" disabled="false" filter="[Function]" id="role-input" label="Role" loading="false" model-value="[object Object]" optionlabel="displayName" options="[object Object]" searchable="true"></oc-select-stub>
         <div class="oc-text-input-message"></div>
       </div>
       <div class="oc-mb-s">

tests/e2e/cucumber/features/smoke/admin-settings/users.ocis.feature

@@ -81,3 +81,24 @@ Feature: spaces management
       | Alice |
       | Brian |
     And "Admin" logs out
+
+
+  Scenario: edit user
+    Given "Admin" creates following users
+      | id    |
+      | Alice |
+    When "Admin" logs in
+    And "Admin" opens the "admin-settings" app
+    And "Admin" navigates to the users management page
+    When "Admin" changes userName to "anna" for user "Alice" using the sidebar panel
+    And "Admin" changes displayName to "Anna Murphy" for user "Alice" using the sidebar panel
+    And "Admin" changes email to "[email protected]" for user "Alice" using the sidebar panel
+    And "Admin" changes password to "password" for user "Alice" using the sidebar panel
+    And "Admin" changes role to "Space Admin" for user "Alice" using the sidebar panel
+    And "Admin" logs out
+    When "anna" logs in
+    Then "anna" should have self info:
+      | key         | value            |
+      | username    | anna             |
+      | displayname | Anna Murphy      |
+      | email       | [email protected] |

tests/e2e/cucumber/steps/ui/adminSettings.ts

@@ -1,6 +1,6 @@
 import { DataTable, Then, When } from '@cucumber/cucumber'
 import { World } from '../../environment'
-import { objects } from '../../../support'
+import { api, objects } from '../../../support'
 import { expect } from '@playwright/test'
 
 When(
@@ -242,3 +242,35 @@ When(
     }
   }
 )
+
+When(
+  /^"([^"]*)" changes (userName|displayName|email|password|role) to "([^"]*)" for user "([^"]*)" using the sidebar panel$/,
+  async function (
+    this: World,
+    stepUser: string,
+    attribute: string,
+    value: string,
+    user: string
+  ): Promise<void> {
+    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
+    const usersObject = new objects.applicationAdminSettings.Users({ page })
+
+    // deleting a user with a same userName before testing
+    if (attribute === 'userName') {
+      const newUser = this.usersEnvironment.createUser({
+        key: value,
+        user: {
+          id: value,
+          displayName: '',
+          password: 'password',
+          email: ''
+        }
+      })
+      await api.graph.deleteUser({
+        user: newUser,
+        admin: this.usersEnvironment.getUser({ key: stepUser })
+      })
+    }
+    await usersObject.changeUser({ key: user, attribute: attribute, value: value })
+  }
+)

tests/e2e/cucumber/steps/ui/application.ts

@@ -1,4 +1,4 @@
-import { When, Then } from '@cucumber/cucumber'
+import { When, Then, DataTable } from '@cucumber/cucumber'
 import { World } from '../../environment'
 import { objects } from '../../../support'
 import { expect } from '@playwright/test'
@@ -27,3 +27,15 @@ Then(
     expect(quotaValue).toBe(quota)
   }
 )
+
+Then(
+  /^"([^"]*)" should have self info:$/,
+  async function (this: World, stepUser: string, stepTable: DataTable): Promise<void> {
+    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
+    const accountObject = new objects.account.Account({ page })
+
+    for (const info of stepTable.hashes()) {
+      expect(info.value).toBe(await accountObject.getUserInfo(info.key))
+    }
+  }
+)

tests/e2e/support/objects/account/account.ts

@@ -1,7 +1,10 @@
 import { Page } from 'playwright'
+import util from 'util'
 
 const accountMenuButton = '.oc-topbar-personal-avatar'
 const quotaValue = '.storage-wrapper-text .oc-text-small'
+const accountManageButton = '#oc-topbar-account-manage'
+const infoValue = '.account-page-info-%s dd'
 
 export class Account {
   #page: Page
@@ -20,4 +23,10 @@ export class Account {
     const value = quotaText.split('of')
     return value[1].replace(/[^0-9]/g, '')
   }
+
+  async getUserInfo(key: string): Promise<string> {
+    await this.#page.locator(accountMenuButton).click()
+    await this.#page.locator(accountManageButton).click()
+    return await this.#page.locator(util.format(infoValue, key)).textContent()
+  }
 }

tests/e2e/support/objects/app-admin-settings/users/actions.ts

@@ -21,6 +21,8 @@ const userCheckboxSelector = `[data-item-id="%s"]:not(.oc-table-highlighted) inp
 const editQuotaBtn = '.oc-files-actions-edit-quota-trigger'
 const quotaInputBatchAction = '#quota-select-batch-action-form .vs__search'
 const confirmChangeQuotaSeveralSpacesBtn = '.oc-modal-body-actions-confirm'
+const userInput = '#%s-input'
+const roleValueDropDown = `.vs__dropdown-menu :text-is("%s")`
 
 export const changeAccountEnabled = async (args: {
   page: Page
@@ -158,3 +160,30 @@ export const filterUsers = async (args: {
     ])
   }
 }
+
+export const changeUser = async (args: {
+  page: Page
+  uuid: string
+  attribute: string
+  value: string
+}): Promise<void> => {
+  const { page, attribute, value, uuid } = args
+  await page.locator(util.format(userIdSelector, uuid)).click()
+  await page.waitForSelector(editActionBtn)
+  await page.locator(`.context-menu`).locator(editActionBtn).click()
+  await page.locator(util.format(userInput, attribute)).fill(value)
+
+  if (attribute === 'role') {
+    await page.locator(util.format(roleValueDropDown, value)).click()
+  }
+
+  await Promise.all([
+    page.waitForResponse(
+      (resp) =>
+        resp.url().endsWith(encodeURIComponent(uuid)) &&
+        resp.status() === 200 &&
+        resp.request().method() === 'PATCH'
+    ),
+    await page.locator(compareDialogConfirm).click()
+  ])
+}

tests/e2e/support/objects/app-admin-settings/users/index.ts

@@ -8,7 +8,8 @@ import {
   filterUsers,
   getDisplayedUsers,
   removeSelectedUsersFromGroups,
-  selectUser
+  selectUser,
+  changeUser
 } from './actions'
 
 export class Users {
@@ -57,4 +58,16 @@ export class Users {
   async filter({ filter, values }: { filter: string; values: string[] }): Promise<void> {
     await filterUsers({ page: this.#page, filter, values })
   }
+  async changeUser({
+    key,
+    attribute,
+    value
+  }: {
+    key: string
+    attribute: string
+    value: string
+  }): Promise<void> {
+    const { uuid } = this.#usersEnvironment.getUser({ key })
+    await changeUser({ uuid, attribute: attribute, value: value, page: this.#page })
+  }
 }