Skip to content

[iOS] Accessibility of Border control breaks when Shadow is applied #26990

Open
@MichaelLHerman

Description

@MichaelLHerman

Description

I have some fake buttons - a Templated ContentView that contains a Border with aTapGestureRecognizer. I am using an analytics framework that hooks into all GestureRecognizers (using method swizzling) and uses elements' accessibility identifiers to log what button was tapped.

<ContentView.ControlTemplate>
        <ControlTemplate>
            <Border AutomationId="{Binding AutomationId, Source={RelativeSource TemplatedParent}, StringFormat='HomePageTile_{0}'}" AutomationProperties.IsInAccessibleTree="True">
                <Border.GestureRecognizers>
                    <TapGestureRecognizer Command="{TemplateBinding TapCommand}" />
                </Border.GestureRecognizers>
                <Border.Shadow>
                    <Shadow Brush="Black"
                            Offset="0,3"
                            Radius="2"
                            Opacity="0.2" />
                </Border.Shadow>
                <Label Text="{TemplateBinding LabelText}" />
            </Border>
        </ControlTemplate>
</ContentView.ControlTemplate>

If I don't have a Shadow present, I can see in Accessibility Inspector that the element has a button trait (from the TapGestureRecognizer) and I can see its Identifier. With the Shadow present, the gesture recognizer is applied to the Microsoft_Maui_Platform_WrapperView while the automation id / isAccessibilityElement is applied to its child Microsoft_Maui_Platform_ContentView so it breaks both accessibility (the inner, accessible element does not have the Button trait) and my analytics (tap gesture recognizer element has no accessibility identifier).

Image Image

Steps to Reproduce

  1. Create New Maui app
  2. Add Border with Shadow to MainPage
            <Border AutomationId="SaveButton" AutomationProperties.IsInAccessibleTree="True">
                <Border.GestureRecognizers>
                    <TapGestureRecognizer />
                </Border.GestureRecognizers>
                <Border.Shadow>
                    <Shadow Brush="Black"
                            Offset="0,3"
                            Radius="2"
                            Opacity="0.2" />
                </Border.Shadow>
                <Label Text="Save" />
            </Border>
  1. Run as iOS app in Simulator
  2. Open Accessibility Inspector and target the border, note the Button trait is missing
  3. Comment out Border.Shadow and re-run
  4. Open Accessibility Inspector and target border, note the Button trait is present

Link to public reproduction project repository

No response

Version with bug

9.0.21 SR2.1

Is this a regression from previous behavior?

Not sure, did not test other versions

Last version that worked well

Unknown/Other

Affected platforms

I was not able test on other platforms

Affected platform versions

iOS 17

Did you find any workaround?

Put TapGestureRecognizer on controls higher in visual tree

Relevant log output

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions