1892529 - Unable to focus radio button with Tab key if the first radio button is hidden,

Status: VERIFIED FIXED

(Core :: DOM: UI Events & Focus Handling, defect)

Description

[Alice0775 White]

Attachment: test.html

Steps to reproduce:

1. Open attached html
2. Press Tab key

Actual results:
Radio button would not get focus.

Expected Results:
Radio button gets focus. Google Chrome does.

Regression window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=efe1984e433c45c08394285def0b6ea943e9666e&tochange=58b9b5fc1b66092c32a6128f60ae2d4c2d44f9f4

Comment 1

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

:Jamie, since you are the author of the regressor, bug 1267488, could you take a look? Also, could you set the severity field?

For more information, please visit BugBot documentation.

Comment 2

[EarlgreyTea]

Attachment: test2.html

I report another case caused by bug 1267488.
Unable to focus cloned radio button with Tab key.

Steps to reproduce:

1. Open attached test2.html
2. Click "Clone" button.
3. Press Tab or Shift + Tab.

Actual results:
The radio button in the first row can be focused, but the cloned radio button cannot be focused

Expected Results:
The cloned radio button is focused with Tab key.

Comment 3

[James Teh [:Jamie]]

(In reply to EarlgreyTea from comment #2)

Actual results:
The radio button in the first row can be focused, but the cloned radio button cannot be focused

Expected Results:
The cloned radio button is focused with Tab key.

This is intentional. The cloned radio buttons are in the same group (where group is defined by the name attribute per the spec), so they should only be reachable with the arrow keys once you tab to the first button in the group. Note that before bug 1267488, this would also have been the case once any of the 4 radio buttons was checked.

Comment 4

[James Teh [:Jamie]]

Attachment: Bug 1892529: Skip hidden radio buttons when determining which radio button to focus.

This fixes two problems:

1. If no radio button is checked and the first radio button is hidden, tabbing will reach the first visible radio button in the group, rather than just skipping the group.
2. If you press down arrow or up arrow and the next/previous radio button is hidden, focus will move to the next/previous visible radio button in the group, rather than doing nothing.

Comment 5

[EarlgreyTea]

(In reply to James Teh [:Jamie] from comment #3)

This is intentional. The cloned radio buttons are in the same group (where group is defined by the name attribute per the spec),

Thank you for reply. I understand that this is an intentional behavior.
However, since the behavior is different from Chrome and Edge, I am considering whether to report it as a separate bug.
In Chrome and Edge, use the Tab key to move focus between the top and bottom radio buttons.
I think it's probably because it's inside another "div" element.

Comment 6

[James Teh [:Jamie]]

I'd argue this is a bug in Chromium. It does treat them as the same group, as evident in the fact that down arrow from the second radio button moves to the third radio button. If they're in the same group, tab should only reach one item in the group. Furthermore, if you check one of the radio buttons, only that radio button is tabbable, which further suggests these are intended to be treated as a single group.

Comment 7

[EarlgreyTea]

Apparently, my "test2.html" code was not realistic. After cloning, I am placing it in the same document without changing the name property.
Therefore, I don't think it will be a problem on a actual site.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/9ecb7d743524
Skip hidden radio buttons when determining which radio button to focus. r=smaug

Comment 9

[James Teh [:Jamie]]

Attachment: Bug 1892529: Add display: none tests for radio button focus.

Comment 10

[Aron Cseh]

https://hg.mozilla.org/mozilla-central/rev/9ecb7d743524

Comment 11

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

The patch landed in nightly and beta is affected.
:Jamie, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
• If no, please set status-firefox126 to wontfix.

For more information, please visit BugBot documentation.

Comment 12

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/96318b9c6170
Add display: none tests for radio button focus. r=smaug

Comment 13

[Natalia Csoregi [:nataliaCs]]

https://hg.mozilla.org/mozilla-central/rev/96318b9c6170

Comment 14

[Ardelean Oana, Desktop Test Engineering [:oardelean]]

Issue is reproducible on a 2024-04-19 Nightly build on Windows 10.
Verified as fixed on Firefox Nightly 128.0a1 and Firefox 127.0b4 on Windows 10, macOS 12, Ubuntu 22.