HTML popover API: Tabbing doesn't work for input date inside of a popover
Categories
(Core :: Layout: Form Controls, defect)
Tracking
()
People
(Reporter: goostew626, Unassigned)
Details
Steps to reproduce:
Using example HTML Markup for a minimal popover :
<div>
<button popovertarget="examplePopover">Open Popover</button>
</div>
<div id="examplePopover" popover>
<div>
<input type="date" />
</div>
<div>
<input type="text" />
</div>
</div>
Clicking the "Open Popover" button, will correctly open the popover.
Tried using Tab and Shift-Tab to move focus through the input date and input text.
Pressing the Tab key will correctly move the focus to the first segment of the input date.
Pressing the Tab key again will unexpectedly ignore any following segments of the input date as well as any focus applicable elements (such as other inputs/buttons)
Actual results:
After the popover has been opened.
Pressing the Tab key will correctly move the focus to the first segment of the input date.
Continuing to press the Tab key will move the focus between all of the input date segments but it will never leave the input date and move the focus to the input text. Instead it will restart and go back to the first segment of the input date.
However, the Shift-Tab key will correctly move the focus backward between the input date segments and leave the input to put the focus back onto the "Open Popover" button.
Expected results:
I expected the Tab and Shift-Tab keys to work the same for input dates as they would if the two inputs were not inside of a popover.
I expected pressing the Tab key would move the focus between the input date segments until leaving the input date and then moving focus to the next input (in this case the input text)
Comment 1•1 month ago
|
||
The Bugbug bot thinks this bug should belong to the 'Core::Layout: Form Controls' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.
Comment 2•1 month ago
|
||
Yeah, there's an odd asymmetry in the behavior here: I'm seeing that Shift-TAB cycles backwards through all the focusable elements (the text field in the popover, backwards through the date segments, and back to the button), whereas (forward-)TAB gets "stuck" in the date input.
Description
•