[Popover] Changes position when typing in a text field in iOS Safari
Open
Nobody has claimed this yet.
component: Popover
scope: popup
type: bug
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
Duplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
When typing in the text field the Popover goes up
Expected behavior 🤔
It should stay on the anchor position I set
Steps to reproduce 🕹
Steps:
Example: https://codesandbox.io/s/basicmenu-material-demo-forked-8dyxn?file=/demo.tsx
- Open
https://8dyxn.csb.app/in iPhone - Click on textfield
- Type something
Also try with safari address bar on bottom position
Context 🔦
I want to add a TextField in the dropdown menu, I tried to use Menu and Popover, but I got the same issue.
Your environment 🌎
| Tech | Version |
|---|---|
| Material-UI | v5.2.0 |
| React | v17.0.2 |
| browser | Safari |
| device | iPhone |
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue on an iPhone in Safari using the linked CodeSandbox example, following the listed steps for the text field and bottom address bar. Compare the Popover position before and while typing; done means it remains at the configured anchor position without shifting.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100