Skip to content

Commit

Permalink
fix(ui5-table-row): announce entire row and columns (#2164)
Browse files Browse the repository at this point in the history
Upon accessing the row, all cells and the respective columns they are within, should be announced in the following order: column - cell, column - cell, etc.

FIXES: #2160
  • Loading branch information
ilhan007 committed Oct 17, 2020
1 parent 2b62b83 commit e87cf3d
Show file tree
Hide file tree
Showing 4 changed files with 37 additions and 0 deletions.
1 change: 1 addition & 0 deletions packages/main/src/Table.js
Original file line number Diff line number Diff line change
Expand Up @@ -296,6 +296,7 @@ class Table extends UI5Element {
index,
minWidth: column.minWidth,
demandPopin: column.demandPopin,
text: column.textContent,
popinText: column.popinText,
visible: !this._hiddenColumns[index],
};
Expand Down
1 change: 1 addition & 0 deletions packages/main/src/TableRow.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
tabindex="{{_tabIndex}}"
@focusin="{{_onfocusin}}"
@click="{{_onrowclick}}"
aria-label="{{ariaLabelText}}"
data-sap-focus-ref
part="row"
>
Expand Down
26 changes: 26 additions & 0 deletions packages/main/src/TableRow.js
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,32 @@ class TableRow extends UI5Element {
get visibleCellsCount() {
return this.visibleCells.length;
}

get ariaLabelText() {
return this.cells.map((cell, index) => {
const columText = this.getColumnTextByIdx(index);
const cellText = this.getCellText(cell);
return `${columText} ${cellText}`;
}).join(" ");
}

getCellText(cell) {
return this.getNormilzedTextContent(cell.textContent);
}

getColumnTextByIdx(index) {
const columnInfo = this._columnsInfo[index];

if (!columnInfo) {
return "";
}

return this.getNormilzedTextContent(columnInfo.text);
}

getNormilzedTextContent(textContent) {
return textContent.replace(/[\n\r\t]/g, "").trim();
}
}

TableRow.define();
Expand Down
9 changes: 9 additions & 0 deletions packages/main/test/specs/Table.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -56,4 +56,13 @@ describe("Table general interaction", () => {
cellInRow2.click();
assert.ok(lbl.getHTML().indexOf(row2Data), "Event rowClick fired and intercepted.");
});

it("tests row aria-label value", () => {
const row = browser.$("#roll-0").shadow$(".ui5-table-row-root");

const EXPECTED_TEXT = "Product Notebook Basic 15HT-1000 Supplier Very Best Screens Dimensions 30 x 18 x 3 cm Weight 4.2 KG Price 956 EUR";

assert.strictEqual(row.getAttribute("aria-label"), EXPECTED_TEXT,
"The aria-label value is correct.");
});
});

0 comments on commit e87cf3d

Please sign in to comment.