Unlike desktop screenreaders, the Ipad version of VoiceOver appears to deal with a focus change to an element by grabbing the first textnode child that it sees and reading that only. In desktop readers they instead loop through the child elements, reading them off in hierarchical order.
Consider the following when the parent <div> gains focus:
<div tabindex="0">
<p>All screenreaders will read me out</p>
<p>All screenreaders EXCEPT VoiceOver on Ipad will then read me out</p>
</div>
This is true for any element that gains focus (e.g. an <a>) regardless of if focus somehow ends up there via a tap action or if it's moved there manually via Javascript.
To clarify, I've tried various methods to "force" the reading to no effect, including: giving IDs to the <p> elements and specifying aria-labelledby with those IDs, applying various role attributes (group, alert etc) and any valid variation of the tabindex number.
Is there any way to mimic behaviour seen in other screenreaders and get it reading these child elements?
