gregnb / gregnb/mui-datatables

Filter chip close button is not able to access through keyboard tab key

Open
#1,687 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
2.7k
Forks
906
PR merge metrics
No merged PRs in 30d

Description

## Expected Behavior
The filter chip should be closable using the keyboard ( "tab click" for selecting "enter key" click for closing )

## Current Behavior
When using the tab the filter chip will be focused but when click the enter key the chip is not closing.

## Steps to Reproduce (for bugs)

1. add some filter to the table , then the chip will be added to the top of the table.
2.
Screenshot 2021-03-25 at 11 17 26 AM

3. try to select the chip using the tab key in keyborad.
4. After the chip got seletected( using tab key ) try to close the chip using the enter key .

## Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | |
| MUI-datatables | 2.13.2 |
| React | 16.9.0 |
| browser | All |
| etc | |

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reproducing the filter-chip flow in MUI-datatables 2.13.2: focus a chip with Tab and press Enter. Inspect the filter-chip implementation and its keyboard behavior; done means the focused chip closes and the filter is removed when Enter is pressed.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
accessibility, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.