callstack/react-native-paper

Opening a Menu from a TextInput anchor on the web unfocuses the anchor

Open

#2,903 opened on Sep 15, 2021

View on GitHub
 (10 comments) (1 reaction) (0 assignees)TypeScript (2,005 forks)batch import
Hacktoberfestrepro provided

Repository metrics

Stars
 (11,550 stars)
PR merge metrics
 (Avg merge 8d 12h) (10 merged PRs in 30d)

Description

Current behaviour

When a Menu has a TextInput as an anchor, if that input's onFocus is used to open the menu, it becomes unfocused.

Expected behaviour

This is not consistent with Android, where it keeps focus. It would be nice if it worked this way on the web too, so that a searchable dropdown can be implemented.

Code sample

https://snack.expo.dev/@pta2002/eb79e2

What have you tried

I have tried using a separate component (not the anchor) to trigger the menu, but it got unfocused as well. Either way, I think the behaviour should at least be consistent.

Your Environment

software version
ios or android Android 11
react-native 0.63.2
react-native-paper 4.9.2
node 14.17.6
npm or yarn npm 6.14.15
expo sdk 42.0.1

Contributor guide

Research direction
Investigate the Menu component's onFocus handling and check platform specific focus management in react native paper for web vs Android. Focus on how the anchor's focus is lost when the menu opens on web.
Tech stack
reactreact nativetypescript
Domain
frontend
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.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
React NativeTypeScriptGit
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75