When looking at the below code sample with an element that contains only , inside a region, inside a document, inside an application. Then it breaks VoiceOver navigation and will exit the region.
Code sample
If testing with Outlook this code will show the issue
<div aria-label="Testing region in application" role="region" >
<h1>This text is read out</h1>
<p> </p>
<p>This text is ignored</p>
</div>
If testing directly in Safari then this code will show the issues. Here I've added role="application" and role="document" that get added by Outlook.
<div role="application">
<div role="document">
<div aria-label="Testing region in application" role="region" >
<h1>This text is read out</h1>
<p> </p>
<p>This text is ignored</p>
</div>
</div>
</div>
Email Client
Outlook webmail
Operating System
MacOS 15 Safari 18
Expected Result
When using
role="application"
in the browser it is expected that usingrole="document"
inside that will mean the content is treated as web content.Actual Result
When looking at the below code sample with an element that contains only
, inside a region, inside a document, inside an application. Then it breaks VoiceOver navigation and will exit the region.Code sample
If testing with Outlook this code will show the issue
If testing directly in Safari then this code will show the issues. Here I've added
role="application"
androle="document"
that get added by Outlook.Additional context
I've reported the bug in Safari here https://bugs.webkit.org/show_bug.cgi?id=283499