Skip to content

Hint text on md-input isn't announced by JAWS #2798

@bsteffl

Description

@bsteffl

Bug, feature request, or proposal:

Hint text on md-input is not being announced or read by JAWS.

What is the expected behavior?

The hint text should be read aloud or accessible to screen readers as well.

What is the current behavior?

The hintlabel text isn't read aloud by JAWS screenreader.

What are the steps to reproduce?

<md-input-container hintLabel="Help text not read by JAWS">
     <input md-input placeholder="Amount">
     <span md-prefix>$&nbsp;</span>
     <span md-suffix>.00</span>
</md-input-container>

What is the use-case or motivation for changing an existing behavior?

To meet accessibility requirements.

Which versions of Angular, Material, OS, browsers are affected?

Version: 2.0.0-beta.1

Is there anything else we should know?

Using aria-describedby on the input to point to the hint text would likely solve this problem. Unfortunately you would have to have a unique id to point to.

Potential output
<div class="md-input-wrapper">
   <div class="md-input-table">
        <div class="md-input-prefix">...</div>
        <div class="md-input-infix">
            <input class="md-input-element" md-input placeholder="Amount" placeholder="Amount" id="md-input-1" aria-describedby="uniqueID">
           <label class="md-input-placeholder md-empty md-float" for="md-input-1">Amount</label>
        </div>
        <div class="md-input-suffix">...</div>
   </div>
   <div class="md-input-underline"><span class="md-input-ripple"></span></div>
   <div class="md-hint" id="uniqueID">Help text not read by JAWS</div>
</div>

Metadata

Metadata

Assignees

Labels

AccessibilityThis issue is related to accessibility (a11y)P2The issue is important to a large percentage of users, with a workaround

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions