react-component / react-component/dropdown

Dropdown is causing Input to lose focus when the menu opens @3.2.3

Open
#194 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
181
Forks
112
Avg merge
12h 52m
Merged PRs (30d)
2

Description

Hello, here's how im using the Dropdown from antd:

const [menuVisible, setMenuVisible] = useState(false);

const onInputFocus = useCallback(() => setMenuVisible(true), []);
const onInputBlur = useCallback(() => setMenuVisible(false), []);

<Dropdown overlay={OptionMenu} visible={menuVisible}>
  <Input
    className={styles.input}
    onFocus={onInputFocus}
    onBlur={onInputBlur}
  />
</Dropdown>

And I can confirm that every time the Dropdown opens, the onBlur on Input is triggered.

The issue is introduced in version @3.2.3, and I reverted back to use version @3.2.2 and the issue is fixed.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the controlled Dropdown and Input example from the issue, then compare focus behavior between versions 3.2.2 and 3.2.3. Trace the Dropdown changes that occur when the menu opens and add coverage showing that opening it does not trigger the Input's blur callback; done means the input retains focus in the reported setup.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.