2028665 - [a11y] Radio buttons not grouped due to improper HTML "name" attribute values used

Status: NEW

(Core :: Machine Learning: Frontend, defect)

Description

[John Northup]

Impacted Section/Element

Smart Window first-run page (Welcome to Smart Window)

Steps to Reproduce

In Advanced Preferences, set browser.smartwindow.enabled=true and browser.smartwindow.firstrun.hasCompleted=false.

From the Application Menu, click "New smart window". The Smart Window first-run page appears. While using a screen reader, navigate by keyboard through the three radio buttons (Fast, Flexible, Personal).

Expected Behavior

As keyboard focus moves through the three radio buttons (Fast, Flexible, Personal), screen reader users will hear that they are part of the same group, e.g., "1 of 3", "2 of 3", "3 of 3".

Actual Behavior

Although the three radio inputs are properly grouped within a <fieldset>, each radio input has a unique name (e.g., "select-item-model_3"). As a result, each radio input is announced as its own group; item "1 of 1" for each of the three.

User Impact

Screen reader users are given false information and are not immediately aware of how many radio inputs are actually in the group.

WCAG 2.2 References

• 1.3.1 Info and Relationships
• 4.1.2 Name, Role, Value

Recommendations

Give all three radio inputs the same name, e.g., name="select-item-model".

Testing Environment

Firefox Beta 150.0b2

Assistive Technology Used

all screen readers

Code Pointers

<input type="radio" name="select-item-model_1" class="sr-only input" value="model_1">
[...]
<input type="radio" name="select-item-model_2" class="sr-only input" value="model_2">
[...]
<input type="radio" name="select-item-model_3" class="sr-only input" value="model_3">

Further Reference

https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/radio

Severity

3-Moderate

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The severity field is not set for this bug.
:Mardak, could you have a look please?

For more information, please visit BugBot documentation.

Comment 2

[John Northup]

Unresolved: Model radio / select elements are still separate when read by screen reader.

Severity is 3-Moderate.