WebAIM - Web Accessibility In Mind

E-mail List Archives

Computing a textbox's accessible name when its label is hidden using display:none

for

From: Steve Green
Date: Sep 2, 2022 4:36PM

I have a textbox that has a correctly associated text label, but the label is hidden using "display:none". The textbox also has placeholder text. I am trying to compute the accessible name to understand why Chrome developer tools say the textbox does not have an accessible name, but Axe, SortSite and ARC Toolkit do not report an error.

I have built a minimal test page at http://tpl1.com/sg/form-label.htm. Can anyone confirm my view that Chrome is probably getting it wrong? I find it difficult to believe that three different tool vendors would all make the same mistake.

I am using the Accessible Name Computation at https://w3c.github.io/html-aam/#input-type-text-input-type-password-input-type-number-input-type-search-input-type-tel-input-type-email-input-type-url-and-textarea-element-accessible-name-computation

Step 2 of the computation says "Otherwise use the associated label element's accessible name", and I believe that this is where the problem lies. Chrome developer tools show the label element's accessible name as being null rather than non-existent. The null value overrides the placeholder value, so Chrome reports that the accessible name is null.

I can't see what the tools are doing, but I suspect that they do not consider there to be a label element at all, because of the "display:none". Therefore they are using the placeholder text in their computation, so they do not report a fault.

Regards,
Steve Green
Managing Director
Test Partners Ltd
020 3002 4176 (direct)
0800 612 2780 (switchboard)
07957 246 276 (mobile)
020 7692 5517 (fax)
Skype: testpartners
<EMAIL REMOVED>
www.testpartners.co.uk
 
Connect to me on LinkedIn - http://uk.linkedin.com/in/stevegreen2