Skip to content

[Accessibility] Saved Object Finder tab order is unpredictable #12484

Description

@cjcenizal

saved_object_finder_tabbing

In the above animation, I've started out with focus on the search input. I then tab forward and backward through the interactive elements in this UI. For forward tab order is:

  1. Input
  2. First list item
  3. Anchor tag within the the first list item
  4. Anchor tag within the the second list item

Backward tab order is:

  1. Anchor tag within the the second list item
  2. Anchor tag within the the first list item
  3. "Add new visualization" button
  4. Input

Ideally, the forward tab order shouldn't contain redundant/confusing selections (e.g. both the list item and the anchor within it), and the backward tab order should be the simple reverse of the forward tab order:

  1. Input
  2. "Add new visualization" button
  3. Anchor tag within the the first list item
  4. Anchor tag within the the second list item

We can probably address this by removing the keyboard-accessibility logic identified in #12483, and simply relying upon the default browser-defined tab order.

Activity

  1. stacey-gammon commented on Jul 27, 2017

    @stacey-gammon

    ++ to removing that extra logic which seems to mess everything up. Works as expected with it gone.

  2. cjcenizal commented on Jul 27, 2017

    @cjcenizal
    ContributorAuthor

    @timroes Just CC'ing you on this because I know you're very interested in creating intuitive navigation with complex components like these. Feel free to review the code and chime in if you think it's worth refactoring and debugging it. Personally, I think it's OK to remove it and use the default tabbing behavior for now, and then implementing custom keyboard navigation later in a cleaner/reusable fashion.

  3. added
    bugFixes for quality problems that affect the customer experience
    on Jul 28, 2017
  4. timroes commented on Aug 2, 2017

    @timroes
    Contributor

    #12890 is also caused by this issue.

    I would agree with @cjcenizal that it might be the best solution for now to return to regular tab order and have a discussion how we want to handle all that kind of lists accessibility and usability wise (and implement this in a reusable component in the end).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Project:AccessibilitybugFixes for quality problems that affect the customer experience

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions