Skip to content

Commit e06d6f3

Browse files
authored
fix(ui5-table): improve accessibility (#2534)
1 parent 5f8e0e2 commit e06d6f3

File tree

4 files changed

+9
-6
lines changed

4 files changed

+9
-6
lines changed

packages/main/src/Table.hbs

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
<table border="0" cellspacing="0" cellpadding="0" @keydown="{{_onkeydown}}">
1+
<table border="0" cellspacing="0" cellpadding="0" @keydown="{{_onkeydown}}" role="table">
22

33
<thead>
4-
<tr id="{{_id}}-columnHeader" class="ui5-table-header-row" tabindex="0" style="height: 48px" @click="{{_onColumnHeaderClick}}">
4+
<tr id="{{_id}}-columnHeader" role="row" class="ui5-table-header-row" tabindex="0" style="height: 48px" @click="{{_onColumnHeaderClick}}">
55
{{#each visibleColumns}}
66
<slot name="{{this._individualSlot}}"></slot>
77
{{/each}}
@@ -15,8 +15,8 @@
1515

1616
{{#unless rows.length}}
1717
{{#if showNoData}}
18-
<tr class="ui5-table-no-data-row-root">
19-
<td colspan="{{visibleColumnsCount}}">
18+
<tr class="ui5-table-no-data-row-root" role="row">
19+
<td colspan="{{visibleColumnsCount}}" role="cell">
2020

2121
<div class="ui5-table-no-data-row">
2222
<span>{{noDataText}}</span>

packages/main/src/TableCell.hbs

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<td
22
tabindex="-1"
33
part="cell"
4+
role="cell"
45
>
56
<slot></slot>
67
</td>

packages/main/src/TableColumn.hbs

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<th
22
scope="col"
33
part="column"
4+
role="columnheader"
45
>
56
<slot></slot>
67
</th>

packages/main/src/TableRow.hbs

+3-2
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
aria-label="{{ariaLabelText}}"
77
data-sap-focus-ref
88
part="row"
9+
role="row"
910
>
1011
{{#if shouldPopin}}
1112
{{#each visibleCells}}
@@ -20,8 +21,8 @@
2021

2122
{{#if shouldPopin}}
2223
{{#each popinCells}}
23-
<tr part="popin-row" class="{{this.classes}}" @click="{{../_onrowclick}}">
24-
<td colspan="{{../visibleCellsCount}}">
24+
<tr part="popin-row" role="row" class="{{this.classes}}" @click="{{../_onrowclick}}">
25+
<td colspan="{{../visibleCellsCount}}" role="cell">
2526
{{#if this.popinText}}
2627
<span class="ui5-table-row-popin-title">{{this.popinText}}:</span>
2728
{{/if}}

0 commit comments

Comments
 (0)