Add test hooks to local user management

Adds test hooks to to all interactive elements:
inputs, checkboxes, radio, selects, buttons

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I7f3f6fbe968aeb23acf5a2ace7dbb3d4ed2aae77

3 files changed, 60 insertions, 8 deletions

diff --git a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
index cf7cc221..957ea137 100644
--- a/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
+++ b/src/views/AccessControl/LocalUserManagement/LocalUserManagement.vue
@@ -7,7 +7,11 @@
           <icon-settings />
           {{ $t('pageLocalUserManagement.accountPolicySettings') }}
         </b-button>
-        <b-button variant="primary" @click="initModalUser(null)">
+        <b-button
+          variant="primary"
+          data-test-id="localUserManagement-button-addUser"
+          @click="initModalUser(null)"
+        >
           <icon-add />
           {{ $t('pageLocalUserManagement.addUser') }}
         </b-button>
@@ -34,6 +38,7 @@
           <template v-slot:head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
+              data-test-id="localUserManagement-checkbox-tableHeaderCheckbox"
               :indeterminate="tableHeaderCheckboxIndeterminate"
               @change="onChangeHeaderCheckbox($refs.table)"
             />
@@ -41,6 +46,7 @@
           <template v-slot:cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
+              data-test-id="localUserManagement-checkbox-toggleSelectRow"
               @change="toggleSelectRow($refs.table, row.index)"
             />
           </template>
@@ -56,8 +62,18 @@
               @click:tableAction="onTableRowAction($event, item)"
             >
               <template v-slot:icon>
-                <icon-edit v-if="action.value === 'edit'" />
-                <icon-trashcan v-if="action.value === 'delete'" />
+                <icon-edit
+                  v-if="action.value === 'edit'"
+                  :data-test-id="
+                    `localUserManagement-tableRowAction-edit-${index}`
+                  "
+                />
+                <icon-trashcan
+                  v-if="action.value === 'delete'"
+                  :data-test-id="
+                    `localUserManagement-tableRowAction-delete-${index}`
+                  "
+                />
               </template>
             </table-row-action>
           </template>
@@ -66,7 +82,12 @@
     </b-row>
     <b-row>
       <b-col xl="8">
-        <b-button v-b-toggle.collapse-role-table variant="link" class="mt-3">
+        <b-button
+          v-b-toggle.collapse-role-table
+          data-test-id="localUserManagement-button-viewPrivilegeRoleDescriptions"
+          variant="link"
+          class="mt-3"
+        >
           <icon-chevron />
           {{ $t('pageLocalUserManagement.viewPrivilegeRoleDescriptions') }}
         </b-button>
diff --git a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
index 8727b20e..405aa8cb 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalSettings.vue
@@ -29,6 +29,7 @@
                 v-model.number="form.lockoutThreshold"
                 type="number"
                 aria-describedby="lockout-threshold-help-block"
+                data-test-id="localUserManagement-input-lockoutThreshold"
                 :state="getValidationState($v.form.lockoutThreshold)"
                 @input="$v.form.lockoutThreshold.$touch()"
               />
@@ -61,6 +62,7 @@
                 name="unlock-method"
                 class="mb-2"
                 :value="0"
+                data-test-id="localUserManagement-radio-manualUnlock"
                 @input="$v.form.unlockMethod.$touch()"
               >
                 {{ $t('pageLocalUserManagement.modal.manual') }}
@@ -69,6 +71,7 @@
                 v-model="form.unlockMethod"
                 name="unlock-method"
                 :value="1"
+                data-test-id="localUserManagement-radio-automaticUnlock"
                 @input="$v.form.unlockMethod.$touch()"
               >
                 {{ $t('pageLocalUserManagement.modal.automaticAfterTimeout') }}
@@ -83,6 +86,7 @@
                   v-model.number="form.lockoutDuration"
                   aria-describedby="lockout-duration-help-block"
                   type="number"
+                  data-test-id="localUserManagement-input-lockoutDuration"
                   :state="getValidationState($v.form.lockoutDuration)"
                   :readonly="$v.form.unlockMethod.$model === 0"
                   @input="$v.form.lockoutDuration.$touch()"
