mirror of
https://github.com/microsoft/vscode.git
synced 2026-04-02 08:15:56 +01:00
Improve accessibility labels and CSS styling for agent session sections (#305604)
* Improve accessibility labels for agent session sections and enhance CSS styling for section labels * Enhance accessibility tests for agent session sections by updating aria label checks for singular and plural session counts Co-authored-by: Copilot <copilot@github.com> --------- Co-authored-by: mrleemurray <mrleemurray@users.noreply.github.com> Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
@@ -900,7 +900,11 @@ export class AgentSessionsAccessibilityProvider implements IListAccessibilityPro
|
||||
|
||||
getAriaLabel(element: AgentSessionListItem): string | null {
|
||||
if (isAgentSessionSection(element)) {
|
||||
return localize('agentSessionSectionAriaLabel', "{0} sessions section, {1} sessions", element.label, element.sessions.length);
|
||||
const count = element.sessions.length;
|
||||
if (count === 1) {
|
||||
return localize('agentSessionSectionAriaLabel.singular', "{0} sessions section, {1} session", element.label, count);
|
||||
}
|
||||
return localize('agentSessionSectionAriaLabel.plural', "{0} sessions section, {1} sessions", element.label, count);
|
||||
}
|
||||
|
||||
if (isAgentSessionShowMore(element)) {
|
||||
|
||||
@@ -374,6 +374,10 @@
|
||||
|
||||
.agent-session-section-label {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.agent-session-section-count {
|
||||
@@ -395,8 +399,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.monaco-list-row:hover .agent-session-section .agent-session-section-count,
|
||||
.monaco-list-row.focused:not(.selected) .agent-session-section .agent-session-section-count {
|
||||
.monaco-list-row:hover .agent-session-section .agent-session-section-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -47,11 +47,11 @@ suite('AgentSessionsAccessibilityProvider', () => {
|
||||
};
|
||||
}
|
||||
|
||||
function createMockSection(section: AgentSessionSection = AgentSessionSection.Today): IAgentSessionSection {
|
||||
function createMockSection(section: AgentSessionSection = AgentSessionSection.Today, sessions: IAgentSession[] = []): IAgentSessionSection {
|
||||
return {
|
||||
section,
|
||||
label: 'Today',
|
||||
sessions: []
|
||||
sessions
|
||||
};
|
||||
}
|
||||
|
||||
@@ -91,11 +91,22 @@ suite('AgentSessionsAccessibilityProvider', () => {
|
||||
assert.ok(ariaLabel.includes('Agent'), 'Aria label should include the provider label');
|
||||
});
|
||||
|
||||
test('getAriaLabel returns correct label for section', () => {
|
||||
const section = createMockSection();
|
||||
test('getAriaLabel returns singular label for section with 1 session', () => {
|
||||
const section = createMockSection(AgentSessionSection.Today, [createMockSession({ id: 'a' })]);
|
||||
const ariaLabel = accessibilityProvider.getAriaLabel(section);
|
||||
|
||||
assert.ok(ariaLabel);
|
||||
assert.ok(ariaLabel.includes('sessions section'), 'Aria label should indicate it is a section');
|
||||
assert.ok(ariaLabel.includes('1 session'), 'Aria label should include session count');
|
||||
assert.ok(!ariaLabel.includes('1 sessions'), 'Aria label should use singular form');
|
||||
});
|
||||
|
||||
test('getAriaLabel returns plural label for section with multiple sessions', () => {
|
||||
const section = createMockSection(AgentSessionSection.Today, [createMockSession({ id: 'a' }), createMockSession({ id: 'b' })]);
|
||||
const ariaLabel = accessibilityProvider.getAriaLabel(section);
|
||||
|
||||
assert.ok(ariaLabel);
|
||||
assert.ok(ariaLabel.includes('sessions section'), 'Aria label should indicate it is a section');
|
||||
assert.ok(ariaLabel.includes('2 sessions'), 'Aria label should include session count with plural form');
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user