jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-05-01 16:57:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

FIx accessibility of data tables (#8611)

Browse Source 
According to #6487
This commit is contained in:
Bram Kragten 2021-03-14 14:54:46 +01:00 committed by GitHub
parent 68a058e4f1
commit f84a8eccfa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/data-table/ha-data-table.ts
View File

@ -236,20 +236,19 @@ export class HaDataTable extends LitElement {
"auto-height": this.autoHeight, "auto-height": this.autoHeight,
})}" })}"
role="table" role="table"
aria-rowcount=${this._filteredData.length} aria-rowcount=${this._filteredData.length + 1}
style=${styleMap({ style=${styleMap({
height: this.autoHeight height: this.autoHeight
? `${(this._filteredData.length || 1) * 53 + 57}px` ? `${(this._filteredData.length || 1) * 53 + 57}px`
: `calc(100% - ${this._headerHeight}px)`, : `calc(100% - ${this._headerHeight}px)`,
})} })}
> >
<div class="mdc-data-table__header-row" role="row"> <div class="mdc-data-table__header-row" role="row" aria-rowindex="1">
${this.selectable ${this.selectable
? html` ? html`
<div <div
class="mdc-data-table__header-cell mdc-data-table__header-cell--checkbox" class="mdc-data-table__header-cell mdc-data-table__header-cell--checkbox"
role="columnheader" role="columnheader"
scope="col"
> >
<ha-checkbox <ha-checkbox
class="mdc-data-table__row-checkbox" class="mdc-data-table__row-checkbox"
@ -292,7 +291,13 @@ export class HaDataTable extends LitElement {
}) })
: ""} : ""}
role="columnheader" role="columnheader"
scope="col" aria-sort=${ifDefined(
sorted
? this._sortDirection === "desc"
? "descending"
: "ascending"
: undefined
)}
@click=${this._handleHeaderClick} @click=${this._handleHeaderClick}
.columnId=${key} .columnId=${key}
> >
@ -338,7 +343,7 @@ export class HaDataTable extends LitElement {
} }
return html` return html`
<div <div
aria-rowindex=${index} aria-rowindex=${index! + 2}
role="row" role="row"
.rowId=${row[this.id]} .rowId=${row[this.id]}
@click=${this._handleRowClick} @click=${this._handleRowClick}