1932436 - Focus order of elements within story cards on the New Tab Page does not follow the visual reading order

Status: NEW

(Firefox :: New Tab Page, defect, P3)

Description

[Anna Yeddi [:ayeddi]]

Attachment: Accessibility Inspector of Firefox showing Tabbing order for the New Tab page card where the card itsel is marked as 29, the footer thumbs up/down buttons are 30-31, and the card's header are 32-33

Steps to reproduce

1. Navigate to the New Tab
2. Using keyboard alone, navigate from the first story card to the third and observe the visual focus movements

Expected behavior

1. Visual reading order is followed and, for the LTR language like English, it is left-to-right top-to-bottom, in the card's case it would be the following:
   1. Card itself
   2. (card's header) Save to Pocket
   3. (card's header) ... more options
   4. (card's footer) Thumbs Up
   5. (card's footer) Thumbs Down

Actual behavior

1. The focus is jumping first to the bottom of the card and then coming back to the top, making it confusing to follow the focus order and to set expectations for the keyboard-only navigation. The focus order for a card is the following (referencing from the "Expected" behavior section): 1 > 4 > 5 > 2 > 3.

Comment 1

[Anna Yeddi [:ayeddi]]

Oops, correcting the project assignment for the bug

Comment 2

[Maxx Crawford [:maxx]]

Triage reasoning:

• Severity: -- → S3: Work around exists for this issue
• Priority: -- → P3: Backlog