I am using material design with floating label for the input field.
There is some scenario to use placeholder text for announcing extra details to the user. For the inactive/blurred text field I can not add the placeholder (label and placeholder text will overlap each other) so I toggle placeholder text on input field focus in/out.
It's working fine in JAWS along with Chrome, announcing:
This issue is resolved by toggling
title along with
placeholder attr. now screen reader on both browsers(FF & chrome) announces
<label> + <title> and
placeholder attr is ignored. this solved accessibility issue with placeholder issue on FF browser.
aria-describedby attribute is added on input field and assigned value as id-value of same input field. so this way screen reader announces
<aria-describedby> + placeholder, and aria-describedby is pointing to label value indirectly as input tag's id-attr is pointing to label's for-attr. this works similar in chrome and FF