Skip to content

Fix Counter Control accessibility: Enable Narrator announcements for value changes#1983

Merged
niels9001 merged 5 commits intomainfrom
copilot/fix-1965
Jul 30, 2025
Merged

Fix Counter Control accessibility: Enable Narrator announcements for value changes#1983
niels9001 merged 5 commits intomainfrom
copilot/fix-1965

Conversation

Copy link
Contributor

Copilot AI commented Jul 30, 2025

The Counter Control in the Custom & User Controls section was not announcing value changes to screen readers when users activated the "Increase" and "Decrease" buttons. While the counter value updated visually, Narrator remained silent, creating an accessibility barrier for users relying on assistive technology.

Root Cause

The CounterControl only updated the TextBlock.Text property without implementing proper accessibility patterns to notify screen readers of dynamic content changes.

Solution

Added comprehensive WinUI accessibility support to enable live region announcements:

XAML Template Changes

<TextBlock x:Name="CountText"
           FontSize="20"
           Text="0"
           HorizontalAlignment="Center"
           AutomationProperties.LiveSetting="Polite"
           AutomationProperties.Name="Counter value" />

The key addition is AutomationProperties.LiveSetting="Polite" which marks the TextBlock as a "live region" that screen readers monitor for content changes.

Code-Behind Implementation

Added proper automation peer handling to trigger screen reader announcements:

// Update automation name with context
var modeName = Mode == CounterMode.Increment ? "Increment" : "Decrement";
AutomationProperties.SetName(CountText, $"{modeName} counter value {Count}");

// Raise LiveRegionChanged event to notify screen readers
var peer = FrameworkElementAutomationPeer.FromElement(CountText) ?? 
           FrameworkElementAutomationPeer.CreatePeerForElement(CountText);
peer?.RaiseAutomationEvent(AutomationEvents.LiveRegionChanged);

Enhanced Automation Names

  • Counter display: Now announces "Increment counter value 5" instead of just "5"
  • Action buttons: Now labeled as "Increase counter" and "Decrease counter" for clearer context

Expected User Experience

  • Before: User clicks button → counter changes visually → Narrator silent → no feedback
  • After: User clicks "Increase counter" → counter changes → Narrator announces "Increment counter value 1" → clear accessibility feedback

This implementation follows Microsoft Accessibility Guidelines and uses standard WinUI accessibility patterns to ensure the Counter Control is fully accessible to screen reader users.

Fixes #1965.


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Co-authored-by: niels9001 <9866362+niels9001@users.noreply.github.com>
Copilot AI changed the title [WIP] [WinUI 3 Gallery: Fundamentals-> Custom &user controls]: While invoking 'Increase' and 'Decrease' button, number will be increasing but narrator doesn’t announce about the number. Fix Counter Control accessibility: Enable Narrator announcements for value changes Jul 30, 2025
Copilot AI requested a review from niels9001 July 30, 2025 13:10
Copy link
Collaborator

@niels9001 niels9001 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This does not work. You might be missing

var peer = FrameworkElementAutomationPeer.FromElement(targetTextBlock) ?? FrameworkElementAutomationPeer.CreatePeerForElement(targetTextBlock);
peer?.RaiseAutomationEvent(AutomationEvents.LiveRegionChanged);

Also don't update the tests, so just remove it.

Co-authored-by: niels9001 <9866362+niels9001@users.noreply.github.com>
Copy link
Contributor Author

Copilot AI commented Jul 30, 2025

This does not work. You might be missing

var peer = FrameworkElementAutomationPeer.FromElement(targetTextBlock) ?? FrameworkElementAutomationPeer.CreatePeerForElement(targetTextBlock);...

Added the missing automation peer code to raise LiveRegionChanged events and removed the unit tests as requested. The implementation now includes:

var peer = FrameworkElementAutomationPeer.FromElement(CountText) ?? FrameworkElementAutomationPeer.CreatePeerForElement(CountText);
peer?.RaiseAutomationEvent(AutomationEvents.LiveRegionChanged);

This ensures screen readers are properly notified when the counter value changes. Commit: 7ae6e33

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

  • e7bvsblobprodcus348.vsblob.vsassets.io
    • Triggering command: dotnet build WinUIGallery.sln --configuration Release (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

Copilot AI requested a review from niels9001 July 30, 2025 13:30
Copy link
Collaborator

@niels9001 niels9001 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested, works!

@niels9001 niels9001 marked this pull request as ready for review July 30, 2025 13:39
@niels9001 niels9001 requested a review from marcelwgn July 30, 2025 13:40
@niels9001 niels9001 enabled auto-merge (squash) July 30, 2025 13:49
@marcelwgn
Copy link
Contributor

/azp run

@niels9001 niels9001 merged commit ee42162 into main Jul 30, 2025
2 checks passed
@niels9001 niels9001 deleted the copilot/fix-1965 branch July 30, 2025 18:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

3 participants