Change:
[x] Indicate when a document has commentable ranges Aria status when a document is opened [x] Add keyboard shortcut for adding a comment [x] Provide commands to go to next and previous commentable range [x] Add an accessible help menu to the comment widget Esc dismisses widget Lists go to next/previous commentable range commands + keyboard shortcuts Lists command and keyboard shortcut to add a comment Lists keyboard shortcut to execute the comment primary action and what the primary action is [x] The Comments view should respect the enter/space = reveal+focus/reveal [x] Make the comment widget toolbar always visible when in screen reader mode
Related to
is the last part of this, and it's almost done!
Mr.KITSANAPAN MEEKEAW

Discussion:
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'; <ins> import { IAccessibilityService } from 'vs/platform/accessibility/common/accessibility'; </ins> class CommentsActionRunner extends ActionRunner { protected override async runAction(action: IAction, context: any[]): Promise<void> {

@INotificationService private notificationService: INotificationService, @IContextMenuService private contextMenuService: IContextMenuService, @IContextKeyService contextKeyService: IContextKeyService, <del> @IConfigurationService private configurationService: IConfigurationService </del> <ins> @IConfigurationService private configurationService: IConfigurationService, @IAccessibilityService private accessibilityService: IAccessibilityService </ins> ) { super();

if (pendingEdit) { this.switchToEditMode(); } <ins> this._register(this.accessibilityService.onDidChangeScreenReaderOptimized(() => { this.toggleToolbarHidden(true); })); </ins> } private createScroll(container: HTMLElement, body: HTMLElement) {

this._isPendingLabel.innerText = ''; } <del> this._actionsToolbarContainer = dom.append(header, dom.$('.comment-actions.hidden')); </del> <ins> this._actionsToolbarContainer = dom.append(header, dom.$('.comment-actions')); this.toggleToolbarHidden(true); </ins> this.createActionsToolbar(); } <ins> private toggleToolbarHidden(hidden: boolean) { if (hidden && !this.accessibilityService.isScreenReaderOptimized()) { this._actionsToolbarContainer.classList.add('hidden'); } else { this._actionsToolbarContainer.classList.remove('hidden'); } } </ins> private getToolbarActions(menu: IMenu): { primary: IAction[]; secondary: IAction[] } { const contributedActions = menu.getActions({ shouldForwardArgs: true }); const primary: IAction[] = [];

setFocus(focused: boolean, visible: boolean = false) { if (focused) { this._domNode.focus(); <del> this._actionsToolbarContainer.classList.remove('hidden'); </del> <ins> this.toggleToolbarHidden(false); </ins> this._actionsToolbarContainer.classList.add('tabfocused'); this._domNode.tabIndex = 0; if (this.comment.mode === languages.CommentMode.Editing) {

} } else { if (this._actionsToolbarContainer.classList.contains('tabfocused') && !this._actionsToolbarContainer.classList.contains('mouseover')) { <del> this._actionsToolbarContainer.classList.add('hidden'); </del> <ins> this.toggleToolbarHidden(true); </ins> this._domNode.tabIndex = -1; } this._actionsToolbarContainer.classList.remove('tabfocused');

private registerActionBarListeners(actionsContainer: HTMLElement): void { this._register(dom.addDisposableListener(this._domNode, 'mouseenter', () => { <del> actionsContainer.classList.remove('hidden'); </del> <ins> this.toggleToolbarHidden(false); </ins> actionsContainer.classList.add('mouseover'); })); this._register(dom.addDisposableListener(this._domNode, 'mouseleave', () => { if (actionsContainer.classList.contains('mouseover') && !actionsContainer.classList.contains('tabfocused')) { <del> actionsContainer.classList.add('hidden'); </del> <ins> this.toggleToolbarHidden(true); </ins> } actionsContainer.classList.remove('mouseover'); }));