Search code examples
htmlaccessibilitywai-ariatalkback

<legend> not read by talkback/voiceover when focused on an item


I'm trying to figure out how to make talkback/voice-over announce legend when the focus is on an input element. Jaws read the legend. Only issue is with talkback/voice-over. I'm aware that when focus is shifted, the screen reader reads the element which under focus. If that is the case, then not sure how Jaws is picking up on Desktop. I tried aria-labelledby but I'll have to add in many places and also it considers the area as region which is not intended.

setTimeout(() => document.getElementById('f1').focus(), 3000);
<!doctype html>
<html lang="en-US">
  <body>
    <form name="form1">
      <fieldset class="address" name="billto">
        <legend>Billing Address</legend>
        <section>
            <label for="f1">Street</label>
            <input id="f1" name="street">
            <br>
            <label for="f2">City</label>
            <input id="f2" name="city">
            <br>
            <label for="f3">State</label>
            <input id="f3" name="state">
            <br>
            <label for="f4">Zip code</label>
            <input id="f4" name="zipcode">
            <br>          
        </section>
      </fieldset>
    </form>
  </body>
</html>


Solution

  • If your code is semantically correct, then you shouldn't have to do anything. Let the individual screen readers handle it as they see fit. In your simple code example, with VoiceOver on iOS (I don't have a Mac to try it on), when I swipe right, my VO focus goes to the "Billing Address" border and it's announced as "Billing Address, Form start". I won't hear the <legend> if I swipe to any of the input fields.

    With NVDA, if I arrow down through the DOM, similar to swiping right with VoiceOver, I hear "grouping, Billing Address". If I tab to the input field instead of arrowing down, thus skipping the <legend> text, the text is still announced before the first field is announced, "Billing Address, grouping, Street edit has auto complete blank".

    So it seems to be working correctly. If talkback doesn't announce it correctly, then it's a bug with talkback.