Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Outreachy Task Submission] Remove Extra Focus From Add Buttons On Keyboard Navigation #982

Open
wants to merge 2 commits into
base: development
Choose a base branch
from

Conversation

Aquilaafuadajo
Copy link
Contributor

@Aquilaafuadajo Aquilaafuadajo commented Mar 29, 2024

Resolves #4902
Description
Currently the add new buttons behave weirdly when navigating using just keyboard. The button has to be tabbed twice before it responds to the enter event.

Why does this happen?
This happens because the mizima-client-buttons in this cases are router links and router links come with their own focus when tabbed into, so this focus + the buttons default focus results in tabbing twice before the button responds to the enter event.

Fix
Set tabindex to -1 on mizima-client-buttons when it's being used as a router link to prevent this extra focus.

How to test

  1. Go to the staging: https://mzima-dev.staging.ush.zone/settings/surveys
  2. Using the keyboard, navigate to "add survey" button (notice you have to tab twice before it responds)
  3. Switch to this branch and perform the same action in step 2 (notice the extra focus is no longer needed)

This fix covers surveys, users, roles, categories, webhooks and data sources

@Angamanga This pr is ready for review 馃檹馃徑

@Aquilaafuadajo Aquilaafuadajo changed the title fix extra focus on add buttons [Outreachy Task Submission] Remove Extra Focus From Add Buttons On Keyboard Navigation Mar 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Outreachy Task Submission] Remove Extra Focus From Add Buttons On Keyboard Navigation
1 participant