diff options
author | Dixsie Wolmers <dixsie@ibm.com> | 2020-09-08 22:13:38 +0300 |
---|---|---|
committer | Derick Montague <derick.montague@ibm.com> | 2020-10-05 23:10:23 +0300 |
commit | b53e086876138f065bd0d976432a7eb75d254cd6 (patch) | |
tree | 410f5d7947211ff93c295a9ea366be9ac4879cdb /src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue | |
parent | 741f375e22d8e3df13e22a015b9fd4a7999f6903 (diff) | |
download | webui-vue-b53e086876138f065bd0d976432a7eb75d254cd6.tar.xz |
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
Diffstat (limited to 'src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue')
-rw-r--r-- | src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue | 13 |
1 files changed, 10 insertions, 3 deletions
diff --git a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue index ec7c1637..b72a6cc2 100644 --- a/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue +++ b/src/views/Health/HardwareStatus/HardwareStatusTableDimmSlot.vue @@ -34,9 +34,10 @@ <b-button variant="link" data-test-id="hardwareStatus-button-expandDimms" - @click="row.toggleDetails" + :aria-label="expandRowLabel" + @click="toggleRowDetails(row)" > - <icon-chevron /> + <icon-chevron :title="expandRowLabel" /> </b-button> </template> @@ -74,10 +75,16 @@ import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin import TableSortMixin from '@/components/Mixins/TableSortMixin'; import Search from '@/components/Global/Search'; import SearchFilterMixin from '@/components/Mixins/SearchFilterMixin'; +import TableRowExpandMixin from '@/components/Mixins/TableRowExpandMixin'; export default { components: { IconChevron, PageSection, StatusIcon, Search, TableCellCount }, - mixins: [TableDataFormatterMixin, TableSortMixin, SearchFilterMixin], + mixins: [ + TableRowExpandMixin, + TableDataFormatterMixin, + TableSortMixin, + SearchFilterMixin + ], data() { return { fields: [ |