Skip to content

HTML AAM: how to handle attributes and aria-* on button/selectedoption within a select #2368

Closed
@scottaohara

Description

@scottaohara

Consider the following:

<label for=s>Choose a fruit</label>
<select id=s aria-label="choose a fruit you want to eat">
  <button aria-label="you chose" title="a bit much, no?">
     Choose:
     <selectedoption title=delicious>Fruit name here</selectedoption>
  </button>
  ...
</select>

The visible label/name from the label element is "choose a fruit"

the select's name becomes "choose a fruit you want to eat" from its aria-label.

but the inner button element has the word "choose" within it
the button also has an aria-label of "you chose" and "a but much, no?" as a title/desc
the selectedoption has its own title attr of "delicious"

will someone do all this at once? only if they're sick like me. but people will think they can do these things, individually.
but should they be allowed to?

A select / its button part - in the chromium implementation and how they're going to be described in HTML AAM, are effectively 1 item in the a11y tree. Naming the button part / including text a description for it would be in conflict with anything declared on the select parent. Moreover, there's a possibility that "renaming" or modifying the select's name isn't even the goal of a developer in this instance - but rather, they're adding in content that is superfluous to expose, or is meant to be more of a "hint", extension or overwriting of the chosen value.

IMO, but very curious what others think, I'm not seeing the benefit to respecting aria attributes on the button/selectedoption parts of the select. i do see value in "guessing" that the extra text in the button, as a sibling to the selectedoption, might be a "hint". edit: but in the open ui call, people might also want the entire contents of the button to be the actual value. or, maybe they don't want to have a visible value at all, in which case, no value should be stated? (more in comment below)

if doing something more complex with this, though, we run into some interesting scenarios of needing to decide what takes precedence for naming / describing / changing the value of the select...

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions