diff --git a/src/vs/workbench/contrib/comments/browser/commentNode.ts b/src/vs/workbench/contrib/comments/browser/commentNode.ts index 7c30e5d516fc5..4a859f036a41e 100644 --- a/src/vs/workbench/contrib/comments/browser/commentNode.ts +++ b/src/vs/workbench/contrib/comments/browser/commentNode.ts @@ -48,6 +48,7 @@ import { CommentContextKeys } from 'vs/workbench/contrib/comments/common/comment import { FileAccess } from 'vs/base/common/network'; import { COMMENTS_SECTION, ICommentsConfiguration } from 'vs/workbench/contrib/comments/common/commentsConfiguration'; import { StandardMouseEvent } from 'vs/base/browser/mouseEvent'; +import { IAccessibilityService } from 'vs/platform/accessibility/common/accessibility'; class CommentsActionRunner extends ActionRunner { protected override async runAction(action: IAction, context: any[]): Promise { @@ -109,7 +110,8 @@ export class CommentNode extends Disposable { @INotificationService private notificationService: INotificationService, @IContextMenuService private contextMenuService: IContextMenuService, @IContextKeyService contextKeyService: IContextKeyService, - @IConfigurationService private configurationService: IConfigurationService + @IConfigurationService private configurationService: IConfigurationService, + @IAccessibilityService private accessibilityService: IAccessibilityService ) { super(); @@ -156,6 +158,9 @@ export class CommentNode extends Disposable { if (pendingEdit) { this.switchToEditMode(); } + this._register(this.accessibilityService.onDidChangeScreenReaderOptimized(() => { + this.toggleToolbarHidden(true); + })); } private createScroll(container: HTMLElement, body: HTMLElement) { @@ -246,10 +251,19 @@ export class CommentNode extends Disposable { this._isPendingLabel.innerText = ''; } - this._actionsToolbarContainer = dom.append(header, dom.$('.comment-actions.hidden')); + this._actionsToolbarContainer = dom.append(header, dom.$('.comment-actions')); + this.toggleToolbarHidden(true); this.createActionsToolbar(); } + private toggleToolbarHidden(hidden: boolean) { + if (hidden && !this.accessibilityService.isScreenReaderOptimized()) { + this._actionsToolbarContainer.classList.add('hidden'); + } else { + this._actionsToolbarContainer.classList.remove('hidden'); + } + } + private getToolbarActions(menu: IMenu): { primary: IAction[]; secondary: IAction[] } { const contributedActions = menu.getActions({ shouldForwardArgs: true }); const primary: IAction[] = []; @@ -617,7 +631,7 @@ export class CommentNode extends Disposable { setFocus(focused: boolean, visible: boolean = false) { if (focused) { this._domNode.focus(); - this._actionsToolbarContainer.classList.remove('hidden'); + this.toggleToolbarHidden(false); this._actionsToolbarContainer.classList.add('tabfocused'); this._domNode.tabIndex = 0; if (this.comment.mode === languages.CommentMode.Editing) { @@ -625,7 +639,7 @@ export class CommentNode extends Disposable { } } else { if (this._actionsToolbarContainer.classList.contains('tabfocused') && !this._actionsToolbarContainer.classList.contains('mouseover')) { - this._actionsToolbarContainer.classList.add('hidden'); + this.toggleToolbarHidden(true); this._domNode.tabIndex = -1; } this._actionsToolbarContainer.classList.remove('tabfocused'); @@ -634,12 +648,12 @@ export class CommentNode extends Disposable { private registerActionBarListeners(actionsContainer: HTMLElement): void { this._register(dom.addDisposableListener(this._domNode, 'mouseenter', () => { - actionsContainer.classList.remove('hidden'); + this.toggleToolbarHidden(false); actionsContainer.classList.add('mouseover'); })); this._register(dom.addDisposableListener(this._domNode, 'mouseleave', () => { if (actionsContainer.classList.contains('mouseover') && !actionsContainer.classList.contains('tabfocused')) { - actionsContainer.classList.add('hidden'); + this.toggleToolbarHidden(true); } actionsContainer.classList.remove('mouseover'); }));