Fix accessibility issues around the room list and space panel (#10717)

* Fix room sublist group label being read twice in Orca

* Fix room list sublist notification badges always having a tab stop
This commit is contained in:
Michael Telatynski 2023-05-05 11:09:41 +01:00 committed by GitHub
parent c824c4a858
commit 43ffd89e58
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 24 additions and 6 deletions

View file

@ -85,6 +85,10 @@ interface IProps {
onListCollapse?: (isExpanded: boolean) => void;
}
function getLabelId(tagId: TagID): string {
return `mx_RoomSublist_label_${tagId}`;
}
// TODO: Use re-resizer's NumberSize when it is exposed as the type
interface ResizeDelta {
width: number;
@ -712,7 +716,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
title={this.props.isMinimized ? this.props.label : undefined}
>
<span className={collapseClasses} />
<span>{this.props.label}</span>
<span id={getLabelId(this.props.tagId)}>{this.props.label}</span>
</Button>
{this.renderMenu()}
{this.props.isMinimized ? null : badgeContainer}
@ -880,7 +884,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
className={classes}
role="group"
aria-hidden={hidden}
aria-label={this.props.label}
aria-labelledby={getLabelId(this.props.tagId)}
onKeyDown={this.onKeyDown}
>
{this.renderHeader()}