muicss/mui

Problem with stealing focus back to the select box

Open

#128 opened on Aug 9, 2016

View on GitHub
 (4 comments) (0 reactions) (0 assignees)JavaScript (4,524 stars) (441 forks)batch import
bughelp wantedpriority: high

Description

Problem reproduction: Go to the forms example and open the menu of a select control. Than click on the next input field below. The focus switches to the input field and later back to the select box.

In both the react- and the js-variant of mui-select you can find a statemen selectEl.focus(); It should refocus the select element after closing the corresponding menu. But if you close the menu by clicking into another control, the focus switches from the other control back to the select element. So the statement above should not be called if the menu is closed by not selecting a menu item.

Contributor guide

Tech stack
javascriptreact
Domain
frontendaccessibility
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
under 1 hour
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
MUI select component basicsUnderstanding of focus events
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75
Research direction
Investigate the select component in both the React and JavaScript variants. Locate the `selectEl.focus();` statement mentioned in the issue. Determine the condition under which the menu is closed (e.g., blur event, click outside) and modify the focus call to only execute when the menu is closed by choosing a selection, not when focus moves to another element. Refer to the forms example page for reproduction.