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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

WIP: Add keyboard accessibility to gitea #8555

Closed
wants to merge 7 commits into from
Closed

WIP: Add keyboard accessibility to gitea #8555

wants to merge 7 commits into from

Conversation

Jookia
Copy link
Contributor

@Jookia Jookia commented Oct 17, 2019

Most of the discussion for this is in https://github.com/go-gitea/gitea#7057 , but this patch set does a few things:

  1. Make dropdown menus nicer to tab through by fixing their tabindexes
  2. Setting all buttons to be tabbable
  3. Fix key capturing by adding role=menuitem to some dropdowns
  4. Flatten the dashboard context switch menu so it can be navigated using the keyboard
  5. Make dropdowns clickable using the keyboard

Currently this is done using jQuery code when loading the document, but ideally most of this would be edits of the template code once this is confirmed to not break things.

This also edits the semantic UI code which is minified, though I provide a diff of the source code in the commit message. I'm also unsure if #3 should be included right now or left for a screen reader WIP.

I have only tested this manually using Firefox 69 on Ubuntu 19.04 with Orca master, so testing to see if this breaks anything would be great.

This is a bit of a workaround, but it saves editing a ton of HTML for
now.
This signals to Orca to send keydown events for all keys, so now Orca's
caret mode will properly allow navigation through menus.
This makes the 'create organization' link keyboard accessible
The actual non-minified diff looks like this:

--- semantic.js.bak     2019-10-17 12:12:06.027276089 +1100
+++ semantic.js 2019-10-17 13:25:31.702478323 +1100
@@ -5613,6 +5613,7 @@
                   module.set.scrollPosition($choice);
                 }
+                this.click();
                 module.determine.selectAction.call(this, text, value);
               }
             }
           },
@Jookia
Copy link
Contributor Author

Jookia commented Oct 17, 2019

I'm unsure about the last commit since it doesn't fix cases where dropdown menus are used as visual indicators (accordian UIs) mostly, and can't be clicked by the UI. I think I need to dig a bit deeper on that.

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Oct 17, 2019
@Jookia
Copy link
Contributor Author

Jookia commented Oct 19, 2019

I'm going to close this for now and split this up in to smaller patches.

@Jookia Jookia closed this Oct 19, 2019
@go-gitea go-gitea locked and limited conversation to collaborators Nov 24, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants