Skip to content

Commit

Permalink
Set aria label and include split number/total
Browse files Browse the repository at this point in the history
Fixes #122332
  • Loading branch information
Tyriar committed Apr 27, 2021
1 parent 40983b6 commit f1c66b6
Showing 1 changed file with 24 additions and 1 deletion.
25 changes: 24 additions & 1 deletion src/vs/workbench/contrib/terminal/browser/terminalTabsWidget.ts
Original file line number Diff line number Diff line change
Expand Up @@ -228,16 +228,34 @@ class TerminalTabsRenderer implements ITreeRenderer<ITerminalInstance, never, IT
const hasText = !this.shouldHideText();
template.element.classList.toggle('has-text', hasText);

let ariaLabel: string = '';
let prefix: string = '';
if (tab.terminalInstances.length > 1) {
const terminalIndex = tab?.terminalInstances.indexOf(instance);
const terminalIndex = tab.terminalInstances.indexOf(instance);
ariaLabel = localize({
key: 'splitTerminalAriaLabel',
comment: [
`The terminal's ID`,
`The terminal's title`,
`The terminal's split number`,
`The terminal group's total split number`
]
}, "Terminal {0} {1}, split {2} of {3}", instance.instanceId, instance.title, terminalIndex + 1, tab.terminalInstances.length);
if (terminalIndex === 0) {
prefix = `┌ `;
} else if (terminalIndex === tab!.terminalInstances.length - 1) {
prefix = `└ `;
} else {
prefix = `├ `;
}
} else {
ariaLabel = localize({
key: 'terminalAriaLabel',
comment: [
`The terminal's ID`,
`The terminal's title`
]
}, "Terminal {0} {1}", instance.instanceId, instance.title);
}

let title = instance.title;
Expand All @@ -256,6 +274,7 @@ class TerminalTabsRenderer implements ITreeRenderer<ITerminalInstance, never, IT
const primaryStatus = instance.statusList.primary;
if (primaryStatus && primaryStatus.severity >= Severity.Warning) {
label = `${prefix}$(${primaryStatus.icon?.id || instance.icon?.id})`;
ariaLabel = '';
} else {
label = `${prefix}$(${instance.icon?.id})`;
}
Expand All @@ -279,6 +298,10 @@ class TerminalTabsRenderer implements ITreeRenderer<ITerminalInstance, never, IT
instance.dispose();
}
}));

// Set aria lable to expose split information to screen reader
template.label.element.querySelector('.label-name')?.setAttribute('aria-label', ariaLabel);

template.label.setResource({
resource: instance.resource,
name: label,
Expand Down

0 comments on commit f1c66b6

Please sign in to comment.