Last Updated:
03 Sep 2019 16:10
by ADMIN
Problem: Latest Telerik version of Combobox or RadCombobox reads "readonly" though it's not, when EnableAriaSupport is enabled.
Details:
url to test with JAWS - https://demos.telerik.com/aspnet-ajax/combobox/examples/wai-aria-support/defaultcs.aspx
When I use JAWS to read the combobox present on this demo it reads as follows -
ComboBox readonly - Alice Mutton. To change the selection press the arrow keys.
Over here, why JAWS is reading "readonly". It's not readonly. It's making our screenreader blind users confusing.
I drilled down more into the problem and found that, the input element below has the aria-readonly=true set though the combobox is not readonly.
Here is the html generated for above combobox from telerik demo site -
<input name="ctl00$ContentPlaceholder1$RadComboBox2" class="rcbInput radPreventDecorate" id="ctl00_ContentPlaceholder1_RadComboBox2_Input" role="combobox" aria-busy="false" aria-disabled="false" aria-expanded="false" aria-haspopup="true" aria-readonly="true" aria-owns="ctl00_ContentPlaceholder1_RadComboBox2_listbox" aria-autocomplete="none" type="text" readonly="readonly" value="Alice Mutton" autocomplete="off">
I understand that this input control should be readonly so that aria users should not type and go haywire. But looks like to maintain the readonly=readonly property, telerik is generating aria-readonly=true for this _Input control and resulting this issue.
When you change this attribute aria-readonly="true" to aria-readonly="false", JAWS read it correctly as follows -
ComboBox - Alice Mutton. To change the selection press the arrow keys.
Let me know how to achieve that so that users will not be confused.