From b53e086876138f065bd0d976432a7eb75d254cd6 Mon Sep 17 00:00:00 2001
From: Dixsie Wolmers <dixsie@ibm.com>
Date: Tue, 8 Sep 2020 14:13:38 -0500
Subject: Fix hardware status expand button accessiblity

- Aria label added to provide screen readers context for button action
- Title added to chevron icon to display label on hover

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ib8c0cef36d7aa61e0b4b0ac7fdabffb7e8a0a17a
---
 .../HardwareStatus/HardwareStatusTableProcessors.vue      | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

(limited to 'src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue')

diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
index 5a27cca7..6b2648b5 100644
--- a/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
+++ b/src/views/Health/HardwareStatus/HardwareStatusTableProcessors.vue
@@ -33,9 +33,10 @@
         <b-button
           variant="link"
           data-test-id="hardwareStatus-button-expandProcessors"
-          @click="row.toggleDetails"
+          :aria-label="expandRowLabel"
+          @click="toggleRowDetails(row)"
         >
-          <icon-chevron />
+          <icon-chevron :title="expandRowLabel" />
         </b-button>
       </template>
       <!-- Health -->
@@ -103,10 +104,16 @@ import TableSortMixin from '@/components/Mixins/TableSortMixin';
 import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin';
 import Search from '@/components/Global/Search';
 import SearchFilterMixin from '@/components/Mixins/SearchFilterMixin';
+import TableRowExpandMixin from '@/components/Mixins/TableRowExpandMixin';
 
 export default {
-  components: { PageSection, IconChevron, TableCellCount, StatusIcon, Search },
-  mixins: [TableDataFormatterMixin, TableSortMixin, SearchFilterMixin],
+  components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount },
+  mixins: [
+    TableRowExpandMixin,
+    TableDataFormatterMixin,
+    TableSortMixin,
+    SearchFilterMixin
+  ],
   data() {
     return {
       fields: [
-- 
cgit v1.2.3