commit ed06dc11747d4ffb1dbbe0f3568308c6737c94c0
author Yoshie Muranaka <yoshiemuranaka@gmail.com> Tue Jun 16 12:12:27 2020 -0700
committer Yoshie Muranaka <yoshiemuranaka@gmail.com> Thu Jun 25 15:55:28 2020 -0700
tree 4519d33f88da7c4aa768c482c0c0810404682db0
parent 73e419a58213c74bd0f19b31cff1ee50147a3278

Add test hooks to event logs page

- Add data-test-id test hooks to simplify the xpath queries needed
  to set up automation testing
- Reduce the possibility of breaking automation tests when/if pages are
  updated

Adds test hooks to table checkboxes, batch action delete button,
inline row delete button. Will add hooks to table filter dropdown
separately, because the component needs refactoring.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: I84fef897bbe29ea410a3b7d663828ddd7c91aa88

src/components/Global/TableToolbar.vue

diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue
index b49b315..05b9669 100644
--- a/src/components/Global/TableToolbar.vue
+++ b/src/components/Global/TableToolbar.vue
@@ -9,6 +9,7 @@
           <b-button
             v-for="(action, index) in actions"
             :key="index"
+            :data-test-id="`table-button-${action.value}Selected`"
             variant="primary"
             class="d-block"
             @click="$emit('batchAction', action.value)"

src/views/Health/EventLogs/EventLogs.vue

diff --git a/src/views/Health/EventLogs/EventLogs.vue b/src/views/Health/EventLogs/EventLogs.vue
index 4b1a8f7..21a0e28 100644
--- a/src/views/Health/EventLogs/EventLogs.vue
+++ b/src/views/Health/EventLogs/EventLogs.vue
@@ -49,6 +49,7 @@
           <template v-slot:head(checkbox)>
             <b-form-checkbox
               v-model="tableHeaderCheckboxModel"
+              data-test-id="eventLogs-checkbox-selectAll"
               :indeterminate="tableHeaderCheckboxIndeterminate"
               @change="onChangeHeaderCheckbox($refs.table)"
             />
@@ -56,6 +57,7 @@
           <template v-slot:cell(checkbox)="row">
             <b-form-checkbox
               v-model="row.rowSelected"
+              :data-test-id="`eventLogs-checkbox-selectRow-${row.index}`"
               @change="toggleSelectRow($refs.table, row.index)"
             />
           </template>
@@ -72,15 +74,16 @@
           </template>
 
           <!-- Actions column -->
-          <template v-slot:cell(actions)="{ item }">
+          <template v-slot:cell(actions)="row">
             <table-row-action
-              v-for="(action, index) in item.actions"
+              v-for="(action, index) in row.item.actions"
               :key="index"
               :value="action.value"
               :title="action.title"
-              :row-data="item"
-              :export-name="item.id"
-              @click:tableAction="onTableRowAction($event, item)"
+              :row-data="row.item"
+              :export-name="row.item.id"
+              :data-test-id="`eventLogs-button-deleteRow-${row.index}`"
+              @click:tableAction="onTableRowAction($event, row.item)"
             >
               <template v-slot:icon>
                 <icon-export v-if="action.value === 'export'" />