Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,7 @@
<ContentPresenter x:Name="HeaderContentPresenter" x:DeferLoadStrategy="Lazy" Visibility="Collapsed" Grid.Row="0" Foreground="{ThemeResource TextControlHeaderForeground}" Margin="{ThemeResource AutoSuggestBoxTopHeaderMargin}" Grid.ColumnSpan="4" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" FontWeight="Normal" TextWrapping="Wrap" />
<ScrollViewer x:Name="ContentElement" Foreground="{TemplateBinding Foreground}" Grid.Row="1" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" IsTabStop="False" AutomationProperties.AccessibilityView="Raw" ZoomMode="Disabled" />
<ContentControl x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Foreground="{ThemeResource TextControlPlaceholderForeground}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" IsTabStop="False" Grid.ColumnSpan="2" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Content="{TemplateBinding PlaceholderText}" IsHitTestVisible="False" />
<Button x:Name="DeleteButton" Grid.Row="1" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Grid.Column="1" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="32" AutomationProperties.AccessibilityView="Raw" VerticalAlignment="Stretch" />
<Button x:Name="DeleteButton" Grid.Row="1" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Grid.Column="1" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="32" VerticalAlignment="Stretch" />

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

This is making different behavior for DeleteButton & QueryButton, I think the guidance for delete operation is to use 'delete' in keyboard only. Please check with accessibility team for the right experience before going ahead

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

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

Godly T.Alias (@godlytalias) Voice Access has no keyboard, so the "clear via Delete key" path doesn't serve Voice Access users at all — which is the exact gap #7996 reports. Voice Access acts on elements by name ("Click Delete") or "Show numbers" overlay, and both require the element to be in the UIA tree .Confirmed with accessibility team.
On DeleteButton vs QueryButton: scoped intentionally to #7996; if we want consistency I'll create a new issue for querybutton and address.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

I see that Voice access supports commands to delete text, https://support.microsoft.com/en-us/accessibility/windows/voice-access/voice-access-command-list#edit-text

Moreover the main concern here is that the QueryButton is having the same flags set and this change will make the behavior different for both the buttons

<Button x:Name="QueryButton" Grid.Row="1" Grid.Column="2" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource QueryButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Margin="2,0,0,0" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" FontSize="{TemplateBinding FontSize}" Width="32" Height="28" VerticalAlignment="Stretch" AutomationProperties.AccessibilityView="Raw" />
<ContentPresenter x:Name="DescriptionPresenter" Grid.Row="2" Grid.ColumnSpan="4" Content="{TemplateBinding Description}" x:Load="False" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" AutomationProperties.AccessibilityView="Raw" />
</Grid>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@
<ContentPresenter x:Name="HeaderContentPresenter" x:DeferLoadStrategy="Lazy" Visibility="Collapsed" Grid.Row="0" Foreground="{ThemeResource TextControlHeaderForeground}" Margin="{ThemeResource AutoSuggestBoxTopHeaderMargin}" Grid.ColumnSpan="4" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" FontWeight="Normal" TextWrapping="Wrap" />
<ScrollViewer x:Name="ContentElement" Foreground="{TemplateBinding Foreground}" Grid.Row="1" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" IsTabStop="False" AutomationProperties.AccessibilityView="Raw" ZoomMode="Disabled" />
<ContentControl x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Foreground="{ThemeResource TextControlPlaceholderForeground}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" IsTabStop="False" Grid.ColumnSpan="2" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Content="{TemplateBinding PlaceholderText}" IsHitTestVisible="False" />
<Button x:Name="DeleteButton" Grid.Row="1" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Grid.Column="1" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="32" AutomationProperties.AccessibilityView="Raw" VerticalAlignment="Stretch" />
<Button x:Name="DeleteButton" Grid.Row="1" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Grid.Column="1" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="32" VerticalAlignment="Stretch" />
<Button x:Name="QueryButton" Grid.Row="1" Grid.Column="2" CornerRadius="{TemplateBinding CornerRadius}" Style="{StaticResource QueryButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" Margin="2,0,0,0" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" FontSize="{TemplateBinding FontSize}" Width="32" Height="28" VerticalAlignment="Stretch" AutomationProperties.AccessibilityView="Raw" />
<ContentPresenter x:Name="DescriptionPresenter" Grid.Row="2" Grid.ColumnSpan="4" Content="{TemplateBinding Description}" x:Load="False" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" AutomationProperties.AccessibilityView="Raw" />
</Grid>
Expand Down
34 changes: 34 additions & 0 deletions controls/dev/CommonStyles/InteractionTests/CommonStylesTests.cs
Original file line number Diff line number Diff line change
Expand Up @@ -278,6 +278,40 @@ public void HyperlinkIsOffscreenTest()
}
}

