2

I'd like to design a textarea with autocomplete, because it is possible to enter there multiline addresses which can be filled by your available addresses.

The goal is to design it WCAG AA conform, but I saw that a role "combobox" with popup is not allowed on textareas!

Is there any solution you can provide to help me? Can be programmatically with JavaScript or pure HTML or TypeScript.

Heretic Monkey
  • 11,687
  • 7
  • 53
  • 122
Mila1611
  • 71
  • 1
  • 4

1 Answers1

0

After working with web accessibility for nearly 10 years, my experience is, if something is not supported either via the HTML og WAI ARIA documentation, there is often a good reason behind it.

First, a user who encounters a textarea, wouldn't expect that it have an autocomplete function. Second, a screen reader is optimised to follow the documentation. It is property possible to make the textarea work without a role="combobox" and get a screen reader to understand that it's a combobox. It might work on one screen reader, maybe two. And if you test it enough you might make it work on several browsers and OS.

But there are so may screenreader, browser and OS combinations. And you must consider that a lot of users use outdated software, and that count browsers, assistive technologies, and OS.

I've seen so many elements that doesn’t follow the documentation and give so many users a lot of problems, for example the button-element used as a drop down.

An element only must work with one major browser and one major assistive technology to be WCAG 2.1 conformance.

If I was you, I would make the three address lines in three different input-elements, and follow the WAI-ARIA Authoring Practices for combobox with listbox popup: https://www.w3.org/TR/wai-aria-practices-1.1/examples/combobox/aria1.1pattern/listbox-combo.html