parse-community / parse-dashboard

A dashboard for managing Parse Server
https://parseplatform.org
Other
3.73k stars 1.38k forks source link

fix: Keyboard accessibility is broken in filter dialog in data browser #2482

Open AshishBarvaliya opened 1 year ago

AshishBarvaliya commented 1 year ago

Issue Description

Closes: #2469

Approach

The keyboard accessibility code was present, but unfortunately, it wasn't functioning due to a bug.

parse-github-assistant[bot] commented 1 year ago

Thanks for opening this pull request!

uffizzi-cloud[bot] commented 1 year ago

Uffizzi Ephemeral Environment deployment-29584

:watch: Updated Jun 27, 2023, 21:42 UTC

:cloud: https://app.uffizzi.com/github.com/parse-community/parse-dashboard/pull/2482

:page_facing_up: View Application Logs etc.

What is Uffizzi? Learn more

AshishBarvaliya commented 1 year ago

I have implemented the basic selection functionality, such as moving up, down, and using the enter key for selection. However, I will make the necessary updates as per your suggested flow.

  1. Hit key F -> filter dialog opens.
  2. Enter em -> fields email and email2 shows in list.
  3. Hit arrow down key -> field email is selected.
  4. Hit Enter key -> search filter is applied (like clicking the "Apply" button)

source: #2478

mtrezza commented 1 year ago

The keyboard accessibility code was present, but unfortunately, it wasn't functioning due to a bug.

Hah, who would have thought! Thanks for looking into this.

mtrezza commented 1 year ago

Could you also add that when hitting the Tab key the focus jumps from the filter text input field to the condition field? See step 4 below:

  1. Hit key F -> filter dialog opens.
  2. Enter em -> fields email and email2 shows in list.
  3. Hit arrow down key -> field email is selected.
  4. Hit Tab key -> condition field is in focus and drop down opens ("key exists", "key does not exist", etc.)

For me it currently sets the focus to the browser address bar when hitting Tab.

And could you change the selection style from the current dark blue text color to only changing the background color of the selected field? I would use one of the blue colors that we already have.

image
mtrezza commented 1 year ago

@AshishBarvaliya Could you resolve the conflicts so we can get this ready for merge?

mtrezza commented 3 months ago

@AshishBarvaliya Do you think we could get this merged? It seems to be ready, just the conflicts.