[TestMethod]
[TestProperty("Description", "Verifies the TextBox inline clear (Delete) button is exposed to UIA so Voice Access can target it.")]
public void TextBoxClearButtonIsAccessibleTest()
{
using (var setup = new TestSetupHelper("TextControls Tests"))
{
Edit textBox = new Edit(FindElement.ByName("ClearButtonTextBox"));
Verify.IsNotNull(textBox, "The test TextBox should be found.");

// The clear (Delete) button is only shown while the TextBox is focused and non-empty.

Choose a reason for hiding this comment

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

If the Delete button isn't an immediate child of the Edit's peer, this test silently fails. Suggestion: use the same  FindButton(textBox, "Delete")  /  FindElement.ByName  helper for consistency and robustness.

Log.Comment("Focus the TextBox so the clear (Delete) button becomes visible.");
textBox.SetFocus();
Wait.ForIdle();

// The clear button (named "Delete") must be exposed to UIA (and therefore to Voice
// Access) rather than hidden with AccessibilityView=Raw. Verify it can be found as a
// child of the TextBox.
Button deleteButton = null;
foreach (UIObject elem in textBox.Children)
{
if (elem.Name.Equals("Delete"))
{
deleteButton = new Button(elem);
break;
}
}
Verify.IsNotNull(deleteButton, "The clear button should be exposed as a UIA element.");

Log.Comment("Invoke the clear button and verify that the text is cleared.");
deleteButton.InvokeAndWait();
Verify.AreEqual(string.Empty, textBox.GetText());
}
}

[TestMethod]
[TestProperty("Description", "Scrolls a vertical grouped GridView with Mandatory snap points and with the mouse-wheel.")]
public void ScrollGroupedGridViewWithMandatorySnapPointsTest()
Expand Down
2 changes: 1 addition & 1 deletion controls/dev/CommonStyles/TestUI/TextControlsPage.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
<StackPanel Orientation="Vertical" Spacing="12" Margin="0,0,12,0">
<TextBlock Text="TextBox"/>

<TextBox Header="Normal" Text="Text" IsEnabled="{x:Bind EnabledCheckBox.IsChecked.Value, Mode=OneWay}" Foreground="{ThemeResource SystemAccentColor}"/>
<TextBox x:Name="ClearButtonTextBox" AutomationProperties.Name="ClearButtonTextBox" Header="Normal" Text="Text" IsEnabled="{x:Bind EnabledCheckBox.IsChecked.Value, Mode=OneWay}" Foreground="{ThemeResource SystemAccentColor}"/>
<RichEditBox Header="Normal" Foreground="{ThemeResource SystemAccentColor}"/>
<TextBox PlaceholderText="Placeholder" Header="Placeholder" IsEnabled="{x:Bind EnabledCheckBox.IsChecked.Value, Mode=OneWay}" />
</StackPanel>
Expand Down
2 changes: 1 addition & 1 deletion controls/dev/CommonStyles/TextBox_themeresources.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -336,7 +336,7 @@
<Border x:Name="BorderElement" Grid.Row="1" Grid.Column="0" Grid.RowSpan="1" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Control.IsTemplateFocusTarget="True" MinWidth="{TemplateBinding MinWidth}" MinHeight="{TemplateBinding MinHeight}" />
<ScrollViewer x:Name="ContentElement" Grid.Row="1" Grid.Column="0" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Foreground="{TemplateBinding Foreground}" IsTabStop="False" AutomationProperties.AccessibilityView="Raw" ZoomMode="Disabled" />
<TextBlock x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Foreground="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForeground}}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Text="{TemplateBinding PlaceholderText}" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" IsHitTestVisible="False" />
<Button x:Name="DeleteButton" Grid.Row="1" Grid.Column="1" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Visibility="Collapsed" AutomationProperties.AccessibilityView="Raw" FontSize="{TemplateBinding FontSize}" Width="30" VerticalAlignment="Stretch" />
<Button x:Name="DeleteButton" Grid.Row="1" Grid.Column="1" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="30" VerticalAlignment="Stretch" />
<ContentPresenter x:Name="DescriptionPresenter" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Content="{TemplateBinding Description}" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" AutomationProperties.AccessibilityView="Raw" x:Load="False" />
</Grid>
</ControlTemplate>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -290,7 +290,7 @@
<Border x:Name="BorderElement" Grid.Row="1" Grid.Column="0" Grid.RowSpan="1" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Control.IsTemplateFocusTarget="True" MinWidth="{TemplateBinding MinWidth}" MinHeight="{TemplateBinding MinHeight}" />
<ScrollViewer x:Name="ContentElement" Grid.Row="1" Grid.Column="0" HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Foreground="{TemplateBinding Foreground}" IsTabStop="False" AutomationProperties.AccessibilityView="Raw" ZoomMode="Disabled" />
<TextBlock x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Foreground="{Binding PlaceholderForeground, RelativeSource={RelativeSource TemplatedParent}, TargetNullValue={ThemeResource TextControlPlaceholderForeground}}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" Text="{TemplateBinding PlaceholderText}" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" IsHitTestVisible="False" />
<Button x:Name="DeleteButton" Grid.Row="1" Grid.Column="1" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Visibility="Collapsed" AutomationProperties.AccessibilityView="Raw" FontSize="{TemplateBinding FontSize}" Width="30" VerticalAlignment="Stretch" />
<Button x:Name="DeleteButton" Grid.Row="1" Grid.Column="1" Style="{StaticResource DeleteButtonStyle}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Padding="{ThemeResource HelperButtonThemePadding}" IsTabStop="False" Visibility="Collapsed" FontSize="{TemplateBinding FontSize}" Width="30" VerticalAlignment="Stretch" />
<ContentPresenter x:Name="DescriptionPresenter" Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Content="{TemplateBinding Description}" Foreground="{ThemeResource SystemControlDescriptionTextForegroundBrush}" AutomationProperties.AccessibilityView="Raw" x:Load="False" />
</Grid>
</ControlTemplate>
Expand Down
38 changes: 38 additions & 0 deletions controls/dev/NumberBox/InteractionTests/NumberBoxTests.cs
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,44 @@ public void UpDownTest()
}


[TestMethod]
public void VerifyClearButtonIsAccessible()
{
using (var setup = new TestSetupHelper("NumberBox Tests"))
{
RangeValueSpinner numBox = FindElement.ByName<RangeValueSpinner>("TestNumberBox");

ComboBox spinModeComboBox = FindElement.ByName<ComboBox>("SpinModeComboBox");
spinModeComboBox.SelectItemByName("Inline");
Wait.ForIdle();

Log.Comment("Enter a value so that the clear (delete) button becomes visible.");
EnterText(numBox, "42");
Wait.ForIdle();

// The clear button (named "Delete") must be exposed to UIA (and therefore to Voice
// Access) rather than hidden with AccessibilityView=Raw. The DeleteButton is authored
// inside the inner TextBox's template, so its UIA peer is a child of the TextBox peer
// (a grandchild of the NumberBox), not a direct child of the NumberBox. Search the
// inner TextBox for it, separately from the Increase/Decrease spin buttons which are
// direct NumberBox children.
Edit edit = FindTextBox(numBox);
Verify.IsNotNull(edit, "The inner TextBox should be found.");

Button deleteButton = FindButton(edit, "Delete");
Verify.IsNotNull(deleteButton, "The clear button should be exposed as a UIA element.");

Button upButton = FindButton(numBox, "Increase");
Button downButton = FindButton(numBox, "Decrease");
Verify.IsNotNull(upButton, "The Increase spin button should be exposed.");
Verify.IsNotNull(downButton, "The Decrease spin button should be exposed.");

Log.Comment("Invoke the clear button and verify that the text is cleared.");
deleteButton.InvokeAndWait();
Verify.AreEqual(string.Empty, edit.GetText());
}
}

[TestMethod]
public void UpDownEnabledTest()
{
Expand Down
Loading
Loading