@@ -102,13 +106,18 @@
       </b-container>
     </b-form>
     <template v-slot:modal-footer="{ ok, cancel }">
-      <b-button variant="secondary" @click="cancel()">
+      <b-button
+        variant="secondary"
+        data-test-id="localUserManagement-button-cancel"
+        @click="cancel()"
+      >
         {{ $t('global.action.cancel') }}
       </b-button>
       <b-button
         form="form-settings"
         type="submit"
         variant="primary"
+        data-test-id="localUserManagement-button-submit"
         @click="ok()"
       >
         {{ $t('global.action.save') }}
diff --git a/src/views/AccessControl/LocalUserManagement/ModalUser.vue b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
index 3c46d666..75961e34 100644
--- a/src/views/AccessControl/LocalUserManagement/ModalUser.vue
+++ b/src/views/AccessControl/LocalUserManagement/ModalUser.vue
@@ -25,10 +25,16 @@
             </alert>
           </b-col>
           <b-col sm="3">
-            <input v-model="form.manualUnlock" type="hidden" value="false" />
+            <input
+              v-model="form.manualUnlock"
+              data-test-id="localUserManagement-input-manualUnlock"
+              type="hidden"
+              value="false"
+            />
             <b-button
               variant="primary"
               :disabled="$v.form.manualUnlock.$dirty"
+              data-test-id="localUserManagement-button-manualUnlock"
               @click="$v.form.manualUnlock.$touch()"
             >
               {{ $t('pageLocalUserManagement.modal.unlock') }}
@@ -44,6 +50,7 @@
                 v-model="form.status"
                 name="user-status"
                 :value="true"
+                data-test-id="localUserManagement-radioButton-statusEnabled"
                 @input="$v.form.status.$touch()"
               >
                 {{ $t('global.status.enabled') }}
@@ -51,6 +58,7 @@
               <b-form-radio
                 v-model="form.status"
                 name="user-status"
+                data-test-id="localUserManagement-radioButton-statusDisabled"
                 :value="false"
                 @input="$v.form.status.$touch()"
               >
@@ -75,6 +83,7 @@
                 v-model="form.username"
                 type="text"
                 aria-describedby="username-help-block"
+                data-test-id="localUserManagement-input-username"
                 :state="getValidationState($v.form.username)"
                 :disabled="!newUser && originalUsername === 'root'"
                 @input="$v.form.username.$touch()"
@@ -101,6 +110,7 @@
                 id="privilege"
                 v-model="form.privilege"
                 :options="privilegeTypes"
+                data-test-id="localUserManagement-select-privilege"
                 :state="getValidationState($v.form.privilege)"
                 @input="$v.form.privilege.$touch()"
               >
@@ -130,6 +140,7 @@
                   id="password"
                   v-model="form.password"
                   type="password"
+                  data-test-id="localUserManagement-input-password"
                   aria-describedby="password-help-block"
                   :state="getValidationState($v.form.password)"
                   @input="$v.form.password.$touch()"
@@ -164,6 +175,7 @@
                 <b-form-input
                   id="password-confirmation"
                   v-model="form.passwordConfirmation"
+                  data-test-id="localUserManagement-input-passwordConfirmation"
                   type="password"
                   :state="getValidationState($v.form.passwordConfirmation)"
                   @input="$v.form.passwordConfirmation.$touch()"
@@ -187,10 +199,20 @@
       </b-container>
     </b-form>
     <template v-slot:modal-footer="{ ok, cancel }">
-      <b-button variant="secondary" @click="cancel()">
+      <b-button
+        variant="secondary"
+        data-test-id="localUserManagement-button-cancel"
+        @click="cancel()"
+      >
         {{ $t('global.action.cancel') }}
       </b-button>
-      <b-button form="form-user" type="submit" variant="primary" @click="onOk">
+      <b-button
+        form="form-user"
+        data-test-id="localUserManagement-button-submit"
+        type="submit"
+        variant="primary"
+        @click="onOk"
+      >
         <template v-if="newUser">
           {{ $t('pageLocalUserManagement.addUser') }}
         </template>