[SpeedDial] First button flickers when opened on an iPhone
See original GitHub issueDuplicates
- I have searched the existing issues
Latest version
- I have tested the latest version
Current behavior 😯
When using the speed dial on a iPhone 12 the first SpeedDialAction button flickers when it opens:
Only able to produce this on iPhone (in Safari), when the button loads afterwards it works. On Android/Desktop it works as expected.
Edit: Also happens on iPhone 11, on latest version of iOS/Safari
Edit x 2: added a sandbox using simple speed dial https://codesandbox.io/s/reverent-cray-ey0x9w?file=/src/Demo.tsx
Expected behavior 🤔
For button to transition in without flickering
Steps to reproduce 🕹
Steps:
- Ran a fresh install of React (typescript)
- Install mui & mui icons
- Create a speed dial component
- Test on iPhone 12
Context 🔦
Create a web app which uses the MUI speed dial, the flickering is visual only
Your environment 🌎
`npx @mui/envinfo`
System: OS: macOS 12.3.1 Binaries: Node: 16.13.2 - ~/.nvm/versions/node/v16.13.2/bin/node Yarn: 1.22.17 - ~/.yarn/bin/yarn npm: 8.1.2 - ~/.nvm/versions/node/v16.13.2/bin/npm Browsers: Chrome: Not Found Edge: 99.0.1150.55 Firefox: Not Found Safari: 15.4 npmPackages: @emotion/react: ^11.9.0 => 11.9.0 @emotion/styled: ^11.8.1 => 11.8.1 @mui/base: 5.0.0-alpha.77 @mui/icons-material: ^5.6.2 => 5.6.2 @mui/material: ^5.6.2 => 5.6.2 @mui/private-theming: 5.6.2 @mui/styled-engine: 5.6.1 @mui/system: 5.6.2 @mui/types: 7.1.3 @mui/utils: 5.6.1 @types/react: ^18.0.0 => 18.0.5 react: ^18.0.0 => 18.0.0 react-dom: ^18.0.0 => 18.0.0 typescript: ^4.4.2 => 4.6.3
Issue Analytics
- State:
- Created a year ago
- Reactions:4
- Comments:8 (2 by maintainers)
Top GitHub Comments
Great! Let me know if you need any help.
Hii, I got the same issue to on iphone 13. The first button flicker once loaded and work fine as expected in browser devices.