We have a PWA (web app) that the user can add to the homescreen to make it look more like an app. Some users have reported a strange issue that only seems to appear on IOS sometimes when the following step has been made.
- Open the app from the homescreen
- Use the app for a while
- Put it into background
- Turn off the screen for a while
- Turn the screen back on and put the app to foreground again
The bug is that nothing seems to happen when you click on for example a select or date input control. First I thought that there was some overlay in the app that was blocking the ui controls but the elements receive focus when they are click, but not options is shown.
Now it becomes really strange. When I tried to click a little bit under the select input an option was selected. The same thing occured with a time select. If I first clicked on the timeselect input control and then a little bit under, it updated the time.
So, the controls seems to be there but nothing is visible on the screen. I have only been able to reproduce this on my own once but multiple users have been reporting the same thing. The only way to work around the bug is to restart the app.
It seems to be for all native safari controls that shows some kind of modal/popover.
a gif illustrating the issue is available in this stackoverflow question: https://stackoverflow.com/questions/70292301/ios-native-controls-invisible-hidden-in-pwa